jQuery AJAX call to fetch web api data returns syntax error

Question

I am trying to fetch this json object from this url:

https://test3.diavgeia.gov.gr/luminapi/opendata/dictionaries//KANONISTIKI_PRAXI_TYPE.json

You might not get much since it's in greek but you get the jsonformat.

Here's my code:

function getDicts() {
  api_url = 'https://test3.diavgeia.gov.gr/luminapi/opendata/dictionaries/KANONISTIKI_PRAXI_TYPE.json'
  $.ajax({
    headers: {
      'Access-Control-Allow-Origin': '*',
    },
    url: api_url,
    type: "GET",
    crossDomain: true,
    dataType: 'jsonp',
    success: function(api_data) {
      var obj = $.parseJSON(api_data);
      console.log(obj);
    },
    error: function(error) {
      console.log(error);
    },

  });
};
};
getDicts();

If I use jsonas thedataType` I get the error: SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the json data

This is a screenshot from my call:

Here's a fiddle : https://jsfiddle.net/danee/sz7tLru8/

UPDATE!

I changed slightly the function, following some examples I found. Using the jsonp dataType, on the Network tab I do get a json object but on the console I get this: SyntaxError: missing ; before statement[Learn More] KANONISTIKI_PRAXI_TYPE.json:1:7

Here's a screenshot from the call with jsonp. That seems like an error on the json object? Haven't encountered that before.

I have updated the fiddle as well, but I get nothing there, no response.

This URL has the perfect JSON response, however, I am not able to reproduce this error because the URL has cross-origin restrictions. Can you create a fiddle to reproduce it? — 31piy
– 31piy, Commented Nov 15, 2017 at 8:33
The fiddle isn't helping. I can see the same CORS error in the console. Did you try running it? — 31piy
– 31piy, Commented Nov 15, 2017 at 8:56
@31piy yes I did and it worked fine.I don't get an error on the fiddle though — Danae Vogiatzi
– Danae Vogiatzi, Commented Nov 15, 2017 at 9:01
As mentioned above I don't think you're getting parse error but CORS. Add error function to your Ajax and you'll see the error. I have deployed my own web api locally for preventing CORS, returned same json and worked fine, it runs success function with status 0. Looking into Network tab is misleading you. — Daniel Manta
– Daniel Manta, Commented Nov 15, 2017 at 9:36

Daniel Manta · Accepted Answer · 2018-01-28 02:44:55Z

1

Your internet browser is blocking CORS Ajax calls. As a workaround one option is to deploy your own web application just for running web requests to target diavgeia.gov.gr external web api without this restriction.

Internet browser -(Ajax) -> Your web server -> Target web site

Another option is using reverse proxy websites that already provide this service for free. They will call the external web api for you from a server, not an Internet browser, so that CORS can be avoided.

Internet browser -(Ajax) -> Reverse proxy -> Target web site

let anonimizerUrl = 'https://allorigins.us';
var apiUrl = 'https://test3.diavgeia.gov.gr/luminapi/opendata/dictionaries/KANONISTIKI_PRAXI_TYPE.json';
$.ajax({
  url: anonimizerUrl + '/get?url=' + encodeURIComponent(apiUrl),
  success: function(response) {
    //Although response is an object, the field contents is a string and needs to be parsed here.
    var data = JSON.parse(response.contents); 
    console.log(data);
  },
  error: function(request) {
    console.log(request.responseText);
  }
});

If Allorigins is blocked by your internet provider (ISP), try another similar server from this list including.

Note: Based on your post, I'm assuming you don't have access to make changes to the web api. Otherwise CORS can be enable from there or make changes for returning jsonp instead of json.

edited Jan 28, 2018 at 2:44

answered Nov 15, 2017 at 20:24

Daniel Manta

6,76317 gold badges43 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Danae Vogiatzi Over a year ago

that ha been very helpful! No I don't have access to make changes to the web api. Thank you for your help!

Collectives™ on Stack Overflow

jQuery AJAX call to fetch web api data returns syntax error

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related