how to use ajax to get a json file in github

Question

I want to use ajax to get a json file in github, I wrote this code:

$.ajax({
   url: "https://rawgit.com/nianyuyu/play_javascript/master/1.json",
    type:"get",
    dataType:'json',  
    success: function(data){
      console.log(data);
    },
    error:function() {
      console.log("err");
    }
});

but I always get "err" and I check the network , it gets the data

How can I solve this problem, thank you!

Answer 1

Since you have included dataType:'json', in your request, jQuery will validate the returned JSON. In this case, the returned JSON has a semi-colon at the end of the body which is not valid JSON.

 {
"name":"Bill Gates",
"street":"Fifth Avenue New York 666",
"age":56,
"phone":"555 1234567"
};

Remove the semi-colon to prevent the error handler from being called.

Answer 2

Based on the error, parsererror , the url doesn't seem to return valid JSON, while the call expects it to be JSON ( dataType: 'json' )

You can tell jQuery to parse it as text (using dataType: 'text' ) and then convert it to JSON manually using JSON.parse .

You'll have to trim out the last ; before you parse.

On a side note, you can use the parameter passed into the error callback to print out the error.

Fixed code:

 $.ajax({ url: "https://rawgit.com/nianyuyu/play_javascript/master/1.json", type: "get", dataType: 'text', success: function(response) { if (!response) return; response = response.slice(0, -1); // trim ";" at the end var data = JSON.parse(response); // convert to object console.log(data); }, error: function(err) { console.log(err); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

Answer 3

I think you are getting a parse error which is causing the issue, you can fix the json response or you can remove data type json from you request. You will get parse error, if your json response is not valid and you are using dataType: 'json' . you can change it dataType: 'text'

        $.ajax({
       url: "https://rawgit.com/nianyuyu/play_javascript/master/1.json",
        type:"get",
        dataType: 'text',  
        error: function(data){
        //debugger;
          alert('err');
        },
        success:function(data) {
          alert(data);
        }
    });

Reference: jQuery returning "parsererror" for ajax request

Answer 4

1.json file is incorrect. At the end there is a semi colon. Remove that semi colon and it will work fine.

if you dont have access to that file then you can use the following code.

$.ajax({
   url: "https://rawgit.com/nianyuyu/play_javascript/master/1.json",
    type:"get",
    dataType:'text',  
    success: function(data){
      console.log(JSON.parse(data.substring(0, data.length - 1)));
    },
    error:function() {
      console.log("err");
    }
});

Here I basically get the string and trim its last character and then parse the string back to JSON object.

Answer 5

You are receiving the data in error because you are expecting a JSON response where as the actual response is not a valid JSON .

It has semicolon at the end, it makes a invalid JSON .

Try dataType as text . Here you go with the example https://jsfiddle.net/sfjxsdsx/1/

 $.ajax({ url: "https://rawgit.com/nianyuyu/play_javascript/master/1.json", type:"get", dataType:'text', success: function(data){ console.log(data); }, error:function() { console.log("err"); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>