-1

My code was been working smoothly,but after adding react form validation ,it shows the following on browser while building the project. Browser error and Console

 **Index.html file**
 <!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Angular Routing</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>
</body>

 </html>

I am sure that there is no errors with my code.But,I don't know how to solve it.Is there anyone who can help me figure my issue and solve it?

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197
Petros Belachew
  • 37
  • 1
  • 10

3 Answers3

0

refer to this question on stackoverflow. You might have said you can only load scripts from your own site (self). You need to change that in the <meta http-equiv= ...> tag

spykid10005
  • 1
  • 1
0

Check if you have <meta http-equiv="Content-Security-Policy" content="..." > tag in you index file.

Remove it and reload the page again.

mudgal
  • 21
  • 2
0

Cannot GET / - looks like you do not have a routing to / on server or is missed /favicon.ico file.
Some servers with NodeJS will not automatically serve files in the root directory. If resource is not found ('404 Not found' pages), NodeJS lauch finalhandler, nitty-gritty is here. Last versions of this finalhandler publishes CSP default-src 'none' therefore it triggers CSP violation like:

Refused to load the image 'http://localhost:xxxx/favicon.ico' because it violates the following Content Security Policy directive: "default-src 'none'"

Previous versions of finalhandler had CSP default-src 'self' so you saw just 404 Not found unaccompanied the CSP error.
The same error occurs when migration to Angular 8, because it uses NodeJS with latest finalhandler.

Check if http://localhost/favicon.ico file presents and you do have a routing to serve files at the web root /.

granty
  • 7,234
  • 1
  • 14
  • 21
  • The file was already existing on my directory.But when open from http://localhost/favicon.ico , it doesn't open. – Petros Belachew Feb 27 '21 at 12:57
  • You need to specify port number, for example `localhost:4200/favicon.ico` or what port nbr you use on server. If you get 404 not found - there is no route to `/`on server. I do not know what you use as server, but Express, for example, does not serve the root folder by default. For Express you need to add `app.get("/favicon.ico", (req, res) => { res.sendFile(path.resolve(__dirname, "/favicon.ico")); });`. Check do you serve a route to `/` on your server. – granty Feb 27 '21 at 16:18