Uncaught SyntaxError: Unexpected token : YQL jQuery - javascript

I'm trying to get data from a JSON via Yahoo Query Language (YQL) using jQuery.
Link to JSON
index.html
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$.ajax({
url: "http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D'http%3A%2F%2Fwww.unisul.br%2Fwps%2Fportal%2Fhome%2Fconheca-a-unisul%2Fa-universidade%2Fcampus-unisul-virtual%2Fpolos-presenciais'%20and%20xpath%3D'%2F%2F*%5B%40id%3D%22lista-polos%22%5D'&format=json&diagnostics=true&callback=",
dataType: 'jsonp',
success: function (response) {
var polos = response.results[0];
var getPolosHTML = '';
console.log(polos);
}
});
</script>
Error in console:
Uncaught SyntaxError: Unexpected token :
Any solution?

First, you have to setup the url so that jquery will add in the jsonp param by adding a ? to callback=
...&callback=?
then, you have to modify the success callback to properly reference the data.
var polos = response.query.results;
console.log(polos); // object with a div property
http://jsfiddle.net/jZ4n8/1/

There is no error in code. Output of the api is invalid. You can cross check json result(http://jsonlint.com/).

Related

Code returns JSON error Uncaught SyntaxError: Unexpected token :

This probably has been answered elsewhere but I for the life of me can not get this to work.
Here is my html:
<!Doctype html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="JS.js"></script>
</head>
<body>
<div>
</div>
</body>
</html>
and here is my Js file:
$( document ).ready(function() {
console.log( 'ready!' );
$.ajax({
url: 'http://steamcommunity.com/market/priceoverview/?appid=730&currency=3&market_hash_name=StatTrak%E2%84%A2%20M4A1-S%20|%20Hyper%20Beast%20(Minimal%20Wear)',
type: 'GET',
dataType: 'jsonp',
success: function(data) {
console.log(data);
var lowestprice = $( 'lowest_price' );
console.log($target);
}
});
});
The result of the query is:
{"success":true,"lowest_price":"48,--\u20ac","volume":"12","median_price":"51,02\u20ac"}
but I get the error uncaught SyntaxError: Unexpected token :
Thank you in advance, I'm experimenting with web programming and am struggling cause I am more used to object oriented programming.
You are saying the endpoint is JSONP when you make the Ajax Request. The api returns JSON so when it is injected into the page it generates the error you see.
You can not just make any call JSONP by setting it in the Ajax call. The API needs to support JSONP.
Check the API to see if it supports JSONP. If it does set whatever querystring argument it requires. If it does not support it, than you would need to use a serverside proxy to make the call.
First of all, its cross domain and the url should be modified to use HTTPS (i just tried it on w3school's editor. (otherwise, browser will block such url...)
Next, you need to use JSON instead of JSONP. After that, you will start getting status 200 ok. This is what i tried
$.ajax({
url: 'https://steamcommunity.com/market/priceoverview/?appid=730&currency=3&market_hash_name=StatTrak%E2%84%A2%20M4A1-S%20|%20Hyper%20Beast%20(Minimal%20Wear)',
type: 'GET',
dataType: 'json',
success: function(data) {
alert(data);
var lowestprice = $( 'lowest_price' );
console.log($target);
},
error: function(st, err) {
alert('vijay');
alert(st.status);
alert(err);
}
});
Now, you have to add that cross-domain header...This page will tell you the explanation in detail.
https://www.html5rocks.com/en/tutorials/cors/

How to get the JSON from external server

thanks in advance!
I am trying to do a Jquery.ajax() to get the JSON from this link:
API.
This is the code I use:
$.ajax({
url : "https://api.9292.nl/0.1/locations/station-amsterdam-centraal/departure-times?lang=nl-NL",
dataType: "json",
success:function(data)
{
console.log('gelukt');
},
errror: function (data) {
console.log(data);
}
});
But it gives the error "No 'Access-Control-Allow-Origin' header is present", so i tried to set dataType to 'jsonp', but then a error shows up with: 'Uncaught SyntaxError: Unexpected token :'
Anyone got an idea, how to get the JSON from that API?
You would help me a lot!
Thanks
Read about JSONP here or here, most probably you need to pass a callback parameter into query.

SyntaxError: Unexpected token : when using Ajax & Facebook JS API in Chrome

OK I'm using PHP and the Facebook JS API to post stories on users' pages with jQuery's $.ajax() function and it's working fine everywhere except in Chrome.
Chrome is returning the error "SyntaxError: Unexpected Token : ".
I have it alerting the XHR response on error and it is as follows:
{
"id" : "30800681_37922830145443"
}
which is valid JSON. It can't be anything I'm doing wrong with the JSON result because it throws the error before any parsing can be done (i.e., it's not making it into the 'success' function).
The code that's behind this is as follows:
if ($('#post-facebook').is(":checked")) {
// Do the FB post
$.ajax({
type: "POST",
url: "https://graph.facebook.com/<?= $this->session->userdata('fb_id') ?>/feed",
data: "message=" + $("#upload-caption").val() + "&access_token=<?= $this->session->userdata('fbtoken'); ?>&app_id=<?= $this->config->item('appId') ?>&link=" + post_url,
success: function(msg) {
// Save the FB post ID to the DB
var result = $.parseJSON(msg);
var result_array = result.id.split("_");
// Do more stuff here, but it's not even getting into this success function
},
error: function(xhr,ajaxOptions,thrownError) {
// This is what's executing because the thrown error is getting alerted
alert(thrownError);
}
});
}
When I add dataType: "json" in the Ajax parameters, it still goes through the Error function but the thrownError parameter is empty.
I am pulling my hair out...any suggestions? Thanks in advance,
Using jQuery with post is not possible as POST require CORS support, and that is not readily available.
Use FB.api instead, which handles all of this for you, in a much better way.

jQuery an Yahoo Weather API call failed

I want to catch weather information. I'm trying to do it with jQuery. So here is my Code:
$(document).ready(function(){
var weatherURL = 'http://weather.yahooapis.com/forecastjson?w=20066287&u=c&callback=?';
$.getJSON(weatherURL, function(data){
//console.log('done');
}); });
It seems that this is working. But it outputs me
Uncaught SyntaxError: Unexpected token :
I think its an JSON validation problem. But all online JSON validation tool passes the test.
It seems the API returns JSON, not JSONP data; getJSON automatically tries to parse it as JSONP is there's a callback query in the URL:
If the URL includes the string "callback=?" (or similar, as defined by the server-side API), the request is treated as JSONP instead.
http://api.jquery.com/jQuery.getJSON/
Try this:
$(document).ready(function(){
var weatherURL = 'http://weather.yahooapis.com/forecastjson?w=20066287&u=c';
$.ajax({
url: weatherURL,
dataType: 'json',
success: function(data) {
//console.log('done');
}
});
});

Uncaught SyntaxError: Unexpected token : & invalid label errors

I am trying to make an ajax call and it returns something like, a JSON object;
{
id: 6,
success: "true"
}
My ajax call is :
window.foobar = function(foo){
$.ajax({
url: "http://foobar.com/sites/foo/",
dataType: "jsonp",
success: function (data) {
alert(data);
},
error: function () {
}
});
}
This ajax call is cross site call.
On chrome it gives: Uncaught SyntaxError: Unexpected token :
On firefox it gives:
invalid label
http://localhost:8080/sites/foo/?callback=jsonp1324336100888&_=1324336100894
Line 1
But when I calling from the same domain it works fine.
If you are claiming to support JSONP, you need to actually support it. Your code is valid JSON, but it is not valid Javascript: a response to a JSONP request must be valid Javascript. (To be precise, your code is invalid because the {} delimit a block, rather than an object literal.)
If you implement JSONP, you need to wrap the data in a call to a function whose name is given in the URL, in the callback parameter. So in this case, you need to post the following code:
jsonp1324336100888({
id: 6,
success: "true"
});
Obviously the precise name of the function you need to call depends on the callback URL parameter.

Categories

Resources