Here is my api calling its response is 200 OK but it not entered into the success method I have no clue where i am doing wrong. I enable CORS on server side.
$( document ).ready(function() {
$.ajax({
url: 'https://localhost:44300/api/apim/{{Product.Id}}/'+email+'/',
dataType: 'jsonp',
success: function(data) {
alert("success");
if(data===true){
$('#subscribe').prop('disabled', true);
$('#subscribe').text('Is Pending');
}
else
{
}
},
error: function(err)
{
alert("Error");
},
type: 'GET'
});
});
Image
You said dataType: 'jsonp', but the server said content-type: application/json.
JSONP is application/javascript because it isn't JSON (it's a hack to get around the same origin policy from before we had CORS, since you are using CORS, it is pointless … well, you claim you are using CORS, but I don't see an Access-Control-Allow-Origin header in the response).
Remove dataType: 'jsonp' and let jQuery work out the type of data from the content-type response header.
Related
I am trying to fetch data from text file which resides on server. I have access of that location and able to see content when I put URL in browser tab.
I am trying to make AJAX call and get file content, but I am getting Error: Uncaught SyntaxError: Unexpected identifier
Code
function logResults(json){
console.log(json);
}
$.ajax({
url: u,
dataType: "jsonp",
jsonpCallback: "logResults"
});
on console,
I tried below code too, but same result,
$.ajax({
type: 'GET',
url: u,
crossDomain: true,
dataType: 'jsonp',
async: false,
headers: {
"Access-Control-Allow-Origin": "*"
},
success: function(succ) {
console.log("Success: ", succ)
},
error: function(err) {
console.log("Error: ", err)
}
});
This code is always going into error block.
You said:
dataType: "jsonp",
But the URL is responding with:
Deployment automatically finished…
Which is not JSONP, it is plain text.
You get the error when it tries to execute the plain text as JSONP.
Don't put wrong information in the dataType field.
async: false,
That's deprecated. Don't use it. It's also pointless since you are using callbacks.
It's also incompatible with JSONP so it is ignored (until you remove the incorrect dataType).
crossDomain: true,
This has no effect unless you are making a:
non-JSONP request
to the same origin
which gets redirected to a different origin
… which is very rare.
headers: {
"Access-Control-Allow-Origin": "*"
},
Access-Control-Allow-Origin is a response header. It doesn't belong the request. Trying to add it to the request will cause extra problems as it will make the request preflighted.
(At least, that would be the case if you hadn't said dataType: 'jsonp' because adding request headers is incompatible with JSONP).
All you need on the client
The only code you need on the client is:
function logResults(result){
console.log(result);
}
$.ajax({
url: u,
success: logResults
});
The server you are requesting the data from will need to use CORS to grant you permission to access it if it is a cross-origin request.
It is because you have added dataType as jsonp, so that it will try to parse the response to JSON and if the response is not a JSON it will throw error.
While submitting the data :
Error Message : XMLHttpRequest cannot load https://docs.google.com/forms/d/xxxxxxxxxxxxx/formResponse. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8090' is therefore not allowed access. The response had HTTP status code 405.
$scope.postDataToGoogle = function(){
$http({
method: 'POST',
crossDomain: true,
url: 'https://docs.google.com/forms/d/XXXXXXXXXXXXXXXXXXXXXXXX/formResponse',
// dataType: "xml",
data: tempData,
}).success(function(data,status){
//alert(data)
console.log("Success");
}).error(function(data,status) {
console.log('Error:' + status);
});
}
Its not about jquery or angular, CORS allows or disallow done by Back-end server.
Google might not support this.(to access https://docs.google.com)
CORS (Cross-Domain Resource Sharing) allows you to more cleanly separate your front-end from your back-end.
CORS is a group of special response headers sent from the server that tell a browser whether or not to allow the request to go through
Access-Control-Allow-Origin: http://example.com.
Why does jQuery throw an error when I request external resources using an Appcache Manifest?
I do have tried with angular still not able solve it, but with jQuery its works for me.
$.ajax({
url: 'https://docs.google.com/forms/d/xxxxxxxxx',
data: tempData,
type: "POST",
dataType: "xml",
statusCode: {
0: function () {
alert('error');
},
200: function () {
alert('Thank you for your valuable feedback');
}
}
})
I am trying to send a post request with the following code. But the request goes as GET request, instead of POST. How to fix this.
$.ajax({
url: 'https://www.exampleurl.com',
method: 'POST',
headers: {"Access-Control-Allow-Origin": true},
data: {url:'bla',call:"trans"}
dataType: 'jsonp',
success: function(data){
console.log('succes: '+data);
}
});
This is the error I am getting
XMLHttpRequest cannot load https://example.com. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access. The response had HTTP status code 401.
When removed the header Access-Control-Allow-Origin, I am getting a 404 error
I don't think, you can use a POST method with jsonp request. jsonp callbacks only for with GET method. Have a look at link .
You don't have to pass parameters in url attribute when you want to send POST request you should use data attribute instead, take a look at jQuery.ajax() :
$.ajax({
url: 'https://www.exampleurl.com',
method: 'POST',
data: {q:1, q2:2},
headers: {"Access-Control-Allow-Origin": true},
dataType: 'jsonp',
success: function(data){
console.log('succes: '+data);
}
});
Hope this helps.
I am trying to make a cross domain post call in IE9 below is my code:
$.support.cors = true;
var data = {"userid":uid,"email":email,"password":password};
if (isIE () && isIE () <= 9) {
$.ajax({
type: 'post',
crossDomain: true,
url: postUrl,
cache:false,
contentType: 'application/json; charset=utf-8',
dataType: 'jsonp',
data:data,
jsoncallback:'localJsonpCallback',
jsonp:false,
success: function (data) {
console.log(data);
},
error: function (status){
console.log(status);
$("#error").html("Incorrect E-mail Entered. Please Re-Enter Your E-mail ");
}
});
}
function localJsonpCallback(json) {
if (!json.Error) {
alert("success");
}
else {
alert(json.Message);
}
}
However, When I look at the call in fiddler I am getting a 405 error and the request header is showing a GET:
GET postUrl?format=json&userid=123456&email=test%40test.com&password=Password1&_=1434232587917 HTTP/1.1
Why is it if I am making a post that in the request header it is showing a Get? Am I doing anything syntactically wrong with my call?
Your request looks okay and from the server response you're describing, it's a "problem" with server, HTTP status code 405 means bad method, i.e. server doesn't allow POST requests. But it's still strange that it would translate those to GET, but I still think it's because of server implementation, not an error on your side. You could try with a tool like curl and see what response headers you get, but it won't help much if it's an server bug/error.
If you do not have control over the server, the only things remaining is to contact the owner and ask them to allow post request or send a GET request, although it's really bad to send non-encoded login data.
I'm trying to use JSONP to request a feed on another domain. I know that the content type should be JSON or JavaScript, but it is text/plain and I don't have control over the server so I can't change the header. How can I get an AJAX call to work?
Here is what I have so far -
function asdf() {
$.ajax({
url: "http://example.com/path/to/sharepoint/_vti_bin/listdata.svc/TestCalendar/$count",
jsonp: "callback",
dataType: "jsonp",
contentType: "text/plain",
// work with the response
success: function( response ) {
console.log( response ); // server response
}
});
}
If I just try a regular request, obviously I just get a CORS error.
XMLHttpRequest cannot load http://example.com/path/to/sharepoint/_vti_bin/listdata.svc/TestCalendar/$count. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://example.com' is therefore not allowed access. The response had HTTP status code 401.
Try to execute directly your URL in a browser to be sure that all is working fine
After that, try with this JQuery configuration:
$.ajax({
url : "YOUR_URL",
dataType : 'jsonp',
crossDomain: true,
type : 'POST',
timeout : 30000, // in milli seconds
cache : false
success:function(response) {
console.log(response);
}
});