Tabraiz Ali
Tabraiz Ali

Reputation: 677

Can't load a JSON from the URL

I am trying to load the JSON and alert it but I am not able to do this simple thing. I am confused have done this before but now it doesn't work. A simple fiddle would be helpful, this is how I tried it:

$.getJSON("https://www.mariyano.com/app-server/test/?action=get_list", function(json) {
alert("JSON Data: " + json.data.id);
});

I am getting the error...

XMLHttpRequest cannot load https://www.mariyano.com/app-server/test/?action=get_list. Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin.

for this I tried using a callback:

$.getJSON("https://www.mariyano.com/app-server/test/?action=get_list&callback=?",function(json) {
 alert("JSON Data: " + json.data.id);
     });  

and it threw up two errors:

Resource interpreted as Script but transferred with MIME type text/html: "https://www.mariyano.com/app-server/test/?action=get_list&callback=jQuery18205437749766279012_1353579335783&_=1353579335798". jquery-1.8.2.js:8304

Uncaught SyntaxError: Unexpected token :

Upvotes: 0

Views: 383

Answers (3)

aug
aug

Reputation: 11714

I think one thing you should understand is the format of your JSON object. From the look of it, it looks like this:

{
  "data": [
    {"id":"83","name":"asdas"},
    {"id":"86","name":"KKKK123"},
    {"id":"85","name":"KKKK123"},
    {"id":"82","name":"as"},
    ...],

  "status":1,

  "error":""
 }

You have 3 fields in your JSON object one called data, one called status, and one called error. Let's focus on the data field. It seems to be a giant array with objects at each index, each object containing fields including id and name.

Looking back at your code, you are trying to print json.data.id. The json.data is fine but when you say id... well it doesn't know which id it should be looking at so that's why it throws a syntax error.

the field data is an array so if you wanted to access a specific id you'd have to do

json.data[0].id and that'd give you the first index's id.

This at least explains the Uncaught SyntaxError: Unexpected token :.

Upvotes: 1

Quentin
Quentin

Reputation: 944321

You can't access data on another domain without circumventing the same-origin policy.

You can't use JSONP to do that unless the service you are accessing supports JSONP, which https://www.mariyano.com/app-server/test/ doesn't.

Upvotes: 2

ameya rote
ameya rote

Reputation: 1114

Follow this code it may help you

<!DOCTYPE html>
<html>
<head>
  <style>img{ height: 100px; float: left; }</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <div id="images">

</div>
<script>
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
  {
    tags: "mount rainier",
    tagmode: "any",
    format: "json"
  },
  function(data) {
    $.each(data.items, function(i,item){
      $("<img/>").attr("src", item.media.m).appendTo("#images");
      if ( i == 3 ) return false;
    });
  });</script>

</body>
</html>

Upvotes: -2

Related Questions