CORS POST not working with Apache on FF - ajax

I'm trying to do a CORS POST call from Firefox to my Tomcat server. The Tomcat provides RESTful service. Here is my server-side return code:
ResponseBuilder rb = Response.ok( JSON.serialize(result));
rb.header("Content-Type", "text/javascript;charset=utf8");
rb.header("Access-Control-Allow-Origin", "*");
rb.header("Access-Control-Max-Age", "3628800");
rb.header("Access-Control-Allow-Methods", "GET,POST");
return rb.build();
And this is my AJAX call:
var feedQueryPOST = {"param" : someListOfParams, "timeWindow": 36000};
$.ajax({
type: 'POST',
url:"http://xxx.xxx.xxx.xxx:8080/MyWebService/getwebfeed",
contentType: "text/plain",
data: feedQueryPOST,
async: true,
success:function(json){
alert("success!");
},
error:function(e){
alert(JSON.stringify(e));
},
});
When I do a test query, I use RESTClient to inspect the header and it comes back as:
Status Code: 200 OK
Access-Control-Allow-Methods: GET,POST
Access-Control-Allow-Origin: *
Access-Control-Max-Age: 3628800
Content-Length: 318
Content-Type: text/javascript;charset=utf8
Date: Mon, 31 Dec 2012 12:02:11 GMT
Server: Apache-Coyote/1.1
But on my javascript end the callback is still going to Error with readystate = 0 and status = 0. I've been looking around for answers for a very long time to no avail. I know I might be missing something simple here. Any help is appreciated, thanks ahead of time.

Instead of contentType: "text/plain",, use dataType: 'json' and you should be fine

Related

Extrange "methodNotAllowed" error

Laravel Version: 5.3.31
Description:
I have the exact same ajax call on two diferente pages of my project but im getting an "methodNotAllowed" error in one of them.
My web.php:
Route::post('/seccion', 'FiltrosController#getSecciones')->name("filtro.secciones");
My AJAX call:
$.ajax({
type: "post",
url: "{{ route("filtro.secciones") }}",
data: $("#form").serialize(),
dataType: "json",
success: function (datos) {
//mycode
},
error: function (request, status, error) {
console.log(error);
}
});
Here is the header of the call that works:
Request URL:http://192.168.99.100:3001/seccion
Request Method:POST
Status Code:200 OK
Remote Address:192.168.99.100:3001
Referrer Policy:no-referrer-when-downgrade
And the response header that i get:
Cache-Control:no-cache
Connection:Keep-Alive
Content-Length:457
Content-Type:application/json
Date:Mon, 07 Aug 2017 19:26:43 GMT
Keep-Alive:timeout=5, max=97
Server:Apache/2.4.10 (Debian)
Ok in this case all works. But then in the other page, i make the same ajax call and im getting this:
Request URL:http://192.168.99.100:3001/seccion
Request Method:POST
Status Code:405 Method Not Allowed
Remote Address:192.168.99.100:3001
Referrer Policy:no-referrer-when-downgrade
And the response header of the call that fails:
allow:POST
Cache-Control:no-cache, private
Connection:close
Content-Type:text/html; charset=UTF-8
Date:Mon, 07 Aug 2017 19:26:57 GMT
Server:Apache/2.4.10 (Debian)
X-Powered-By:PHP/7.1.7
We can see POST is allowed in the response header but im getting this "Code:405 Method Not Allowed"
I dont know what is happing, any clue?
Thanks.
The problem was that i put "{{ method_field('PATCH') }}" in the form that wraps the select dropdown that fires the ajax call, so a _method parameter with "PATCH" value is passed in the data of the ajax call and throws the "methodNotAllowed" error.
I fixed it just passing the data i need and not all the form serialized:
$.ajax({
type: "post",
url: "{{ route("filtro.secciones") }}",
data: $("#form").find('#zonas').serialize(),//<-- solution
dataType: "json",
success: function (datos) {
//my code
},
error: function (request, status, error) {
console.log(error);
}
});

HTTP Content-Disposition Header

