Reactjs 静态响应S3上的网站请求URL到API重写为自己的URL

我正在尝试在AWS S3 bucket上以CloudFront作为前端托管一个静态react网站

此外，前端还使用了一个API，该API作为一个服务运行在一个连接了域的独立服务器上

然而，当我访问静态s3网站进行测试时，我可以在开发人员控制台中看到，从bucket到API的所有API调用都使用bucket自己的URL重写，因此它使用自己的URL而不是API的URL

API url是在环境变量中定义的，所以我的第一个想法是在构建期间不定义环境变量。我打印了所有进行构建的环境变量的输出，它们都是正确的

我正在看一篇stackoverflow文章（），但不幸的是它没有帮助

任何帮助或建议都将不胜感激

编辑 我的静态网站托管设置：

---

您是否在S3存储桶上启用了静态网站托管

可能是静态网站宿主属性中的重定向规则，您可以尝试以下操作：

[
    {
        "Condition": {
            "HttpErrorCodeReturnedEquals": "404"
        },
        "Redirect": {
            "HostName": "<your_website_url>",
            "HttpRedirectCode": "307",
            "Protocol": "https",
            "ReplaceKeyPrefixWith": "#!"
        }
    }
]

[
{
“条件”：{
“HttpErrorCodeReturnedEquals”：“404”
},
“重定向”：{
“主机名”：“，
“HttpRedirectCode”：“307”，
“协议”：“https”，
“将KeyPrefix替换为”：“#！”
}
}
]

是的，我已经用我的配置更新了帖子。注意到你的重定向规则为空，也许你可以试试我的？我编辑了我的答案，希望有帮助！：谢谢你的回答，但不幸的是没有用。当它点击404时，它将替换整个URL，这意味着它将删除API的端点。似乎S3是将外部URL重写为自己的URL的默认方法。我成功了。我删除了“ReplaceKeyPrefixWith”值，现在它可以工作了。非常感谢。干得好总是乐于助人：）祝你工作顺利