React/Vite 应用程序：AWS CloudFront 出现 403 禁止错误

Question

我最近在使用 AWS CodePipeline 部署 React/Vite Web 应用程序时遇到了问题。虽然应用程序在我的本地开发环境中运行顺利，但当应用程序部署到 DEV 环境时，我遇到了一系列“403 Forbidden”错误。错误消息如下所示：

GET https://test.com/test.css net::ERR_ABORTED 403 (Forbidden)
GET https://test.com/test.js net::ERR_ABORTED 403 (Forbidden)
GET https://test.com/assets/index-495cfc72.css net::ERR_ABORTED 403 (Forbidden)
GET https://test.com/assets/index-67e333eb.js net::ERR_ABORTED 403 (Forbidden)
GET https://test.com/favicon.png 403 (Forbidden)
GET https://test.com/manifest.json 403 (Forbidden)

谢谢您的帮助！

Answer 1

如果没有确切的架构，很难准确回答，但我首先要开始检查托管文件的 S3 存储桶的访问权限。

1. 转到 AWS 控制台中的 S3
2. 找到您的资产存储桶，然后在

   Permissions

   下，禁用

   Block all public access

   （如果已启用）
3. 在

   Properties

   下，您可以设置

   Static website hosting

   设置