I am trying to call my service from here
http://diningphilospher.azurewebsites.net/api/dining
using below javascript,
$.ajax(
{
type: "GET",
dataType: "json",
url: "http://diningphilospher.azurewebsites.net/api/dining/",
success: function (data)
{
alert(data);
}
});
But I am getting error relating cross origin. I see people suggest using JSONP but I guess my server does not support JSONP. I studied CORS and could not understand the head or tail of it. I would like to know the way around to read the JSON that sits in different domain.
I hope this should work:
$.ajax(
{
type: "GET",
dataType: "jsonp",
url: "http://diningphilospher.azurewebsites.net/api/dining/",
success: function (data)
{
alert(data);
}
});
Or just add/append ?callback=? along with your cross-domain url.
Related
I'm making a simple ajax call as the following;
var getPrevious = function(){
console.log('ajaxing');
$.ajax({
type: 'GET',
dataType: "json",
url: 'http://'+DOMAIN+'/previous',
success: function(data){
console.log(data);
}
});
}
Whenever I run this function it's not returning success. What am I doing wrong; here's the url I'm trying to get the json data from; http://107.174.82.43:3001/previous
I'm new to making calls using $.ajax but it seems pretty straight forward, although I have no idea what I'm doing wrong.
To debug it, use error option
var getPrevious = function(){
console.log('ajaxing');
$.ajax({
type: 'GET',
dataType: "json",
url: 'http://'+DOMAIN+'/previous',
success: function(data){
console.log(data);
},
error: function(err){
console.error(err);
}
});
}
If you are running your app on a different from provided domain/port host, than you will face CORS issue. Your should host your js app either on same domain as your back api, or add js app domain to back-end whitelist.
I have a strange issue using jQuery and JSON, especially JSONP.
My goal is to simply GET JSON data, but I always end up with the following error:
Uncaught SyntaxError: Unexpected token
Here is the code:
<script type="text/javascript">
$(document).ready(function() {
var myurl = "someurl";
$.ajax({
url: myurl,
method: 'GET',
contentType: 'application/javascript',
dataType : 'jsonp',
success: function(result){
//Do something with JSON result
}
});
</script>
And of course the JSON (raw format):
{"result":[{"targetView":"powerUsage","myData":{"someItems":["9","5","8"],"someItems2":[{"text":"protoText","currentRecord":"45.38","absolute":100}]}}]}
I tried the webservice with the Advanced Rest Client App in Google Chrome and it is working perfectly. I have no clue why this simple example gets this syntax error message.
Your Ajax code looks like fine. I think you are trying to make a Cross domain call as JSONP is a hack for dealing cross domain ajax call. If you Server code if ready for dealing with JSONP request then you must have send a callback parameter like
?callback=my_callback_method
than you service will return result with a callback see below links for more details:
https://learn.jquery.com/ajax/working-with-jsonp/
http://stackoverflow.com/questions/11736431/make-cross-domain-ajax-jsonp-request-with-jquery
You missed to put ready function close, that is }); at the last before script tag close:
<script type="text/javascript">
$(document).ready(function()
{
var myurl = "someurl";
$.ajax(
{
url: myurl,
method: 'GET',
contentType: 'application/javascript',
dataType: 'jsonp',
success: function(result)
{
//Do something with JSON result
}
});
});
</script>
I tried to get response data using ajax from the below url
http://recipesid.appspot.com/api.user?method=user.query&email=dam.le#anttek.com
But it will not run anyway.
Help me to solve the issue
$.ajax({
type: "GET", //rest Type
dataType: 'jsonp', //mispelled
url: "http://recipesid.appspot.com/api.user?method=user.query&email=dam.le#anttek.com",
async: false,
contentType: "application/json; charset=UTF-8",
success: function (msg) {
alert(msg);
},
error:
function(data){
alert("error");
} });
Thanks in advance !!
Thanks for all answers. but i got a solution.
I must allow "Access-Control-Allow-Origin" in my google app engine.
I have a problem with my code and i can't get it to work.
The request should go to my main domain, grab the version number and post it on the application but this does not happen.
Code:
$.ajax({
url: 'http://maindomain.com/dbstruk/version',
dataType: 'jsonp',
jsonp: 'callback',
jsonpCallback: 'jsonpCallbackSPP',
success: function(data){
$('#latest-version').text(data.version/100);
}
});
The location: maindomain.com/dbstruk/version contains only one line:
{"version":"105"}
Am i overseeing something?
Thank you.
JSFiddle: http://jsfiddle.net/D2s2M/1/
I cannot figure out why this does not work in IE9. I've seen other questions here on Stack with similar issues, none of which have solutions that seem fix my problem.
This issue is specific to IE9, it does work in FF and Chrome. However, I am seeing some oddities in Chrome that do not make sense: if I append the contentType:'application/json' inside of the attributes, it breaks functionality inside of Chrome.
Here is the code that is in fiddle:
$('document').ready(function(){
$.ajax({
dataType: 'json',
type:'GET',
url: 'https://freegeoip.net/json/?callback=',
//contentType: 'application/json',
success: function(response, status, xhr){
var ct = xhr.getResponseHeader("content-type") || "";
$('#text').text(ct);
},
error: function(a,b,c) {
$('#text').text('Error: '+' '+b+' '+c);
},
timeout: 3000
});
});
Thanks
Change
dataType: 'json',
to
dataType: 'jsonp',
Solution: http://jsfiddle.net/D2s2M/2/
I'm not precisely sure why this cross-domain issue was IE specific nevertheless, JSONP did lead to resolving the issue.
The service I'm using does support JSONP, in the url there is a querystring variable to specify the name of the callback you wish to use. (JSONP requires that the data either be wrapped in a callback inside of the file itself, or set and passed an object inside of the JSON file.. this is required because JSONP loads everything in the head of the DOM to bypass cross-domain restrictions).
Revised Code:
$('document').ready(function(){
$.ajax({
dataType: 'jsonp',
type:'GET',
url: 'https://freegeoip.net/json/?callback=func',
contentType: 'application/json',
async: false,
jsonpCallback: 'func',
success: function(data){
console.log(data);
},
error: function(a,b,c) {
$('#text').text('Error: '+' '+b+' '+c);
},
timeout: 3000
});
});