2017-04-19 12 views
2

curlとブラウザ(FFとChrome)を使用して、サーバーから返されるヘッダーが異なります。CORS AWS S3とクラウドフロント

カールは、一方

curl -X GET -I -H "Origin: https://qa.gameofshred.com" https://s3-ap-southeast-1.amazonaws.com/gameofshred-qa/site/fontawesome-webfont.912ec66d7572ff821749.svg --verbose 

> GET /gameofshred-qa/site/fontawesome-webfont.912ec66d7572ff821749.svg HTTP/1.1 
> User-Agent: curl/7.29.0 
> Host: s3-ap-southeast-1.amazonaws.com 
> Accept: */* 
> Origin: https://qa.gameofshred.com 
> 
< HTTP/1.1 200 OK 
HTTP/1.1 200 OK 
< x-amz-id-2: m9oDqyGs0K+0IBnygQlGE9IEeVZQcpIf1nYSWYYu5NU5Hu3gNEUy8SfWnO/mFiK8nPIBPlDhWec= 
x-amz-id-2: m9oDqyGs0K+0IBnygQlGE9IEeVZQcpIf1nYSWYYu5NU5Hu3gNEUy8SfWnO/mFiK8nPIBPlDhWec= 
< x-amz-request-id: 135C9D56C2C0D604 
x-amz-request-id: 135C9D56C2C0D604 
< Date: Wed, 19 Apr 2017 02:37:34 GMT 
Date: Wed, 19 Apr 2017 02:37:34 GMT 
< Access-Control-Allow-Origin: * 
Access-Control-Allow-Origin: * 
< Access-Control-Allow-Methods: GET 
Access-Control-Allow-Methods: GET 
< Access-Control-Max-Age: 3000 
Access-Control-Max-Age: 3000 
< Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method 
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method 
< Last-Modified: Tue, 18 Apr 2017 23:02:06 GMT 
Last-Modified: Tue, 18 Apr 2017 23:02:06 GMT 
< ETag: "912ec66d7572ff821749319396470bde" 
ETag: "912ec66d7572ff821749319396470bde" 
< Accept-Ranges: bytes 
Accept-Ranges: bytes 
< Content-Type: image/svg+xml 
Content-Type: image/svg+xml 
< Content-Length: 444379 
Content-Length: 444379 
< Server: AmazonS3 
Server: AmazonS3 

ブラウザは、任意のCORSヘッダを含まないCORSヘッダを返します。

要求:

GET /gameofshred-qa/site/fontawesome-webfont.912ec66d7572ff821749.svg HTTP/1.1 
Host: s3-ap-southeast-1.amazonaws.com 
Origin: https://qa.gameofshred.com 
Accept: */* 
User-Agent: curl/7.29.0 
Cache-Control: no-cache 

応答:

Accept-Ranges → bytes 
Content-Length → 444379 
Content-Type → image/svg+xml 
Date → Wed, 19 Apr 2017 02:32:37 GMT 
ETag → "912ec66d7572ff821749319396470bde" 
Last-Modified → Tue, 18 Apr 2017 23:02:06 GMT 
Server → AmazonS3 
x-amz-id-2 → O0V/q2q9vSKQgJWKUL8LfsQghKlyBS90fTYDt9TLcgJimjeCUKg57+UwgAnWym8tJRPpGsRutG0= 
x-amz-request-id → 5EA7299EC61D0E86 

どれ説明?ありがとう。

UPD: 私が提案したように、私はcors設定を更新しました。 明らかにCORSをチェックするための郵便配達を使用して2つの理由 1)CDNキャッシング 2)によって引き起こされた問題:それは

<?xml version="1.0" encoding="UTF-8"?> 
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> 
<CORSRule> 
    <AllowedOrigin>*</AllowedOrigin> 
    <AllowedMethod>GET</AllowedMethod> 
    <AllowedMethod>HEAD</AllowedMethod> 
    <MaxAgeSeconds>55</MaxAgeSeconds> 
    <AllowedHeader>Authorization</AllowedHeader> 
</CORSRule> 
</CORSConfiguration> 

UPD 2を助けにはなりませんでした。郵便配達員(ブラウザ版)は、ORIGINを「chrome:// extensions ....」のようなものに置き換えるため、テストには使用できません。

答えて

2

を増やしてみてください:

バケット>権限> CORS構成次に

<?xml version="1.0" encoding="UTF-8"?> 
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> 
<CORSRule> 
    <AllowedOrigin>*</AllowedOrigin> 
    <AllowedMethod>GET</AllowedMethod> 
    <AllowedMethod>HEAD</AllowedMethod> 
    <MaxAgeSeconds>3000</MaxAgeSeconds> 
    <AllowedHeader>Authorization</AllowedHeader> 
