我使用 AWS Amplify 部署 React 应用程序。当我部署 React Web 应用程序时，根 URL 可按预期工作（example.com）。但是，如果您尝试访问子 URL（例如 example.com/something），则会出现错误 AccessDenied。

我的 react-router 代码如下：

import { BrowserRouter, Routes, Route } from "react-router-dom";

const Router = () => {
    return ( 
        <React.Fragment>
            <BrowserRouter>
                <Routes>
                    <Route path="/" element={
                        <React.Fragment>
                            <Footer/>
                        </React.Fragment>
                    } />

                    <Route path="something" element={
                        <React.Fragment>
                            <Something/>
                            <Footer/>
                        </React.Fragment>
                    } />
                </Routes>
            </BrowserRouter>
        </React.Fragment>
    )
}

环顾四周， 似乎您需要设置一个重定向规则 ，如下所示：

[
    {
        "source": "</^[^.]+$|\\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|ttf|map|json)$)([^.]+$)/>",
        "target": "/index.html",
        "status": "200",
        "condition": null
    }
]

当我这样做时，它确实不再给我 AccessDenied 错误，但是现在我的 react-rotuer-dom 代码无法按预期工作，我只得到一个空的 index.html 页面。

我已经有这种情况很长时间了，这太烦人了。我不知道这是 React 问题还是 AWS 问题。您能给我指出正确的方向吗？

更新

AWS Amplify Exports 似乎存在问题？当我尝试导航到 Web 应用程序的主页时，我得到了一个空白页，然后查看控制台时，我看到一个错误： “TypeError：undefined 不是对象（评估‘l[e].call’）” ，即以下行：

return l[e].call(r.exports, r, r.exports, f), r.l = !0, r.exports