使用Secure Cookies从Cloudfront拒绝访问不会返回任何CORS标头，从而阻止了从XHR请求中读取错误信息

如您所知，CloudFront不会自发发出CORS标头-它们必须来自原始服务器-因此，为了在响应中查看CORS标头，CloudFront必须允许该请求...但是，当然，这是不允许的，因为您要捕获的条件是403 Forbidden。

因此，为了使您的未经授权的回复对CORS友好，我们需要的是一个额外的来源，它可以为我们提供替代的错误响应，并且该来源需要具有CORS意识。在CloudFront自定义错误响应和为此目的创建的空S3存储桶的帮助下，我们似乎可以完成该解决方案。

自定义错误响应允许您将CloudFront配置为从另一个来源获取自定义错误响应，而不是在内部生成它。作为该过程的一部分，原始请求中的某些标头包含在上游提取中，并返回错误文档中的响应标头。

S3具有方便的来源，因为它具有可配置的CORS支持。

• 创建一个新的空存储桶。
• 为存储桶启用CORS，并使用适当的参数配置CORS。为此，可以使用默认配置。
• 创建您的CloudFront发行版将使用的简单文件，而不是它的内置响应（用于403）。出于测试目的，该文件只能是一个文本文件，内容为“访问被拒绝”。
• 使用任意名称将文件上传到存储桶中，例如403.txt。选择使对象公开可读的选项。设置元数据Cache-Control: no-cache, no-store, private, must-revalidate和Content-Type: text/plain（或text/html，具体取决于您在错误文件中放置的内容）。
• 在CloudFront中，创建一个新的Origin。对于原始域名，从存储桶列表中选择存储桶。
• 创建一个新的“缓存行为”，匹配路径/403.txt（或任何您命名的文件）。白名单Origin，Access-Control-Request-Headers以及Access-Control-Request-Method转发头。将“限制查看者访问权限”设置为“否”，因为对于这一路径，我们不需要签名的凭据。请注意，此路径必须与存储桶中的文件名完全相同（除了前导斜杠，该斜杠未在存储桶中显示，但应在此处包括）。
• 在CloudFront自定义错误响应中，选择创建自定义错误响应。选择错误代码403，将“错误缓存最小值TTL”设置为0，选择“自定义错误响应”，设置“响应页面路径” /403.txt，并将“ HTTP响应代码”设置为403。
• 利润！

测试：

$ curl -v dzczcnnnnexample.cloudfront.net -H 'Origin: http://example.com'
* Rebuilt URL to: dzczcnnnnexample.cloudfront.net/
*   Trying 203.0.113.208...
* Connected to dzczcnnnnexample.cloudfront.net (203.0.113.208) port 80 (#0)
> GET / HTTP/1.1
> Host: dzczcnnnnexample.cloudfront.net
> User-Agent: curl/7.47.0
> Accept: */*
> Origin: http://example.com
>
< HTTP/1.1 403 Forbidden
< Content-Type: text/plain
< Content-Length: 16
< Connection: keep-alive
< Date: Sun, 08 Apr 2018 14:01:25 GMT
< Access-Control-Allow-Origin: *
< Access-Control-Allow-Methods: GET, HEAD
< Access-Control-Max-Age: 3000
< Last-Modified: Sun, 08 Apr 2018 13:29:19 GMT
< ETag: "fd9e8f7be7b65381c4acc272b6afc858"
< x-amz-server-side-encryption: AES256
< Cache-Control: private, no-cache, no-store, must-revalidate
< Accept-Ranges: bytes
< Server: AmazonS3
< Vary: Origin,Access-Control-Request-Headers,Access-Control-Request-Method
< X-Cache: Error from cloudfront
< Via: 1.1 1234567890a26beddeac6bfc77b2d348.cloudfront.net (CloudFront)
< X-Amz-Cf-Id: ExAmPlEIbQBtaqExamPLEQs4VwcxhvtU1YXBi47uUzUgami0Hj0MwQ==
<
Access denied.
* Connection #0 to host dzczcnnnnexample.cloudfront.net left intact

这Access denied.是我在创建的文本文件中输入的内容。在确认这对您和我一样对您都有效之后，您可能需要更多的创意。每当CloudFront抛出403错误时，将始终返回S3中此新文件的内容。此外，只要您的来源抛出403，也会返回该错误，因为自定义错误响应旨在用给定的HTTP状态代码替换所有错误。

您在上面注意到，我们看到了Access-Control-Allow-Origin: *。这是S3 CORS的默认行为。如果您在S3 CORS配置中提供了明确的来源，则会得到这样的响应...

Access-Control-Allow-Origin: http://example.com

...但是对于GET请求，我认为没有必要使用这种特异性，并且通配符就足够了。此处描述的方案不是为整个CloudFront发行版设置CORS而是仅针对错误响应设置。