Unity3D WebGL network download from S3 failing due to missing Origin header + CORS - unity3d

I'm having some issues trying to download a resource from our S3 CDN.
We appear to have CORS set up properly on S3.
The S3 CORS troubleshooting guide states that you need to post the "Origin" header, otherwise it will ignore all of the CORS headers:
If the header is missing, Amazon S3 doesn't treat the request as a
cross-origin request, and doesn't send CORS response headers in the
response.
I have tested using curl to ensure that the relevant CORS headers are being returned, and I can see that these are only returned if the "Origin" header is sent.
eg: if I run the following:
curl -v -H "Origin: http://localhost" https://cdn.myurl.com/mybucket/mystuff.json
I get the following headers returned (as well as a screed of other information):
access-control-allow-origin: *
access-control-allow-methods: GET, POST, HEAD
However, when I DON'T pass the Origin header, those return headers are missing:
curl -v https://cdn.myurl.com/mybucket/mystuff.json
I'm trying to pull the data down using a UnityWebRequest get request. When I run my application via WebGL I can see an exception when I call request.SendWebRequest()
Failed to load https://cdn.myurl.com/mybucket/mystuff.json:
No 'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'http://localhost:17936' is therefore not allowed
access.
I can only assume then that the UnityWebRequest isn't sending the "Origin" header.
I can't explicitly set the header, because if I do I get the error:
UnityWebRequest request = UnityWebRequest.Get(uri);
request.SetRequestHeader("Origin", "http://localhost");
InvalidOperationException: Cannot override system-specified headers
I'm quite stuck at this point.
UPDATE:
#sideshowbarker mentioned that the Origin header is automatically added by the browser, so that was perhaps a red herring for me.
They also suggested that I need to look at the request headers in my browser tools. This is what I see when looking at the request from the WebGL application for this particular object in my browser:
There are a couple of points of interest to me here.
In the Request headers, it has a note that Provisional headers are shown. I assume that means that the browser tools are making their best guess at what headers are being sent?
The request is successful - I get a 200 (success) response code. The content-length header (42) is the correct size that I expect. The game code is just failing based on the missing CORS headers.
The image shows the 200 response code with the note "(from disk cache)". I have cleared my cache and re-run this, and the first hit (my code does a retry) does correctly not load from cache, but still fails the CORS test.
The only other spanner in the mix here that I can think of is that we are using CloudFlare in front of the S3 bucket. I believe that this shouldn't cause issues because it is supposed to forward the CORS headers, but I will do a test bypassing CloudFlare.

You have to add the CORS policy to the S3 Bucket where you are hosting your game.
AWS Documentaion. That will allow you to then make https calls and Rest API calls etc... It is a bucket setting not a game setting.

Just add the "HEAD" request to the cors config of Amazon
[
{
"AllowedHeaders": [
"*"
],
"AllowedMethods": [
"GET",
"POST",
"HEAD"
],

Related

When querying Flow blockchain I get a CORS error

When executing a query through javascript I get a CORS error:
Access to fetch at 'http://access.mainnet.nodes.onflow.org:9000/v1/scripts?block_height=sealed' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
This error happens when querying from testnet and mainnet.
Also happens from localhost or from a site running in Vercel.
The rpcs I tried:
https://access-testnet.onflow.org/
http://access.devnet.nodes.onflow.org:9000/
http://flow-testnet.g.alchemy.com:443/
(also tried their mainnet counterparts)
Solved the problem using these rpcs:
https://rest-testnet.onflow.org/
https://rest-mainnet.onflow.org/

Is Chrome failing when sending a large http header?

I have been troubleshooting an error on my web app and have concluded that Chrome is failing to handle my http request when my headers get too large.
Why are my headers large?
I am using a JWT authorization scheme that includes permissions in the JWT token. With my admin account that token is growing as I have permissions for each tenant. The JWT is currently around 5200 characters.
Why do I blame chrome?
I have tested the identical request in several environments:
Swagger: fails with TypeError: Failed to fetch
Postman Chrome Extension: fails with Could not get any response
Postman Native App: Succeeds
Python script using requests: Succeeds
curl: Succeeds
For each test I have the same headers, url, and body (none because it is a GET).
Notes
While researching this, I came across this SO Question which suggests that Chrome is limited to 250KB headers. Mine are under 6k.
If I use a smaller Authorization header, then Swagger and the Postman Chrome Extension both succeed.
Bottom line:
Can we confirm my conclusion that Chrome is having trouble with the larger header?
What can I do about that?

Ionic v1 error only in POST 'Access-Control-Allow-Origin'

I have an error using Ionic v1 when I make a POST call. GET and PUT calls works, but only POST calls don't work, the error is this:
XMLHttpRequest cannot load http://localhost:8080/FoodDrinkDispener/rest/user. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8100' is therefore not allowed access. The response had HTTP status code 403.
I tryed this POST request in "Postman" and it works very well. I don't know what is the problem is a mistery. I found something in internet but I read that there are some things to change in some configuration files not present in my project (maybe for the Ionic version)
Solved using "Moesif Origin & CORS Changer" Google Chrome Estension.

Angular2, REST Service POST Call error : "Cross-Origin Request Blocked"

I am trying to call REST APIs from development environment(localhost:4200) using Angular 2 (version 4.0.0)
getting the below error message:
"Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://localhost:8000/auth. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing)."
Here I am providing a code sample for reference:
var headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded;charset=UTF-8');
return this.http.post(this.loginUrl, 'POST_Parameters', {
headers: headers
}).map(res => {
console.log(res);
});
Can someone please help me to find out solution for this issue?
CORS must be enabled by backend. Depending on backend framework, usually you must send specific header that backend can recognize. But until you explicitly enable CORS support on backend, sending header is useless
on a project of mine i just went to my server (apache2 on linux 16.04 ) and i just added the "Header set Access-Control-Allow-Origin "*"" on the virtual server config file
As per Browser policy CORS is not allowed. If you are using POSTMAN then this error won't not occur.
CORS error should only remove by server side. Hence you should set header in your backend code.
If you are using express as your backend ...
app.use(function(req,res){
res.header('Access-Control-Allow-Origin', '*');});
You are in local server. You need to run api and angular app on same server.
When you upload project on same production server I hope This error will not shown.

JIRA REST API cors

I keep getting the following CORS error when trying to consume the JIRA ReST API:
Fetch API cannot load
https://jira.our-domain-name.com/jira/rest/api/2/search?jql=project=tcc%20and%20cf[10809]~8423362.
Response to preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'https://application-url.our-domain-name.com' is therefore not allowed
access. If an opaque response serves your needs, set the request's
mode to 'no-cors' to fetch the resource with CORS disabled.
However, this search URL works 100% when I paste it directly into the browser, or running it through Postman, or using CURL from command line.
My app is calling the API, using the javascript fetch API. I set the following headers when making the GET request:
headers: {
"content-type": "application/json",
"authorization": "Basic <<encrypted>>"
}
I have ensured that the requesting host has been whitelised in JIRA admin - I have tested the host using the test feature on the whitelist page.
When I change the whitelist from wildcard to Domain Name, I suddenly get this:
Fetch API cannot load
https://jira.our-domain-name.com/jira/rest/api/2/search?jql=project=tcc%20and%20cf[10809]~8423362.
Request header field authorization is not allowed by
Access-Control-Allow-Headers in preflight response.
Any ideas?
You have 2 options.
The easiest way is to proxy your request through your backend (if that's possible) since the CORS restrictions are enforced on JavaScript running within the browser.
The other way would be to reconfigure the Tomcat server that Jira is running on to support sending a CORS header. This can have other security implications if not done right.