cross domain request issue origin not allow - ajax

cross domain request issue
my ajax call code actually when i am running given url directly in browser it shows me json data but using ajax call it always shows me ajax error believe me i tried n follow many things no fruitful result from 18 days.
$.ajax({
crossDomain:true,
type: "GET",
url: 'http://taxihub.azurewebsites.net/Mobile/api/json.php?method=getCompanyList',
contentType: "application/json; charset=utf-8",
dataType: "json",
processData: false,
success: function (data) {
console.log(data);
return;
},
error: function (err) {
console.log("AJAX ERROR");
console.log(err.responseText);
}
});
you can also check this link directly u will see json data coming but i found error i dont know why
"http://taxihub.azurewebsites.net/Mobile/api/json.php?method=getCompanyList"
error: OPTIONS http://taxihub.azurewebsites.net/Mobile/api/json.php?method=getCompanyList Origin lhost:809 is not allowed by Access-Control-Allow-Origin.
please help me i am stuck here from 18 days on this issue

Remove the cross-domain and content-type part and it'll work but you'll have to do a little extra string manipulation work to put it in JSON object:
$.ajax({
type: "GET",
url: 'http://taxihub.azurewebsites.net/Mobile/api/json.php?method=getCompanyList',
dataType: "json",
success: function (data) {
console.log(data.result.getCompanyList[0].CompanyID);
return;
},
error: function (err) {
console.log("AJAX ERROR");
console.log(err);
}
});
}
Actually it seems cross-domain doesn't have any effect with or without it. I guess the server you're targeting doesn't have strict cross-domain prevention but doesn't like the JSON content-type. I'd be glad to get a more specific explanation.
EDIT I used JQuery 1.10.2 if it matters

Related

JS Cross-Domain request with JSONP

I'm trying to perform a cross domain call. so i'm using JSONP.
The problem is that the response is not json, but an html.
The request works fine and i see the response with status 200 in the network console, however the error function is the one being called, as the expected response is JSON whereas I get an html.
Do you have alternatives for using JSONP for cross domain request?
If i'm using JSONP but the request is not, can I somehow expect a value which is not a json? (tried dataType: 'jsonp text' and didn't work)
Although I get an error with the ajax call, is there a way to extract the result of the request, as it still returns status 200, it's just not accessible ?
$.ajax
({
type: "GET",
url: myurl,
crossDomain:true,
dataType: 'jsonp',
contentType: "text/html; charset=utf-8",
success: function (data) {
console.log(data);
},
error: function (data) {
console.log(data);
},
});

How to show AJAX response message in alert?

