I am trying to pull a password protected xml feed from another website, but I am getting the following error:
"Uncaught SyntaxError: Unexpected token <"
I fixed the origin access error that I was getting previously by adding a callback function, but now I am getting this uncaught syntax error.
My code is:
$.ajax({
url: 'http://xxx.php?&callback=?',
dataType: 'jsonp',
type: 'POST',
username: 'xxxxx',
password: 'xxxxx',
crossDomain : true,
xhrFields: {
withCredentials: true
}
});
When I inspect the error I can just see 'denied' where the feed should be: screen shot of error
Any ideas why this is not working? Do I need to request something from the feed provider? Or is there something missing/incorrect in my code?
You try to load an xml and use dataType: 'jsonp'. jQuery can't handle the response because you tell the $.ajax function to use the response as JSONP. So the first char of the response < is unexpected.
Use dataType: 'xml' instead.
The denied seems to come from a wrong login too. Are you sure the username and password options are working for you? I got many problems using it this way. I would pefer to change your login to use beforeSend, like this:
$.ajax({
url: 'http://xxx.php?&callback=?',
dataType: 'xml',
type: 'POST',
crossDomain : true,
xhrFields: {
withCredentials: true
},
beforeSend: function (xhr) {
xhr.setRequestHeader('Authorization', 'Basic ' + btoa('username:password'));
}
});
Related
Trying to make my first AJAX call to an API. When run Firefox's console returns SyntaxError: unexpected token: ':' with a link to the MDN docs about missing a semi-colon.
$.ajax({
type: "GET",
url: "url/to/API/here",
dataType: "jsonp",
jsonp: "callback",
success: function(data){
console.log(data.quoteText);
},
xhrFields: {
withCredentials: false
}
})
Following some other similar issues I've tried using JSON and not JSONP, but returns a CORS error (specifically CORS header 'Access-Control-Allow-Origin' missing) also tried using CrossOrigin to no avail either.
I'm trying to make a cross domain ajax request to deezer, a music streaming api... and I'm getting an "Uncaught SyntaxError: Unexpected token :" error. I know it's because the data I'm getting back is not in proper json format, but I tried changing the datatype to 'json' from 'jsonp' and it's still not working...here's my request, any suggestions?
$.ajax({
url: "https://api.deezer.com/search?q=" + searchString + "&callback=?",
dataType: 'json',
jsonpCallback: 'callback',
type: 'GET',
success: function (data) {
console.log(data);
}
});
This is because you used unencoded second "?" in your url after first "?", which using for separate get-string. You need to remove this part of url + "&callback=?".
I am trying to make a JSONP request to a server. This is my code:
$.ajax({
type: 'GET',
url: myURL,
async: false,
crossDomain: true,
dataType: 'jsonp',
jsonpCallback: 'jsonCallback',
headers: {
'Accept': 'application/json', //this is required by the server
'key': key
},
success: function() {
alert('1');
},
error: function() {
alert('2');
},
complete: function(){
alert('3');
}
});//code indentation
When I run the code it errors. But if I open the developers tools in Chrome (ctrl+shift+I) I can see the request under "network". Clicking on it shows the correct response (and shows the request was accepted).
Apologies is there is a really obvious solution (I have tried searching, but with no luck), but at this point I am well and truly baffled. Any help would be really appreciated.
::EDIT::
changing the error function to:
error: function() {
console.log('error', arguments);
},
returned the message "jsonCallback was not called" Thanks to Aaron Digulla below.
The response from the server is JSON, not JSONP (checked with JSONlint)
When you say "it errors", my guess is that you get alert(2). To find out why, log the function arguments to the console:
...
error: function() {
console.log('error', arguments);
},
...
jQuery will pass additional information (like the error message) to the function. That should help you understand why it fails.
The same is true for the success function which gets the server response, for example.
[EDIT]
I get the error jsonCallback was not called
That means your server isn't returning JSONP. JSONP looks like name({...}) while normal JSON looks like {...}. Please check your server's configuration and make sure it actually supports JSONP and that the response looks correct.
I should have seen this from your code:
dataType: 'jsonp'
headers: {
'Accept': 'application/json', //this is required by the server
}
That means you're sending a JSONP/JSON mix which can't work. If you use a certain dataType, then let jQuery build the correct headers.
The success function has argument and from that argument you can get the response text.
$.ajax({
type: 'GET',
url: myURL,
async: false,
crossDomain: true,
dataType: 'jsonp',
jsonpCallback: 'jsonCallback',
headers: {
'Accept': 'application/json', //this is required by the server
'key': key
},
success: function(response) {
alert(response);
alert('1');
},
error: function() {
alert('2');
},
complete: function(){
alert('3');
}
});
You cannot set async: false for a jsonp request due to nature of it, adding script tag to handle response method.
dataType: 'jsonp
as you mentioned,the type of data that you're expecting back from the server is jsonp but may be your server will return any other format rather than jsonp.. so check it which type of response your server is returning in under Network in browser console... then if it is not jsonp format, change your respons return type....
I am using below code to access rest service hosted on another domain.
$.ajax({
type: 'GET',
url: url,
async: false,
jsonpCallback: 'jsonCallback',
contentType: "application/json",
dataType:"jsonp",
success: function(json) {
alert(json);
},
error: function(e) {
console.log(e.message);
}
});
I am able to get the data correctly, but I get this error in firebug in mozilla:
SyntaxError: missing ; before statement
{"Hello":"World"}
Can anyone suggest me what I am doing wrong here? Even though Json data is valid. I tried all the suggestions posted in this question But still I am getting same error.
If it's really JSON you ask for, don't set "jsonp" as dataType, and don't provide a callback :
$.ajax({
type: 'GET',
url: url,
contentType: "application/json",
success: function(json) {
alert(json);
},
error: function(e) {
console.log(e.message);
}
});
the format of JSON and JSONP are slightæy different
JKSONP is a function invocation expression
callback({"hellow":"world"});
whereas JSON is simply a serialized object
{"Hello":"world"}
fromyour posting it would seem that the server is returning JSON and not JSONP
So you either need to change the server to reply correctly (The actual callback name is a get parameter to the request). You should do this if you are using the ajax call across domains
If you are not using ajax across domains stick to regular JSON
I've been wasting a great deal of time for something I think is so simple, yet there are no good examples that illustrate how and what the ajax call is doing.
This is my javascript code:
$.ajax({
type: 'GET',
url: 'https://maps.googleapis.com/maps/api/timezone/json',
dataType: 'jsonp',
data: {
location: myLoc,
timestamp: myTime,
sensor: true
},
success: function(){alert('OK');},
error: function(){alert('FAIL');}
})
}
The variables "myLoc" and "myTime" are not the problem. In fact if I cut and paste the URI into my browser it works just fine and shows the data: https://maps.googleapis.com/maps/api/timezone/json?callback=jQuery18307430207263678312_1354817349576&location=36.7468422%2C-119.7725868×tamp=1354817353&sensor=true&_=1354817353398
From what i've been reading, the "callback" parameter is automagically generated and somehow the code should be smart enough to call the success function or error function.
The error that chrome returns is "Uncaught syntax error unexpected token ':'"
The javascript code always calls the error function no matter what I try. I added a jsonpCallback parameter (didn't work), json parameter (didn't work), changed dataType to "json" (didn't work due to cross domain error).
Please help.
$.ajax({
type: 'GET',
url: 'https://maps.googleapis.com/maps/api/timezone/json',
dataType: 'jsonp',
contentType: 'application/json; charset=utf-8',
data: JSON.Stringify({
location: myLoc,
timestamp: myTime,
sensor: true
}),
success: function(){alert('OK');},
error: function(){alert('FAIL');}
});