Angular black screen on Azure #8434

optixdev created 4 years ago

I followed exactly same steps from - https://docs.aspnetzero.com/en/aspnet-core-angular/latest/Deployment-Angular-Publish-Azure

API is running with swagger but Angular is displaying blank page.

<!doctype html>
<html lang="en" dir="ltr">
<head prefix="og: http://ogp.me/ns#">
    <meta charset="utf-8">
    <title>dan</title>
    <base href="/">

    <meta property="og:title" content="dan" />
    <meta property="og:image" content="" />
    <meta property="og:description" content="Base solution for your next web application" />
    <meta property="og:url" content="">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="author" content="">
    <meta name="description" content="">
    <link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="styles.fdf0b8e2255f1f6e49a205.css"></head>
<body>
    <app-root></app-root>
<script src="runtime.d7b1cf525c1f16f4100b99.js" defer></script><script src="polyfills-es5.e1535fd9be30ff843454f.js" nomodule defer></script><script src="polyfills.ff5db258a5fdbd0d317c.js" defer></script><script src="scripts.9c63503c410b294b9980.js" defer></script><script src="main.2ad1ef9e0e64faafe47b6.js" defer></script></body>
</html>

7 Answer(s)

0

maliming created 4 years ago
Support Team

hi

Can you look at the browser console? Are there any error messages?
0

optixdev created 4 years ago

** Also its a BLANK screen not black**

This is the error from console:

Access to XMLHttpRequest at 'https://optix-app.azurewebsites.net//AbpUserConfiguration/GetAll?d=1580714316585' from origin 'http://optix-app.azurewebsites.net' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. //AbpUserConfiguration/GetAll?d=1580714316585:1 Failed to load resource: net::ERR_FAILED
0

maliming created 4 years ago
Support Team

hi @optixdev Are you using Single solution(Merges AngularUI and Host projects into a single solution)?

Your application seems to have other problems. Can you look at the logs?
0

optixdev created 4 years ago

Hi I am using the seprate solutions (Angular + Web Host)

On Azure WebHost is working fine I can able to access the Swagger but there is a problem with Angular. I tried to fix the CORS, but now I am getting this error:

main.2ad1e9e0e64faafe47b6.js:1 ERROR SyntaxError: Unexpected token < in JSON at position 0 at JSON.parse ()