I am making a successful AJAX POST request and in the response headers are the fields content-disposition: inline; filename="report.pdf" and content-type: application/pdf. From what I understand about these headers I expect the browser to display the PDF once the response is received, however the response comes back and nothing happens. Am I misunderstanding how these headers work? Am I missing a step that needs to be taken once the response is received by the browser?
$.ajax({
type: "POST",
url: "https://externalAPI.com" ,
contentType: "application/json",
data: payload,
headers: {"Authorization" : "XXXXXXXXX"}
})
I've started up a test server so that I can mess with the response headers and see if I can get anything to work. Content-Disposition:attachment; filename="pleasework.pdf" is also not working, not prompt for a file download. Here are my full response headers:
Access-Control-Allow-Origin:*
Connection:keep-alive
Content-Disposition:attachment; filename="pleasework.pdf"
Content-Type:application/pdf
Date:Wed, 15 Jul 2015 15:14:39 GMT
File-Extension:pdf
Number-Of-Pages:1
Transfer-Encoding:chunked
Vary:Origin
X-Powered-By:Express
X-XSS-Protection:0

How do I GET an Amazon S3 presigned url's object from jQuery Ajax

I can find nothing on Google.
I am properly creating presigned urls because they do work if I use a browser to load the request.
However, when using the identical url from a jQuery ajax call it is failing and telling me the request signature is wrong.
PS: Here are the headers. First section is from successful browser call and second section my ajax failure.
HTTP/1.1 200 OK
x-amz-id-2: clb7J//+XLYa+XS4HJthLdDO0KxBJU02fyBt29Kr8A2TXRJXM189tGgy7bWgmoYkDzXWUhg3R5g=
x-amz-request-id: F3A8C4ED98E5443E
Date: Mon, 04 May 2015 21:53:24 GMT
Access-Control-Allow-Origin: <any valid value>
Access-Control-Allow-Methods: GET, DELETE, HEAD
Access-Control-Allow-Headers: accept, content-type
Access-Control-Max-Age: 3000
Access-Control-Allow-Credentials: true
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
Content-Length: 0
Server: AmazonS3
BAD AJAX:
HTTP/1.1 403 Forbidden
Access-Control-Allow-Origin: <any valid value>
Access-Control-Allow-Methods: GET, DELETE, HEAD
Access-Control-Max-Age: 3000
Access-Control-Allow-Credentials: true
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
x-amz-request-id: 05071412E03C4541
x-amz-id-2: xw5uMr2N/alPOR7MFMbX6fVkVEf1p30VhQKyP3yUqxYXxDq+vb5hzlsyShHwY4XhgAfLd3BCjG0=
Content-Type: application/xml
Transfer-Encoding: chunked
Date: Mon, 04 May 2015 21:53:24 GMT
Server: AmazonS3
Here is my Ajax call:
$.ajax({
type: "GET",
url: presignedurl,
contentType: 'application/json; charset=utf-8',
cache: false,
async: true,
dataType: "text",
error: function (xhr, status, error) {
CentralScrutinizer("FetchDetails Exception: " + error);
},
success: function (payload) {
try {
$('#newTaskDetails').val(payload);
} catch (e) {
}
}
});
The specific error is:
<?xml version="1.0" encoding="UTF-8"?>
<Error><Code>SignatureDoesNotMatch</Code><Message>
The request signature we calculated does not match the signature you provided. Check your key and signing method.</Message>
Again, the closest I could find was a similar SO post for a put but they merely suggested adding the following headers:
//headers: { 'Content-Type': 'application/json; charset=utf-8' },
I tried that but it made no difference.
I also used fiddler to compare the two GETs (browser versus ajax) and the only thing different I see is the jsonp callback parameter.
That shouldn't affect the signature, should it?
Here are the headers
Browser Success:
HTTP/1.1 200 OK
x-amz-id-2: clb7J//+XLYa+XS4HJthLdDO0KxBJU02fyBt29Kr8A2TXRJXM189tGgy7bWgmoYkDzXWUhg3R5g=
x-amz-request-id: F3A8C4ED98E5443E
Date: Mon, 04 May 2015 21:53:24 GMT
Access-Control-Allow-Origin: <any valid origin>
Access-Control-Allow-Methods: GET, DELETE, HEAD
Access-Control-Allow-Headers: accept, content-type
Access-Control-Max-Age: 3000
Access-Control-Allow-Credentials: true
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
Content-Length: 0
Server: AmazonS3
BAD AJAX:
HTTP/1.1 403 Forbidden
Access-Control-Allow-Origin:: <any valid origin>
Access-Control-Allow-Methods: GET, DELETE, HEAD
Access-Control-Max-Age: 3000
Access-Control-Allow-Credentials: true
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
x-amz-request-id: 05071412E03C4541
x-amz-id-2: xw5uMr2N/alPOR7MFMbX6fVkVEf1p30VhQKyP3yUqxYXxDq+vb5hzlsyShHwY4XhgAfLd3BCjG0=
Content-Type: application/xml
Transfer-Encoding: chunked
Date: Mon, 04 May 2015 21:53:24 GMT
Server: AmazonS3
Thanks!
I found the answer.
I removed the following from the Ajax request:
contentType: 'application/json; charset=utf-8',
And it worked just fine.
I figured this out by comparing the response headers and subtracting what was common between the two.
Once I got the similarities out the only differences were content-length and content-type.
So as an experiment I simply commented out the contentType attribute and it worked.
That does not happen too often with s3 signatures and ajax. I feel I got lucky and hope this helps someone.