</CORSRule> 
</CORSConfiguration> 

あなたがブラウザで&カール表示されるはずです:

Access-Control-Allow-Origin: * 
Access-Control-Allow-Methods: GET, HEAD 
Access-Control-Max-Age: 3000 
+0

それはdoesnの助けてください...まだ同じです –

+0

@ArtemIbragimov AWSでCORS設定を編集したところ、正しいヘッダーが表示されるまで少し時間がかかりました。それがあなたの事件であるかどうかわからないが、それは待つことを傷つけることはない。 –

+0

だから私はMaxAgeSecondsを更新したので、いつ変更が行われたのかは確かに分かった。カールで更新された「Access-Control-Max-Age」が表示されているがブラウザはまだ同じである –

1

ブラウザドンをCORSのAWS S3の構成に<AllowedMethod>HEAD</AllowedMethod>直接https://s3-ap-southeast-1.amazonaws.com/gameofshred-qa/site/fontawesome-webfont.912ec66d7572ff821749.svgに移動するとOriginヘッダーを送信しないでください。

XHR /フェッチを使用してリクエストを送信すると、ブラウザはOriginヘッダーを送信します。リクエストにOriginヘッダーが含まれていて、そのサーバーがAccess-Control-Allow-Origin: *を送信するように設定されている場合、ブラウザはそのフロントエンドコードが応答にアクセスできるようにします。

fetch("https://s3-ap-southeast-1.amazonaws.com/gameofshred-qa/site/fontawesome-webfont.912ec66d7572ff821749.svg") 
 
    .then(response => response.text()) 
 
    .then(svg => document.querySelector("xmp").innerHTML = svg);
<xmp></xmp>

ブラウザで直接https://s3-ap-southeast-1.amazonaws.com/gameofshred-qa/site/fontawesome-webfont.912ec66d7572ff821749.svgに移動してからレスポンスヘッダを見たとき、あなたはAccess-Control-Allow-Originレスポンスヘッダは表示されませんだから、なぜです。

しかしフロントエンドのJavaScriptコードでは、ブラウザに直接移動する場合とは異なり、フロントエンドコードからのリクエストに対してOriginヘッダーが送信されるため、JavaScriptコードで表示されます。

リクエストにOriginヘッダーが含まれている場合にのみ、Access-Control-Allow-Originレスポンスヘッダーを送信するようにサーバーを設定することは、かなり一般的なことです。このサーバは、そのように設定されているので、あなたがcurlまたは何でそれに要求を行う場合は、Originリクエストヘッダを送信する場合、あなたはそれだけからの応答にAccess-Control-Allow-Originを得るでしょう、なぜ、それはです:

# With no Origin request header sent: 

$ curl -X GET -I https://s3-ap-southeast-1.amazonaws.com/gameofshred-qa/site/fontawesome-webfont.912ec66d7572ff821749.svg 
HTTP/1.1 200 OK 
x-amz-id-2: S3LUW5kEWKv2SRLVATa14/oc4/agz81x2u/ICXXrzG37RzDTWJZB74MeW3g0OWG1Hx9BT09TOu0= 
x-amz-request-id: B15104B677AFC7AF 
Date: Wed, 19 Apr 2017 03:41:39 GMT 
Last-Modified: Tue, 18 Apr 2017 23:02:06 GMT 
ETag: "912ec66d7572ff821749319396470bde" 
Accept-Ranges: bytes 
Content-Type: image/svg+xml 
Content-Length: 444379 
Server: AmazonS3 

# With Origin request header sent: 

$ curl -X GET -I -H "Origin: https://qa.gameofshred.com" https://s3-ap-southeast-1.amazonaws.com/gameofshred-qa/site/fontawesome-webfont.912ec66d7572ff821749.svg 
HTTP/1.1 200 OK 
x-amz-id-2: /Lm0fHcXMR0/rY86wZDAfWqQ3Dhv1uW0TAkBdUltNltskXdiLjDS8H/lzgKHlglcCKZJHEdcoao= 
x-amz-request-id: 749F8CCD56060E92 
Date: Wed, 19 Apr 2017 03:40:00 GMT 
Access-Control-Allow-Origin: * 
Access-Control-Allow-Methods: GET, HEAD 
Access-Control-Max-Age: 3600 
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method 
Last-Modified: Tue, 18 Apr 2017 23:02:06 GMT 
ETag: "912ec66d7572ff821749319396470bde" 
Accept-Ranges: bytes 
Content-Type: image/svg+xml 
Content-Length: 444379 
Server: AmazonS3 
+0

私はそのことを理解しています。それで、私は郵便配達員を使い、Originヘッダを手動で設定しました。 –

関連する問題