I have a problem with Chrome - in the network tab it only displays an empty Access-Control-Exposed-Headers header.
In postman the header's value is visible:
When trying to access the ETag header through the getResponseHeader('ETag') method of the XMLHttpRequest I'm getting a Refused to get unsafe header "etag" error. I already ran out of ideas how to fix this. Does anybody know what could be wrong?
EDIT: Apparently that behaviour is caused by the Origin header - when it is present in the request, the Access-Control-Expose-Headers in the response is empty. Unfortunately, I don't have access to the backend code, so I can't provide an example. All response headers:
HTTP/1.1 200 OK
Server: openresty/1.9.7.5
Date: Sun, 03 Sep 2017 13:02:55 GMT
Content-Type: application/json; charset=utf-8
Transfer-Encoding: chunked
Connection: keep-alive
X-Frame-Options: SAMEORIGIN
X-XSS-Protection: 1; mode=block
X-Content-Type-Options: nosniff
Access-Control-Allow-Origin: http://localhost:3000
Access-Control-Expose-Headers:
Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS
Access-Control-Allow-Headers: *,x-requested-with,Content-Type,If-Modified-Since,If-None-Match,latest_time
Access-Control-Max-Age: 1728000
ETag: "eef3e52bc505031d93da42098f32cc60"
Cache-Control: max-age=0, private, must-revalidate
X-Request-Id: eb5c7353-0b4b-43c8-b2ff-4763d56d9ec9
X-Runtime: 0.015680
Access-Control-Allow-Credentials: true
Vary: Origin
Related
I'm migrating a Shopify app from EASDK to App-Bridge. I have replaced the old API calls with the new ones, but the app is not loaded in the Shopify admin panel. I get an error in a JS console
Refused to display in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN
the wget command shows this:
HTTP/1.1 200 OK
Content-Type: text/html; charset=utf-8
Transfer-Encoding: chunked
Connection: keep-alive
Status: 200 OK
Cache-Control: max-age=0, private, must-revalidate
Vary: Accept
Referrer-Policy: strict-origin-when-cross-origin
X-Permitted-Cross-Domain-Policies: none
X-XSS-Protection: 1; mode=block
X-Request-Id: 91a511cf-d434-43af-96b8-318356bbbb9a
Link: </assets/application-63f0e6a6cb6a5ecd85ba82b031064ed920a1015deae96cc86bf3de0f7f1c5eaf.css>; rel=preload; as=style; nopush,</assets/application-3111a09ab2c1b26ba99f1c96028fdc2f1677b792d7407284f5182655a8a722d7.js>; rel=preload; as=script; nopush
X-Download-Options: noopen
ETag: W/"e8fc9609e43ff20b0c13c3000ecf4f26"
X-Frame-Options: SAMEORIGIN
X-Runtime: 0.004762
X-Content-Type-Options: nosniff
Date: Tue, 29 Mar 2022 09:59:33 GMT
Set-Cookie: _product_image_slider_session=rpnUJ5yt9PH0EEIHRo4p0RWSKraymAdpsqLh%2BPHGuNx6VU25KhA%2BBxvY4nJDHgSkxQBbacT7SyG%2BGna9bpYxCS7sWGUliu3mlPKM7Df13xbfA%2F8B%2BZ%2FKhC0E00ulV990mmeCkaV0GrrsokmodJZRg76R1ArJTNUoi4PQ54YnQCtiScogv8F38KLC2dJI%2B8eaI6j%2F0U2X6IN87nzm3RhP6dcQsNb1%2BjqvhnxScQuGW37nr84dMzpM4lJscWYElvC6cKqo3Wa897bLnkjFy46m%2BQvBo5KRXyIzqXM%2FJxyqy%2FeDUAv5qg%3D%3D--1h%2B8JkCqosbY%2FtH%2B--5mkT1eQTPoFBpn8nXLkFUQ%3D%3D; path=/; HttpOnly; SameSite=Lax
X-Powered-By: Phusion Passenger(R) 6.0.12
Server: nginx/1.18.0 + Phusion Passenger(R) 6.0.12
Strict-Transport-Security: max-age=31536000
X-Frame-Options: https://grid-kit.myshopify.com
I had a look through the nginx config and I cannot find anywhere this X-Frame-Options' to 'SAMEORIGIN header. I even added new header X-Frame-Options (see a screenshot) with the correct website, but this won't help. I just get a message of Multiple 'X-Frame-Options' headers with conflicting values ('SAMEORIGIN, https://grid-kit.myshopify.com') encountered when loading 'https://app.gridkit.net/?
Where to find the solution?
I have a simple post request with axios:
axios.post('my endpoint', values).then(res => console.log(res.headers));
axios is listing those values as headers:
cache-control: "max-age=0, private, must-revalidate"
content-length: "13757"
content-type: "application/xml; charset=utf-8"
but when I check the network tab in chrome, I can see those values under response headers:
access-control-allow-origin: http://localhost:8080
access-control-expose-headers: Total,Total-Pages
cache-control: max-age=0, private, must-revalidate
content-length: 13757
content-type: application/xml; charset=utf-8
date: Thu, 02 Sep 2021 19:37:42 GMT
x-envoy-upstream-service-time: 385
x-request-id: FqEYfGCtbcHGzzwASr4C
I need to access the x-request-id header, but there is no way to get this with axios or fetch.
I saw some messages about the header being blocked by cors, but I have X-Request-Id in my access-control-allow-headers
Someone has any idea how to get this header with axios?
I think you have to specify this on the server so that axios has access to the specific headers you require.
https://stackoverflow.com/a/37931084/8818020
Trying to get chunked content with Google AppScript UrlFetchApp:
UrlFetchApp.fetch(url, {muteHttpExceptions:true});
Unfortunately, it does not handle it well and stops after first chunk or somewhere between.
Here are the HTTP response headers:
HTTP/1.1 200 OK
access-control-allow-credentials: true
access-control-allow-origin: *
access-control-expose-headers:
cache-control: max-age=0, private, must-revalidate
content-type: application/json; charset=utf-8
date: Fri, 26 Oct 2018 11:15:24 GMT
x-request-id: 2lgi8mvh6onm5jrvf8000tl1
transfer-encoding: chunked
Connection: keep-alive
Does UrlFetchApp even support chunked responses? If not, is there any alternative?
We have two frontend urls that need to get data from the same API.
The MDN doc says multiple origins are allowed:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin
But when I get the following result (in Chrome 68):
Failed to load http://localhost:8080/api/1.0/test/: The 'Access-Control-Allow-Origin' header contains multiple values 'http://localhost:8080, http://localhost:4000', but only one is allowed. Origin 'http://localhost:4000' is therefore not allowed access. Have the server send the header with a valid value, or, if an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
Request headers
Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: nb-NO,nb;q=0.9,no;q=0.8,nn;q=0.7,en-US;q=0.6,en;q=0.5,da;q=0.4,sv;q=0.3
Cache-Control: no-cache
Connection: keep-alive
Cookie: (...)
Host: localhost:8080
Origin: http://localhost:4000
Pragma: no-cache
Referer: http://localhost:4000/test
Response headers:
Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: http://localhost:8080
Access-Control-Allow-Origin: http://localhost:4000
Cache-Control: must-revalidate
Cache-Control: private
Cache-Control: max-age=2
Content-Type: application/json;charset=UTF-8
Date: Thu, 30 Aug 2018 07:44:51 GMT
I'm trying to use angularJS with a Jetty backend.
Preflight CORS requests are working fine in chrome but in firefox I get this CORS error:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://remote.machine:8080/api/v1/provisioning/users/current-user. This can be fixed by moving the resource to the same domain or enabling CORS.
The Headers for the options request are as follows:
HTTP/1.1 200 OK
Date: Wed, 24 Sep 2014 16:06:12 GMT
X-Content-Type-Options: nosniff
X-XSS-Protection: 1; mode=block
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Pragma: no-cache
Expires: Thu, 01 Jan 1970 00:00:00 GMT
X-Frame-Options: DENY
Access-Control-Allow-Methods: GET, PUT, POST, OPTIONS, DELETE
Access-Control-Max-Age: 3600
Access-Control-Allow-Headers: Access-Control-Allow-Headers: Origin, Authorization, X-Requested-With, Content-Type, Accept
Access-Control-Allow-Credentials: true
Set-Cookie: JSESSIONID=eyv8cpnnfphy1b0121uzt293y;Path=/
Content-Length: 0
Server: Jetty(9.2.2.v20140723)
The angular request is set up as follows:
$http.get(AS_API_URL + '/provisioning/users/current-user', {
headers: {
'Authorization': 'Basic ' + base64EncodedAuth
}
});
For some reason these headers work fine in Chrome but not in Firefox, does anyone have a clue as to why? Do I need to provide more info?
EDIT:
Musa was right about the Access-Control-Allow-Headers being malformed.
I edited the Jetty Server so the header now reads:
Access-Control-Allow-Headers: Origin, Authorization, X-Requested-With, Content-Type, Accept
I give my thanks to you Musa, you just saved my day :)
To expand upon Musa's answer in the comments, Firefox is blocking the request because the following header has the header twice instead of once:
Access-Control-Allow-Headers: Access-Control-Allow-Headers: Origin, Authorization, X-Requested-With, Content-Type, Accept
should be changed to
Access-Control-Allow-Headers: Origin, Authorization, X-Requested-With, Content-Type, Accept