I am sending username and password as request parameter to the server in AJAX and trying to show the response message. But not able to showing the response message.In fiddler it is showing the response message. But while on the browser screen it is not showing.PLEASE somebody help me out where i am wrong or need to change anything..
I have written like this-
$(document).ready(function () {
$("#btnCity").click(function () {
$.ajax({
type: "POST",
url: "http://test.xyz.com/login",
crossDomain: true,
contentType: "application/json; charset=utf-8",
data: { username: "abc", password: "1234" },
dataType: "JSONP",
jsonpCallback: 'jsonCallback',
async: false,
success: function (resdata) {
alert(resdata);
},
error: function (result, status, err) {
alert(result.responseText);
alert(status.responseText);
alert(err.Message);
}
});
});
});
TL;DR: I guess the problem is on the server side of your code (that we don't know yet).
At first: I don't know why it fails for you. I've taken your code and ran it against a public available JSONP API, that returns the current IP of your system and it worked.
Please try yourself using the URL: http://ip.jsontest.com/.
So most probably, the server doesn't return the right response to the JSONP request. Have a look at the network tab in developer tools. With your current code, the answer of the server should be something like:
jsonCallback({'someResponseKeys': 'someResponseValue'});
Note: The header should contain Content-Type:application/javascript!
BTW, even if this doesn't for now solve your problem - here are some tweaks, I'd like to advice to you:
Don't set async to false, at the documentation of jQuery.ajax() says:
Cross-domain requests and dataType: "jsonp" requests do not support synchronous
operation.
You don't need to set a jsonpCallback, because jQuery will generate and handle (using the success function a random one for you. Quote from the docs:
This value will be used instead of the random name automatically generated by jQuery. It is preferable to let jQuery generate a unique name as it'll make it easier to manage the requests and provide callbacks and error handling.
So here comes my code:
$(document).ready(function () {
$("#btnCity").click(function () {
$.ajax({
type: "POST",
url: "http://ip.jsontest.com/",
crossDomain: true,
data: { username: "abc", password: "1234" },
dataType: "JSONP",
success: function (resdata) {
console.log("success", resdata);
},
error: function (result, status, err) {
console.log("error", result.responseText);
console.log("error", status.responseText);
console.log("error", err.Message);
}
});
});
});
A working example can be found here.
Another solution, like Yonatan Ayalon suggested, can be done with a predefined function and then setting the jsonpCallback explicitly to the function that should be called.
if you see the response in Fiddler, it seems that the issue is in the callback function.
you are doing a jsonP call - which means that you need a callback function to "read" the response data.
Do you have a local function that calls "jsonCallback"?
this is a simple jsonP request, which initiates the function "gotBack()" with the response data:
function gotBack(data) {
console.log(data);
}
$.ajax({
url: 'http://test.xyz.com/login' + '?callback=?',
type: "POST",
data: formData,
dataType: "jsonp",
jsonpCallback: "gotBack"
});
You can try with the following methods and close every instance of chrome browser in task manager, then open browser in web security disable mode by the command "chrome.exe --disable-web-security"
success: function (resdata) {
alert(resdata);
alert(JSON.stringify(resdata));
},
And the better option to debug the code using "debugger;"
success: function (resdata) {
debugger;
alert(resdata);
alert(JSON.stringify(resdata));
},

Jquery AJAX for fetching JSON, affected by URL prefix (www vs. no www)?

I have come across a peculiar item in JQuery that I am hoping somebody can help me to understand.
I've spent much of the day trying to get JQUERY's AJAX 'success' function to be raised when returning JSON from the server.
I checked the JSON # JSONLint to ensure validity, checked encoding, tried different headers, but still PROBLEMS.
After a couple hours, I switched the url (by accident!)
from
http//www.testing.com/_r4444/myfile.php
to the exact same thing WITHOUT the www... and it suddenly worked.
I have no clue why this would be the case - any ideas?
the snippet follows
$(document).ready(function() {
$.ajax( {
type: "POST",
contentType: "application/json",
url: "http://testing.com/_r4444/getter.php",
beforeSend: function(x) {
if(x && x.overrideMimeType) x.overrideMimeType("application/json;charset=UTF-8");
},
data: "pass=TEST",
dataType: "json",
error: function (xhr, status) {
alert(status);
},
success: function (result) {
alert(result);
}
});
});
Are you using "www" on the page in the browser?
Try switching the call to not include the domain, like:
"/_r4444/getter.php" instead of the full domain.

ajax call does not succeed

I have the following code:
function processJson(data, i) {
alert(i);
}
function processChunk(i) {
$.ajax({
type: "GET",
url: "http://www.mplampla.com/idsBook.php?id=8",
data: "",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
alert('yooohooooo!!');
//processJson(data,i);
},
error: function() {
alert('Oops, something went wrong...');
}
});
}
But it does not succeed and always shows the alert of the error callback! What am I doing wrong? The link is ok when I hit it in the browser... any idea?
Since you have an absolute URI, odds are that you are violating the Same Origin Policy and don't have permission from CORS to do so (and since you are specifying JSON, you clearly aren't using JSONP to work around the limitation).
Alternatively, as #Darin Dimitrov points out, your URI resolves to a 404 error which would also cause a failure state for the Ajax call.
… it would help if you looked at your JS console and told us what errors you received though.

Jquery: probleme with $.ajax (json datatype)

I have a problem to refresh a bloc in my page.
Here is the request:
> $("#pwd_lost_link").click(function(){
alert('1');
$.ajax({
type : 'POST',
url: 'test.php',
dataType: 'json',
data :{"nom" : "akbar"},
success : function(data){
$("#main_bloc").append(data.msg);
alert('2');
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
alert(XMLHttpRequest.responseText);
alert(errorThrown); }
}); })
and here is the php file
<?php
$return['nom'] = "ffrfrfrfr";
echo json_encode($return)
?>
It doesn't work. It give me a status error ( 0 ) and the page is automatically reloaded
Thanks
Michaël
Confusing question Michael, not sure what you mean by "the page is automatically reloaded" but you should do 2 things:
In the $.ajax() method, make sure your success called back is handling the data correctly. You are looking for data.msg but I don't see where .msg comes from.
$.ajax({
type: "GET",
contentType: "application/json; charset=utf-8",
data: {},
dataType: "json",
url: url,
success: function(data) {
// parse data object so you can see what's being returned ex. alert(data) or alert(data[0]) or alert(data.nom)
},
error: function (xhr, status, error) {
// XHR DOM reference: http://www.w3schools.com/dom/dom_http.asp
// check for errors ex. alert(xhr.statusText);
}
});
On the PHP side, you may want to debug there to see what is being received and what you are sending back.
Aside from that using an XHR viewer like Firebug or Chrome's built-in utility (CTRL+SHIFT+I) can be very helpful.
And on a final note, if pwd_lost_link is a link elment a id="pwd_lost_link" href="..." then you will have to stop the browser from following the link before you process the AJAX.
$("#pwd_lost_link").click(function(e) {
e.preventDefault();
alert('1');
$.ajax({
...
});
If you aren't seeing the '1' being alerted then that is definitely your first problem.
You're trying to access data.msg, but your PHP script is only creating data.nom. So data.msg doesn't exist. Try changing data.msg to data.nom and see if this does what you want.

Resources