Can't get rid of missing manifest.json error

问题

I'm building an ASP.NET Core app with ReactJs front-end in Visual Studio 2017.

Recently, I started to notice the missing manifest.json error in the console -- see below. It doesn't seem to effect my app but I do want to get rid of this error.

If I view my app in Edge, I don't see the missing manifest.json error so this error seems to be contained to Chrome only.

I published the app to Azure and again, in Chrome, I'm getting the same error but not in Edge.

Any idea how I can solve it?

回答1:

Most probably there is a reference to manifest.json somewhere in the project, while the file/resource itself does not exist.

Check to see if you have any link tags with rel=manifest similar to

<link rel="manifest" href="/manifest.webmanifest">

The .webmanifest extension is specified in the Media type registration section of the specification, but browsers generally support manifests with other appropriate extensions like .json.

<link rel="manifest" href="/manifest.json">

and remove it from the code to stop the error.

Reference Web App Manifest

回答2:

The manifest.json file is likely where it's supposed to be. The solution is to add an entry in your web.config file under the static content section for .json files.

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
  <system.webServer>
    <staticContent>
      <mimeMap fileExtension=".json" mimeType="application/json" />
  </staticContent>
</system.webServer>
</configuration>

If you need to add or edit your web.config file, you can do so using the Kudu debug console. (Replace yourapp with your app in the link)

You can also launch the debug console from the portal under Development Tools for your app:

If the manifest.json file is actually missing, you can fix that by following Google's instructions for adding a manifest.json file.

The Web App Manifest is required by Chrome to enable the Add to Home Screen prompt in a web app.

回答3:

just add crossorigin="use-credentials" so it will look like: <link rel="manifest" href="/site.webmanifest" crossorigin="use-credentials">

回答4:

For those hunting and there is no logical solution, try in a different broswer or incognito mode. I had a persistent error for this file and it was a (junk) plugin for Chrome. I see this a lot in JS via poor packaging or debuggers left on, and other offenses. Pay attention as JS is a very dangerous and difficult language.

回答5:

In react you might find manifest.json in your public folder and a link to this file in index.html.

manifest.json provides metadata used when your web app is installed on a user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/

<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

回答6:

As the same error happened after uploading the React client in my case to Google app engine, while manifest JSON was present, updating app.yaml saved the situation:

  - url: /(.*\.(js|css|png|jpg|svg|json|ico|txt))$
    secure: always
    static_files: build/\1
    upload: build/.*\.(js|css|png|jpg|svg|json|ico|txt)$

回答7:

IIS can also restrict files by extension. Check to make sure .json is not listed there!

来源：https://stackoverflow.com/questions/53527972/cant-get-rid-of-missing-manifest-json-error

标签

reactjs

visual-studio

google-chrome

asp.net-core

manifest.json