Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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. enter image description here

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?

like image 555
Sam Avatar asked Nov 28 '18 20:11

Sam


People also ask

Can I remove manifest JSON?

Yes, you should be completely fine deleting the manifest.

What is manifest JSON in CRA?

The web app manifest provides information about an application (such as name, author, icon, and description) in a JSON text file. The purpose of the manifest is to install web applications to the homescreen of a device, providing users with quicker access and a richer experience. 175.

Where does manifest JSON come from?

The manifest. json is a simple JSON file in your website that tells the browser about your website on user's mobile device or desktop. Having a manifest is required by Chrome to show the Add to Home Screen prompt.

Does not have a manifest JSON file?

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. This should be the accepted answer.


8 Answers

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.

ie

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

and remove it from the code to stop the error.

Reference Web App Manifest

like image 146
Nkosi Avatar answered Sep 21 '22 01:09

Nkosi


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: enter image description here

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.

like image 39
Jon Crowell Avatar answered Sep 21 '22 01:09

Jon Crowell


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

like image 44
Nikolay Bronskiy Avatar answered Sep 19 '22 01:09

Nikolay Bronskiy


Ok, just do the following:

Simply replaced the call:

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

by

<link rel="manifest" href="manifest.json" crossorigin="use-credentials">
like image 22
Josue Barrios Avatar answered Sep 19 '22 01:09

Josue Barrios


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.

like image 33
Marc Avatar answered Sep 21 '22 01:09

Marc


In my case, using React with asp.net core and identity, I started getting this error when setting my entire app to require authentication via Startup.cs.

services.AddAuthorization(options =>
        {
            options.FallbackPolicy = new AuthorizationPolicyBuilder()
                .RequireAuthenticatedUser()
                .Build();
        });

This was causing the manifest syntax error, because my Index.html was referencing the manifest.json like so:

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

My app did not have sufficient permissions to access the file after requiring authentication for all pages.

TLDR; Even if your referenced manifest files exists, ensure you are authorized to access it from your app.

like image 31
jjspierx Avatar answered Sep 19 '22 01:09

jjspierx


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

enter image description here

like image 26
Glen Little Avatar answered Sep 17 '22 01:09

Glen Little


I had the same issue with an error in Lighthouse looking for the file 'asset-manifest.json'. The quick option was to create an empty file with that name, which will get rid of the error.

like image 28
Kirby Howarth Avatar answered Sep 20 '22 01:09

Kirby Howarth