Can't get Access-Control-Allow-Origin header to work as I expected - ajax

There are a lot of questions on this subject, but I still can't seem to resolve my issue.
I have a game that I'm trying to get working with HTML 5 in Chrome. Link here.
The game is written using libgdx and I'm posting json data from my app engine hosted back end. I've done quite a bit of reading and I think I understand the issue with cross domain access, I also think I understand how to resolve it but can't.
The full error is
XMLHttpRequest cannot load http://1-1-51.wordbuzzweb.appspot.com/Login. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://wordbuzzhtml5.appspot.com' is therefore not allowed access.
As you can see, this says No 'Access-Control-Allow-Origin' header is present on the requested resource.. But if I look at the headers for the requested resource, they are as follows.
Date: Thu, 18 Jun 2015 21:59:34 GMT
Content-Encoding: gzip
Server: Google Frontend
Vary: Accept-Encoding
Access-Control-Allow-Methods: GET, POST
Content-Type: application/json
Access-Control-Allow-Origin: *
Alternate-Protocol: 80:quic,p=0
Cache-Control: private
Access-Control-Allow-Headers: Content-Type
Content-Length: 127
As you can see, there is an Access-Control-Allow-Origin header included.
If someone could please tell me what I'm doing wrong, that'd be appreciated.
The request header is as follows using the POST method.
Host: 192.168.254.1:8081
Pragma: no-cache
Cache-Control: no-cache
Origin: http://localhost:8080/
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/44.0.2403.52 Safari/537.36
Accept: */*
Referer: http://localhost:8080/html/
Accept-Language: en-GB,en;q=0.8
Content-Length: 25
Content-Type: application/json

Since you are getting some headers back in the response, that's a good indication that the request IS reaching the server, however, the fact that it isn't hitting your server route points to the problem being the request being made doesn't match any of your routes. The request is likely an OPTIONS request rather than a POST request, which commonly happens when you make a CORS request from the browser that isn't a "simple request".
The solution would be to either make it a "simple request", or to have your server respond to OPTIONS requests. It's far easier to just make your server respond to OPTIONS requests, because sometimes even "simple requests" still send OPTIONS requests.

Related

Server response to ajax call with 200 but on browser I get error 400 on Safari

I have a strange behavior on a WordPress site. It is working just fine but several users (on safari) reported seeing error 400. While testing with safari I manage to reproduce the problem with changing the user-agent of the browser. Then I started getting error 400 on each ajax call. I've checked the access.log and all request to admin-ajax.php where served with status 200. But when I check the inspector in Safari, the same ajax request got status 400. And this is happening with each and every single ajax request on every page of the site. I've tried to log out/log in, cleared all cookies, cache and etc. but the error was still there.
The site uses ClouldFlare, so I went there and checked all the security and firewall rules, I didn't found my IP blocked anywhere.
So now the question is how a response with code 200 becomes 400?
Here is also the request and response of ajax call:
Summary
URL: https://www.example.com.com/wp-admin/admin-ajax.php
Status: 400
Source: Local Override
Address: yyy.yyy.yyy.yyy:zzz
Initiator: some-script.min.js:1:2080
Request
:method: POST
:scheme: https
:authority: www.example.com.com
:path: /wp-admin/admin-ajax.php
Accept: application/json, text/plain, */*
Content-Type: application/x-www-form-urlencoded
Origin: https://www.example.com.com
Cookie: some-cookies
Content-Length: 88
Accept-Language: en-us
Host: www.example.com.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15
Referer: https://www.example.com.com/units/main/
Accept-Encoding: gzip, deflate, br
Connection: keep-alive
Response
:status: 400
Date: Wed, 27 Jan 2021 12:27:47 GMT
Referrer-Policy: strict-origin-when-cross-origin
X-Content-Type-Options: nosniff
Cache-Control: no-cache, must-revalidate, max-age=0, no-store
X-Frame-Options: SAMEORIGIN
Content-Type: text/html
Access-Control-Allow-Credentials: true
Pragma: no-cache
Set-Cookie: some-cookies
Expires: Wed, 11 Jan 1984 05:00:00 GMT
Access-Control-Allow-Origin: https://www.example.com.com
cf-edge-cache: cache,platform=wordpress
expect-ct: max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct"
nel: {"max_age":604800,"report_to":"cf-nel"}
report-to: {"group":"cf-nel","endpoints":[{"url":"https:\/\/a.nel.cloudflare.com\/report?s=some-token"}],"max_age":604800}
cf-cache-status: DYNAMIC
cf-request-id: 07e569767900001c377fb67000000001
cf-ray: 618278372fc81c37-SOF
x-robots-tag: noindex
Server: cloudflare
Request Data
MIME Type: application/x-www-form-urlencoded
action: my_ajax_callback
term_id: 1209
page_id
And this is the from the access.log:
xx.xxx.xx.xxx - - [24/Mar/2021:10:16:46 +0000] "POST /wp-admin/admin-ajax.php HTTP/1.0" 200 12203 "https://example.com/some-page/" "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15"
UPDATE
I have to say that this is happening only on Safari and no other browser. Also I'm running Safari in VM with Mojave, not sure if this is related, but I though it is worthy to mention this.
I have tried to pause the CF service, and this change was visible on all other browsers but Safari continued to server the site over CF (I can see in the response header server that its value was cloudflare while on the other browsers it was nginx). I've flushed the DNS in the terminal and restarted VM a few times but this didn't changed.
I have also disabled all the security and firewall features on CloudFlare after I enabled it again but this also didn't solve the problem. I'm starting to believe that the problem lies some where in Safari and not in CF.
Try turning Cloudflare off, the setting is called "Pause Cloudflare on Site" to isolate it and see if that makes a difference. Maybe you have some goofy modsec rules in place?