at XMLHttpRequest.o.onreadystatechange [as _zone_symbol__ON_PROPERTYreadystatechange] (main.2ad1e9e0e64faafe47b6.js:1) at XMLHttpRequest. (polyfills.ff5db258a5fdbd0d317c.js:1) at t.invokeTask (polyfills.ff5db258a5fdbd0d317c.js:1) at Object.onInvokeTask (main.2ad1e9e0e64faafe47b6.js:1) at t.invokeTask (polyfills.ff5db258a5fdbd0d317c.js:1) at e.runTask (polyfills.ff5db258a5fdbd0d317c.js:1) at e.invokeTask [as invoke] (polyfills.ff5db258a5fdbd0d317c.js:1) at p (polyfills.ff5db258a5fdbd0d317c.js:1) at XMLHttpRequest.h (polyfills.ff5db258a5fdbd0d317c.js:1) Ei @ main.2ad1e9e0e64faafe47b6.js:1 e.handleError @ main.2ad1e9e0e64faafe47b6.js:1 next @ main.2ad1e9e0e64faafe47b6.js:1 o @ main.2ad1e9e0e64faafe47b6.js:1 t.__tryOrUnsub @ main.2ad1e9e0e64faafe47b6.js:1 t.next @ main.2ad1e9e0e64faafe47b6.js:1 t._next @ main.2ad1e9e0e64faafe47b6.js:1 t.next @ main.2ad1e9e0e64faafe47b6.js:1 t.next @ main.2ad1e9e0e64faafe47b6.js:1 t.emit @ main.2ad1e9e0e64faafe47b6.js:1 (anonymous) @ main.2ad1e9e0e64faafe47b6.js:1 t.invoke @ polyfills.ff5db258a5fdbd0d317c.js:1 e.run @ polyfills.ff5db258a5fdbd0d317c.js:1 e.runOutsideAngular @ main.2ad1e9e0e64faafe47b6.js:1 onHandleError @ main.2ad1e9e0e64faafe47b6.js:1 t.handleError @ polyfills.ff5db258a5fdbd0d317c.js:1 e.runTask @ polyfills.ff5db258a5fdbd0d317c.js:1 e.invokeTask @ polyfills.ff5db258a5fdbd0d317c.js:1 p @ polyfills.ff5db258a5fdbd0d317c.js:1 h @ polyfills.ff5db258a5fdbd0d317c.js:1 XMLHttpRequest.send (async) _ @ polyfills.ff5db258a5fdbd0d317c.js:1 t.scheduleTask @ polyfills.ff5db258a5fdbd0d317c.js:1 onScheduleTask @ polyfills.ff5db258a5fdbd0d317c.js:1 t.scheduleTask @ polyfills.ff5db258a5fdbd0d317c.js:1 e.scheduleTask @ polyfills.ff5db258a5fdbd0d317c.js:1 e.scheduleMacroTask @ polyfills.ff5db258a5fdbd0d317c.js:1 f @ polyfills.ff5db258a5fdbd0d317c.js:1 (anonymous) @ polyfills.ff5db258a5fdbd0d317c.js:1 I.i. @ polyfills.ff5db258a5fdbd0d317c.js:1

e.ajax @ main.2ad1e9e0e64faafe47b6.js:1 e.getApplicationConfig @ main.2ad1e9e0e64faafe47b6.js:1 e.run @ main.2ad1e9e0e64faafe47b6.js:1 (anonymous) @ main.2ad1e9e0e64faafe47b6.js:1 t @ polyfills.ff5db258a5fdbd0d317c.js:1 (anonymous) @ main.2ad1e9e0e64faafe47b6.js:1 e.runInitializers @ main.2ad1e9e0e64faafe47b6.js:1 (anonymous) @ main.2ad1e9e0e64faafe47b6.js:1 (anonymous) @ main.2ad1e9e0e64faafe47b6.js:1 t.invoke @ polyfills.ff5db258a5fdbd0d317c.js:1 onInvoke @ main.2ad1e9e0e64faafe47b6.js:1 t.invoke @ polyfills.ff5db258a5fdbd0d317c.js:1 e.run @ polyfills.ff5db258a5fdbd0d317c.js:1 e.run @ main.2ad1e9e0e64faafe47b6.js:1 e.bootstrapModuleFactory @ main.2ad1e9e0e64faafe47b6.js:1 dC @ main.2ad1e9e0e64faafe47b6.js:1 zUnb @ main.2ad1e9e0e64faafe47b6.js:1 r @ runtime.d7b1c525c116f4100b99.js:1 0 @ main.2ad1e9e0e64faafe47b6.js:1 r @ runtime.d7b1c525c116f4100b99.js:1 f @ runtime.d7b1c525c116f4100b99.js:1 c @ runtime.d7b1c525c116f4100b99.js:1 (anonymous) @ main.2ad1e9e0e64faafe47b6.js:1 Show 22 more frames
0

optixdev created 4 years ago

I think its the same problem, but I dont know the solution - https://support.aspnetzero.com/QA/Questions/8429
0

maliming created 4 years ago
Support Team

main.2ad1e9e0e64faafe47b6.js:1 ERROR SyntaxError: Unexpected token < in JSON at position 0 at JSON.parse ()

Can you check the logs of the application?
0

ismcagdas created 4 years ago
Support Team

This issue is closed because of no recent activity. Please create a new issue if you are still having this problem.

Have an answer to this question? Log in and write your answer.