React-Router-DOM 实际上没有创建路由？

Question

我按照教程在一个简单的 create-react-app 上设置 Auth0。到目前为止，我在项目中唯一拥有的是身份验证和路由。在 localhost 中开发时，应用运行良好：

• /路由到/home，并显示当前登录状态
• /home 路由到/home，^
• /callback，由身份验证服务调用，路由正常，处理身份验证并重定向到登录页面。

正如我所提到的，所有这些路由都在开发中运行良好。我能够看到一个登录页面，按登录，使用凭据登录，通过/callback 重新路由回到主页，并且只有在您登录时才能看到材料。然后我能够注销并再次正确路由返回登录页面。

我将应用程序部署到了一个网站 (https://dashboard.xxxxx.com)，但除了 / 之外，其他路由都不起作用。所以https://dashboard.xxxxx.com 有效，但找不到https://dashboard.xxxxx.com/home 和https://dashboard.xxxxx.com/callback。

这会导致 auth0 服务无法登录，因为它重定向到 https://dashboard.xxxxx.com/callback 但该页面不存在。

我从react-router-dom 开始只使用Routes 的Router，然后我尝试使用带有Switch 和Routes 的Router。然后我尝试了BrowserRouter，然后尝试了HashRouter，但都没有奏效。我当前的代码如下：

    <HashRouter history={history} component={Home}>
        <Switch>
            <Route exact path='/' render={(props) => <Home auth={auth} {...props}/>}/>
            <Route exact path='/home' render={(props) => <Home auth={auth} {...props}/>}/>
            <Route exact path='/callback' render={(props) => {
                handleAuth(props);
                return <Callback {...props}/>
            }}/>
        </Switch>
    </HashRouter>

Answer 1

发生这种情况是因为您没有将所有请求从用于初始化应用程序的服务器重定向到 index.html。 您需要从服务器端重定向所有对 index.html 的调用，可能位于 .htaccess 文件、节点或您将使用的任何其他框架中。

如果您使用 Create-react-app 或任何其他方式，本地重定向到 index.html 将由它处理。