Why is my json file not found?

Jqueryasp.netJsonGoogle Chrome-Devtools

Jquery Problem Overview


I have a json file in a Content folder within my asp.net project:

<projectName>
	\Content
		NBCCJr.json

...and the code to access it:

$.getJSON('~/Content/NBCCJr.json', function (data) {
    $.each(data, function(i, dataPoint) {
        // Bla
      });
  });
)

...but nothing happens when the code is called; the browser console says, "Failed to load resource: the server responded with a status of 404 (Not Found)"

Why is it not found? Isn't "tilde whack filename" the correct route to the file?

UPDATE

I also tried it with the "whacks" backwards:

$.getJSON('~\Content\NBCCJr.json', function (data) {

...and got the same result ("Failed to load resource: the server responded with a status of 404 (Not Found)")

UPDATE 2

Then I tried it sans a prepended whack thusly:

$.getJSON('Content/NBCCJr.json', function (data) {

...and I get this ambiguous message in the console:

*GET http://localhost:9702/Content/NBCCJr.json 404 (Not Found) jquery.js:8724
XHR finished loading: "http://localhost:9702/Content/NBCCJr.json".*

So it was not found and yet loaded anyway?

UPDATE 3

When I attempted to navigate to the file in the browser by changing:

http://localhost:9702/Default.cshtml

...to:

http://localhost:9702/Content/NBCCJr.json

I got an informative WSOD message from Vint Cerf, Tim Berners-Lee, and/or Al Gore saying:

HTTP Error 404.3 - Not Found The page you are requesting cannot be served because of the extension configuration. If the page is a script, add a handler. If the file should be downloaded, add a MIME map.

UPDATE 4

Thanks to JAM, it is now working.

I had to add this to Web.Config:

  <system.webServer>
    <staticContent>
      <mimeMap fileExtension=".json" mimeType="application/json" />
    </staticContent>
  </system.webServer>

Jquery Solutions


Solution 1 - Jquery

Have you tried removing the ~ ?

As in:

$.getJSON('/Content/dumboJr.json', function (data) {
    $.each(data, function(i, dataPoint) {
        // Bla
      });
  });
)

To allow the IIS to serve JSON files, try adding this to your web.config:

<staticContent>
    <mimeMap fileExtension=".json" mimeType="application/json" />
</staticContent>

Solution 2 - Jquery

Solution is you need to add json file extension type in MIME Types

Method 1

Go to IIS, Select your application and Find MIME Types

enter image description here

Click on Add from Right panel

File Name Extension = .json

MIME Type = application/json

enter image description here

After adding .json file type in MIME Types, Restart IIS and try to access json file


Method 2

Go to web.config of that application and add this lines in it

 <system.webServer>
   <staticContent>
     <mimeMap fileExtension=".json" mimeType="application/json" />
   </staticContent>
 </system.webServer>

Solution 3 - Jquery

Try putting the *.json file in the webRoot, not in a sub folder. And then reference it like:

$.getJSON('NBCCJr.json', function (data) {

This of course requires the previous inclusion and instantiation of the jQuery system object from: jquery.min.js or the JSON structure from: json2-1.0.min.js

Solution 4 - Jquery

I Changed .json to .txt and request is working fine. I am not sure about the consequence .txt can cause.

Solution 5 - Jquery

If you use ASP.NET Core, just put the file in wwwroot but if you use ASP.NET framework, this allows JSON extension from web.config as follows:

<staticContent>
    <mimeMap fileExtension=".json" mimeType="application/json" />
</staticContent>

and

<location path="Content">
    <system.web>
        <authorization>
            <allow users="*" />
        </authorization>
    </system.web>
</location>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionB. Clay Shannon-B. Crow RavenView Question on Stackoverflow
Solution 1 - JqueryJAMView Answer on Stackoverflow
Solution 2 - JqueryKaushal KhamarView Answer on Stackoverflow
Solution 3 - JqueryPaul MillesonView Answer on Stackoverflow
Solution 4 - JqueryPankajView Answer on Stackoverflow
Solution 5 - JqueryMoaz SalemView Answer on Stackoverflow