Failed to load, Response for preflight has invalid HTTP status code 500

I have http get method called by client side to the server, but when ran it, the method is OPTIONS, here is the output i am seeing in Chrome Dev tools, for the GET Method,
Request URL: http://localhost:9090/area
Request Method: OPTIONS
Status Code: 500
Remote Address: [::1]:9090
Referrer Policy: no-referrer-when-downgrade
Response headers,
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: authorization, content-type
Access-Control-Allow-Methods: GET
Access-Control-Allow-Origin: http://localhost:4201
Allow: GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS, PATCH
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Connection: close
Content-Length: 0
Date: Tue, 20 Mar 2018 18:49:59 GMT
Expires: 0
Pragma: no-cache
Vary: Origin
X-Content-Type-Options: nosniff
X-Frame-Options: DENY
X-XSS-Protection: 1; mode=block
and Request headers are,
Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9
Access-Control-Request-Headers: authorization,content-type
Access-Control-Request-Method: GET
Connection: keep-alive
Host: localhost:9090
Origin: http://localhost:4201
User-Agent: Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.162 Safari/537.36
Why the GET method is not getting called, i know there are already some answers here, but i did not understand well, can some one please help me for clear understandig? Thank You in advance.
The OPTIONS request is what is called a preflight request from the browser. In a simple way is basically the browser sending an initial request to the server asking for permission to then do a GET or POST or any other verb. This happens whenever a request needs permissions to be executed. If the server replies saying you have permissions to run the request you intend to, it will then perform the initial request (GET in this case). If the OPTIONS request is denied, it will not execute any subsequent request. You can see it as a way of testing the waters for requests :)
The reasons to be denied may be several. You might not have the correct headers, you might be missing authentication or authentication token, and so on.
From what I can see on your requests you are doing the requests from localhost to localhost. That will cause you problems with CORS.
Here’s a link on how to configure CORS for spring ( the server you said you are using in the comments below )

Bad request as a response in jmeter

