时间戳

首页 > 解决方案 > 如何修复 AccessDenied 错误 CloudFront Angular 部署的应用程序？

angular - 如何修复 AccessDenied 错误 CloudFront Angular 部署的应用程序？

问题描述

我正在设置一个部署在 S3 上并由 CloudFront 分发处理的 Angular 应用程序。当我访问该应用程序时，它可以正常工作，但是如果我重新加载页面，则会出现以下错误：

<Error>
<Code>AccessDenied</Code>
<Message>Access Denied</Message>
<RequestId>E716BA4DFD8C1B54</RequestId>
<HostId>
0EcNthjt/zlsAZxEx8JncShstTBNxFram3F6Jy2uI0LD+am1l+7YxGAbZ1dVphkuhZj32mnkjug=
</HostId>
</Error>

我已经按照本教程设置了包含所有必需字段的 CloudFront 分发：

将 angular spa 部署为静态网站

我已将 index.html 作为默认根对象放置，并将其放置在 S3 存储桶的索引文档选项下。

通过该设置，当您重新加载页面时，它应该可以工作并使用 angular 的 index.html，但是我收到了 AccessDenied 错误。

标签： angulardeploymentamazon-cloudfront

解决方案

好的，我刚刚从同一篇文章中发现了这个问题：

将 angular spa 部署为静态网站

注意到这一点非常重要：

重要提示：Origin Domain Name 将为您提供 S3 存储桶的下拉列表。你不应该使用它。因为它省略了 S3 的区域，它将导致请求重定向，而不是通过 CloudFront 传递流量。（可能有更好的配置方法，我不确定。）所以只需在此处复制并粘贴您的 S3 URL。.s3-.amazonaws.com 。

确保使用以下 URL 结构将存储桶放置为原始域名：

<bucket-name>.s3-website-<bucket-region>.amazonaws.com

不要使用建议的存储桶 URL 结构，因为它不起作用。希望这对未来有所帮助。

推荐阅读