Question

I am getting Invalid label error in firefox while receiving some json content from another domain. My JS code is :

$.getJSON('http://www.upsidelearning.com/blog/blogapp/getBlogDetails.php?getBlogsList=1&jsoncallback=?', function(data){
     alert("Success");
      }); 

And In chrome error console following error received :

(Warning)Resource interpreted as Script but transferred with MIME type text/html.
(Error) Uncaught SyntaxError: Unexpected token :

EDIT : My response json is :

{"data":[{"title":"How Long Does It Take To Develop An Hour Of Elearning?","publishDate":"15 September 2011","author":"Abhijit Kadle","permalink":"http:\/\/www.upsidelearning.com\/blog\/index.php\/2011\/09\/15\/how-long-does-it-take-to-develop-an-hour-of-elearning\/","thumbnail":"http:\/\/www.upsidelearning.com\/blog\/blogapp\/images\/blogpost-icon.png","id":9197}]}

Please help me.

Answer 1

I am getting Invalid label error in firefox while receiving some json content from another domain.

Due to the same origin policy restriction it is not allowed to send AJAX requests to different domains. There are a couple of workarounds:

1. Use JSONP. There is a specific section about it in the getJSON() documentation. Works only if the remote domain supports it. So for example instead of:

   {"data":[{"title":"How Long Does It Take To Develop An Hour Of Elearning?","publishDate":"15 September 2011","author":"Abhijit Kadle","permalink":"http:\/\/www.upsidelearning.com\/blog\/index.php\/2011\/09\/15\/how-long-does-it-take-to-develop-an-hour-of-elearning\/","thumbnail":"http:\/\/www.upsidelearning.com\/blog\/blogapp\/images\/blogpost-icon.png","id":9197}]}
   

   the remote domain must be able to return:

   callback({"data":[{"title":"How Long Does It Take To Develop An Hour Of Elearning?","publishDate":"15 September 2011","author":"Abhijit Kadle","permalink":"http:\/\/www.upsidelearning.com\/blog\/index.php\/2011\/09\/15\/how-long-does-it-take-to-develop-an-hour-of-elearning\/","thumbnail":"http:\/\/www.upsidelearning.com\/blog\/blogapp\/images\/blogpost-icon.png","id":9197}]})
   

   where the client could set the callback name.

2. If JSONP is not an option you could write a server side script on your domain that will act as a bridge between your domain and the remote domain and then send the AJAX request to your script.

---

UPDATE:

After the numerous comments it seems that you are trying to use YQL. Here’s a full working demo:

$.get('http://www.upsidelearning.com/blog/blogapp/getBlogDetails.php?getCategories=1&callback=?', function(result) {
    // you could parse the JSON like this:
    // var json = $.parseJSON(($(result.responseText).filter('p').text()));
    // alert(json.data[0].id);

    alert("Success");
});

Notice that you should use $.get and not $.getJSON.