I'm trying to fetch a custom JSON feed I have written with jQuery using the getJSON method. For an unknown reason the URL seems to be having cache_gen.php?location=PL4 stripped from the end and replaced with [object%20Object] resulting in a 404 error occurring.

Here's the jQuery I'm using:

var fetchData = function() {

    if (Modernizr.localstorage) {

        var api_location = "/cache_gen.php";
        var user_location = "PL4";
        var date = new Date();

        console.log(api_location + '?location=' + user_location);

        jQuery.getJSON({
            type: "GET",
            url: api_location + '?location=' + user_location,
            dataType: "json",
            success: function(jsonData) {
                console.log(jsonData);
            }
        });

    } else {
        alert('Your browser is not yet supported.  Please upgrade to either Google Chrome or Safari.');
    }
}

fetchData();

From the console log I can see the URL string is calculated correctly as: /cache_gen.php?location=PL4

However the second line in the console is: Failed to load resource: the server responded with a status of 404 (Not Found).

Can anyone point me in the right direction with this?

UPDATE 19/01/2013 23:15

Well, I've just converted so that is fits the docs perfectly using $.ajax. I've also added a fail event and logged all of the data that gets passed to it.

var fetchData = function() {

    if (Modernizr.localstorage) {

        var api_location = "/cache_gen.php";
        var user_location = "PL4";
        var date = new Date();

        var url = api_location + '?location=' + user_location;

        console.log(url);

        jQuery.ajax({
            type: "GET",
            url: api_location + '?location=' + user_location,
            dataType: "json",
            success: function(jsonData) {

                console.log(jsonData);
            },
            error: function( jqXHR, textStatus, errorThrown ) {
                console.log('textStatus: ' + textStatus );
                console.log('errorThrown: ' + errorThrown );
                console.log('jqXHR' + jqXHR);
            }
        });

    } else {
        alert('Your browser is not yet supported.  Please upgrade to either Google Chrome or Safari.');
    }
}

fetchData();

After this my console gives me the following information:

/cache_gen.php?location=PL4
download_api.js:44textStatus: parsererror
download_api.js:45errorThrown: SyntaxError: JSON Parse error: Unable to parse JSON string
download_api.js:46jqXHR[object Object]

I have ensured the headers for the JSON feed are current, and the feed is definitely serving valid JSON (it effectively caches a 3rd party service feed to save costs on the API).

I'm trying to fetch a custom JSON feed I have written with jQuery using the getJSON method. For an unknown reason the URL seems to be having cache_gen.php?location=PL4 stripped from the end and replaced with [object%20Object] resulting in a 404 error occurring.

Here's the jQuery I'm using:

var fetchData = function() {

    if (Modernizr.localstorage) {

        var api_location = "http://weatherapp.dev/cache_gen.php";
        var user_location = "PL4";
        var date = new Date();

        console.log(api_location + '?location=' + user_location);

        jQuery.getJSON({
            type: "GET",
            url: api_location + '?location=' + user_location,
            dataType: "json",
            success: function(jsonData) {
                console.log(jsonData);
            }
        });

    } else {
        alert('Your browser is not yet supported.  Please upgrade to either Google Chrome or Safari.');
    }
}

fetchData();

From the console log I can see the URL string is calculated correctly as: http://weatherapp.dev/cache_gen.php?location=PL4

However the second line in the console is: Failed to load resource: the server responded with a status of 404 (Not Found).

Can anyone point me in the right direction with this?

UPDATE 19/01/2013 23:15

Well, I've just converted so that is fits the docs perfectly using $.ajax. I've also added a fail event and logged all of the data that gets passed to it.

var fetchData = function() {

    if (Modernizr.localstorage) {

        var api_location = "http://weatherapp.dev/cache_gen.php";
        var user_location = "PL4";
        var date = new Date();

        var url = api_location + '?location=' + user_location;

        console.log(url);

        jQuery.ajax({
            type: "GET",
            url: api_location + '?location=' + user_location,
            dataType: "json",
            success: function(jsonData) {

                console.log(jsonData);
            },
            error: function( jqXHR, textStatus, errorThrown ) {
                console.log('textStatus: ' + textStatus );
                console.log('errorThrown: ' + errorThrown );
                console.log('jqXHR' + jqXHR);
            }
        });

    } else {
        alert('Your browser is not yet supported.  Please upgrade to either Google Chrome or Safari.');
    }
}

fetchData();

After this my console gives me the following information:

http://weatherapp.dev/cache_gen.php?location=PL4
download_api.js:44textStatus: parsererror
download_api.js:45errorThrown: SyntaxError: JSON Parse error: Unable to parse JSON string
download_api.js:46jqXHR[object Object]

I have ensured the headers for the JSON feed are current, and the feed is definitely serving valid JSON (it effectively caches a 3rd party service feed to save costs on the API).

• javascript
• jquery
• ajax
• http-status-code-404
• getjson

• weatherapp.dev/cache_gen.php?location=PL4 is not a working url. <----- click it – Popnoodles Commented Jan 19, 2013 at 22:50
• @popnoodles, it may be a /etc/hosts redirection :). But, certainly .dev sounds fishy – Alexander Commented Jan 19, 2013 at 22:53
• .dev is a development domain. It have set this up has an Apache virtual-host on my local system, which is has an entry in my /etc/hosts to ensure that is resolves properly. I can access this domain in my browser, its the same domain as where the JS file is being loaded from. – Daniel Groves Commented Jan 19, 2013 at 22:57
• What appears on screen when you just browse to the URL? – Jonathan M Commented Jan 19, 2013 at 23:01
• 1 I can prove it, copy your response from dev tools and paste it in jsonlint. - it will show you where your error is. – Adam Jenkins Commented Jan 19, 2013 at 23:42

3 Answers 3

The reason why you see this error:

http://weatherapp.dev/cache_gen.php?location=PL4
download_api.js:44textStatus: parsererror
download_api.js:45errorThrown: SyntaxError: JSON Parse error: Unable to parse JSON string
download_api.js:46jqXHR[object Object]

Is because your JSON is invalid. Even if a response es back from the server correctly, if your dataType is 'json' and the returned response is not properly formatted JSON, jQuery will execute the error function parameter.

http://jsonlint. is a really quick and easy way to verify the validity of your JSON string.

I was running into the same issue today. In my case I was assigning a JSON object to a variable named 'location' which is a reserved word in JavaScript under Windows and appearantly is a shorthand for windows.location! So the browser redirected to the current URL with [object%20Object] appended to it. Simple use a variable name other than 'location' if the same thing happens to you. Hope this helps someone.

Check out the actual function usage:

http://api.jquery./jQuery.getJSON/

You can't pass on object parameter into $.getJSON like with $.ajax, your code should look like this:

    jQuery.getJSON('api_location + '?location=' + user_location)
         .done(function() {
            //success here
         })
         .fail(function() {
           //fail here
         });

To maybe make it a little clearer, $.getJSON is just a "wrapper function" that eventually calls $.ajax with {type:'get',dataType:'JSON'}. You can see this in the link I provided above.