Getting error when trying to get xml server response using jQuery.ajax & jsonp

I'm trying to activate jQuery.ajax() request using jsonp and I'm getting the following error:
Resource interpreted as Script but transferred with MIME type text/xml
My request is:
return $.ajax({
type: 'GET',
url: this.AgentServiceUrl + "/" + methodName,
async: false,
jsonpCallback: 'jsonCallback',
contentType: "text/xml",
dataType: 'jsonp',
success: function (json) {
console.dir(json.sites);
},
error: function (e) {
console.log(e.message);
}
});
and the response I'm getting from the server is:
HTTP/1.1 200 OK
Cache-Control: private, max-age=0
Content-Length: 114
Content-Type: text/xml; charset=utf-8
Server: Microsoft-IIS/7.5
X-AspNet-Version: 4.0.30319
X-Powered-By: ASP.NET
Date: Wed, 19 Jun 2013 08:43:13 GMT
<?xml version="1.0" encoding="utf-8"?>
<string xmlns="http://CosmoCom.com/WebServices/TCWS/Agent">010001</string>
What can I do?
As the error message rightly says, when you mark your datatype as jsonp. it means the data you will be receiving will be script. so you cant have your contenttype as "text/xml".
Try changing it to "application/json" .
Also make sure that your service is jsonp enabled, meaning it returns data wrappped in a callback function.

AJAX success handler not being invoked

I am trying to perform an AJAX request to a Play application on Heroku from my local machine. Currently, the 'complete' and 'error' handlers are being invoke but not the 'success'. In Opera and Firefox, my response headers are:
HTTP/1.1 200 OK
Cache-Control: no-cache
Content-Type: application/json; charset=utf-8
Server: Play! Framework;1.2.4;prod
Set-Cookie: PLAY_FLASH=;Expires=Fri, 5-Oct-12 08:22:46 GMT;Path=/
Set-Cookie: PLAY_ERRORS=;Expires=Fri, 5-Oct-12 08:22:46 GMT;Path=/
Set-Cookie: PLAY_SESSION=;Expires=Fri, 5-Oct-12 08:22:46 GMT;Path=/
Content-Length: 2295
Connection: keep-alive
Opera also shows the returned JSON object
Here is my code:
var url = "http://myurl.com"
$.ajax({
'complete': function (jqXHR, status) {
console.log('Complete!');
console.log(status);
console.log(jqXHR.getAllResponseHeaders());
},
'dataType': "application/json",
'error': function (jqXHR, status, error) {
console.log('Error!');
console.log(status);
console.log(error);
},
'success': function (data, status, jqXHR) {
console.log('Success!');
console.log(status);
console.log(data);
},
'type': 'GET',
'url': url
});
Other similar questions suggested changing the datatype to text or removing it altogether: neither work. I have successfully validated the returned JSON object at JSONLint.
The console log is:
Error!
error
Complete!
error
I'm not sure if it is linked, but the getAllResponseHeaders() function is returning an empty string.
Is this a cross domain error?
Any help is welcome!
Thanks
Here they suggest that it is indeed a cross domain error.

Resources