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.
Related
I have a problem.
Is it possible to make a request to a different domain? For example, I have a website test.com and it has to take some data from http://www.google.lv/search?q=fat+pumpkin. I already have tried jQuery .load method, XMLHttpRequest(), but the result is always the same, I get error: Failed to load https://www.google.lv/search?q=fat+pumpkin&.rtng: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
Is there some option to overcome it without PHP or another server language?
The same question as your case : Access-Control-Allow-Origin error sending a jQuery Post to Google API's.
Basically you need to add a crossDomain option for ajax request, example:
$.ajax({
url: 'https://www.googleapis.com/moderator/v1/series?key='+key,
data: myData,
type: 'GET',
crossDomain: true,
dataType: 'jsonp',
success: function() { alert("Success"); },
error: function() { alert('Failed!'); },
beforeSend: setHeader
});
I wanna make a CORS get request to, say google (just an example. I'm actually accessing a website that returns json data). Below is my ajax code:
$.ajax({
url: "https://www.google.com",
type: "get",
dataType: "json",
crossDomain: true,
success: function(data, textStatus) {
alert ("success" + data);
},
error: function(data, textStatus) {
alert ("fail" + data);
}
})
With the above code I got this error:
XMLHttpRequest cannot load https://www.google.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://sdlweb-dev:1234' is therefore not allowed access. The response had HTTP status code 405.
I tried adding code like
headers: {
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Headers": "X-Requested-With,content-type",
"Access-Control-Allow-Credentials": true
}
but still got the same error.
I tried changing dataType from 'json' to 'jsonp'. This way the request is sent, but since the response isn't jsonp, I got another error:
Uncaught SyntaxError: Unexpected token <
Without modifying the server side (I mean the url that I send get request to, because I do not have access to that), can I be able to send CORS request?
Any help is appreciated!!!
Thanks,
Fei
You must have access to the server code in order to allow CORS requests.
The headers that you showed should be headers sent back in the response, not in the request.
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'm trying to send POST attributes from client to server in another domain.
Since simple json dataType won't work in a cross domain,
i've tried with JSONP
<script>
var lookup = {'username':'admin'}
$.ajax({
url: "https://somesite.com/router.php",
type: "post",
data: JSON.stringify(lookup),
dataType: "jsonp",
success: function(response) {
alert(response);
},
failure: alert("failed")
});
</script>
But then it send it as GET and not POST.
This is how it looks like in Fiddler:
Request URL: https://somesite.com/router.php?callback=jQuery172016627637017518282_1429096551228&{%22username%22:%22admin%22}&_=1429096552070
Request Method: GET
Status Code: 500
Query Url
callback: jQuery172016627637017518282_1429096551228
_: 1429096552070
So how can i send this paramter (username=admin) to a cross domain as POST?
Thanks.
You must add method: 'POST' to your ajax call otherwise jQuery appends your data object to the URL (GET parameters)
Source
You can send request from controller or configure target server to accept request.
i.e. in .htaccess
<ifModule mod_headers.c>
Header set Access-Control-Allow-Origin: *
</ifModule>
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);
}
});