I'm using a POST request in jmeter as below,
POST https://aumaz-ap-perf-ess-web-2.aumaz-ase-dev002.p.azurewebsites.net/signalr/connect
POST data:
clientProtocol=1.5&connectionData=%5B%7B%22name%22%3A%22bulkprocesshub%22%7D%5D&connectionToken=DWGWhf7zGj9TyO4cZn2kqH%2Bennba0V7qyAuAE2wIeu3vIoj%2FrLXemcaBz%2Fto3JjEs%2BaVviiFagxtax8E9PbE36cnBAlrByzw5qBwmIu9glop75vPY3XI0me52yTDiWC%2B9Zoalg%3D%3D&processId=b47fe282-8112-4a11-a18c-7629ac31b816&transport=longPolling
Request Headers:
X-Requested-With: XMLHttpRequest
Accept: text/plain, */*; q=0.01
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:52.0) Gecko/20100101 Firefox/52.0
Referer: https://aumaz-ap-perf-ess-web-2.aumaz-ase-dev002.p.azurewebsites.net/ESS/DataType
Connection: keep-alive
Connection: keep-alive
Host: aumaz-ap-perf-ess-web-2.aumaz-ase-dev002.p.azurewebsites.net
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br
Content-Length: 315
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
If I use the same POST request in browser i can able to get the exact response. But in jmeter I'm getting the response as Bad request.
As of now, I'm using jmeter 3.01 and I have installed all the certificates needed. Can anyone please give solution for this
The most problem here seems to be that server doesn't respond with any details of what's wrong with the request. Correct?
Then do two things:
1) Install Fiddler, capture what you're sending through browser, and through JMeter, compare.
That may give you a clue what's the difference.
2) Reach server logs and see what's going on, there may be way more intrinsic information on why request was considered invalid.
I have finally got a solution. If I pass those parameters in parameters it doesn't work but i gave all the parameters with & in the path itself.
And used ${__urlencode{parameter}} to encode the parameters which are passing as encoded value and then I didn't face any Bad request issue.
Even now, I don't know how it worked. But finally got a solution by this way.

CORS XMLHttpRequest using POST to send multipart form-data to Softlayer object storage fails

I have been encountering error in storing a file to Object Storage using HTTP POST method sent using Async XMLHttpRequest. The request is a CORS HTTP request sent to the Object storage public URL with required headers set. The error message says: Reason: CORS header Access-Control-Allow-Origin missing.
The error seems to happen with multipart form data send request using POST. If PUT is used to create the file, the required file (resource) gets created. The response to the PUT request contains the required Access-Control-Allow-Origin header, whereas the response to POST does not contain despite the meta data attributes being set on the container.
I have even tried using X_AUTH_TOKEN header instead of X_STORAGE_TOKEN, but the failure continues to happen.
Raised the ticket with Softlayer support, but have not received a solution. Any ideas to resolve the above would be helpful.
The details are below:
The container prod_file has following meta data attributes set:
access-control-expose-headers: Access-Control-Allow-Origin
access-control-allow-origin : *
The Firefox browser version is: Mozilla Firefox 46.0
Client OS is: Linux 3.16.0-71-generic #91~14.04.1-Ubuntu SMP Mon Apr 18 1K9:43:36 UTC 2016 x86_64 x86_64 x86_64 GNU/Linux
Request URL: https://*****.objectstorage.softlayer.net/v1/AUTH_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/prod_file/6ffb51fc-e40f-4cf5-982c-44cb5c342851.fl.file.orig.txt
Request HTTP Method: POST
Mechanism used: Async XMLHttpRequest
Request Headers:
Host: *****.objectstorage.softlayer.net
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:46.0) Gecko/20100101 Firefox/46.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br
X-Storage-Token: AUTH_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
Referer: http://*****myorg******.com/organization/572680760cf26af856c7432c/resources
Content-Length: 4500
Content-Type: multipart/form-data; boundary=---------------------------2139255891192408661525197545
Origin: http://*****myorg******.com
Connection: keep-alive
Response Headers:
Connection: keep-alive
Content-Length: 50
Content-Type: text/plain
Date: Sat, 14 May 2016 14:57:02 GMT
X-Trans-Id: *****Some Transaction Id********
The error response has the following message:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://*****.objectstorage.softlayer.net/v1/AUTH_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/prod_file/6ffb51fc-e40f-4cf5-982c-44cb5c342851.fl.file.orig.txt. (Reason: CORS header 'Access-Control-Allow-Origin' missing)
Thanks for the help in advance.
It looks like you set wrong the headers for your container, please take a look this documentation and try it:
http://docs.openstack.org/developer/swift/cors.html
https://swiftstack.com/blog/2013/04/02/using-cors-with-swift/
Renember that softlayer object storage is based in Open Stack.
Let me know if you are still having troubles
Regards

Firefox CORS Cross Domain Resource Sharing Pre-Flight Debugging

I'm trying to get Firefox to allow me to make an XmlHttpRequest for data from an application port.
I can see that the initial send triggers an OPTIONS message, and I have trapped this using NetMon, and I can see the HTTP fields...
OPTIONS /any.htm HTTP/1.1
Host: www.mysite.co.uk:10090
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:18.0) Gecko/20100101 Firefox/18.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-gb,en;q=0.5
Accept-Encoding: gzip, deflate
DNT: 1
Origin: http://www.mysite.co.uk
Access-Control-Request-Method: POST
Access-Control-Request-Headers: content-type
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
I respond to this with an OK to tell FireFox to get a move on and send me the data in the XHR request...
HTTP/1.1 200 OK
Access-Control-Allow-Methods: POST,-GET,-OPTIONS
Access-Control-Allow-Origin: *
Access-Control-Max-Age: 172800000
Server: Kawasu-OrderSub
Date: Wed, 23 Jan 2013 15:00:50 GMT
But the POST is never sent, which I assume means that FireFox is not happy with the 200 OK response. The POST sends data with a Content-Type of "application/json"
I've got FireBug and the Net tab has the XHR button, but this will only show the XHR after the pre-flight check has been passed.
Main Question: How can I see (and debug) what FireFox does not like about the server response?
Much obliged for any help in advance.
You need to include the Access-Control-Allow-Headers: content-type response header. This is because the request has the Access-Control-Request-Headers: content-type header, and this value needs to be included in the response.

Resources