端点路径不是永久的（nginx/react）

Question

我在通过 nginx 路由 2 个反应应用程序时遇到问题：我有一个客户端应用程序和一个管理应用程序，它们的 package.json 中都有 "homepage": "https://example.com/" 和 https://example.com/admin/（如果这很重要？）。 我希望能够从这些端点访问它们，我可以毫无问题地访问 /admin，但它会自动将我重定向到 /dashboard（而不是 /admin/dashboard）上的管理仪表板。一旦我按下重新加载，它就会从客户端向我发回 404。

这是我的 nginx conf 的相关部分：

resolver 1.1.1.1 1.0.0.1;

    root /usr/share/nginx/html/client/build/;
    index index.html;

location /admin {
        gzip_static on;
        alias /usr/share/nginx/html/admin/build/;
        index index.html index.htm;
        try_files $uri /index.html =404;
    }

    location / {
        gzip_static on;
        alias /usr/share/nginx/html/client/build/;
        index index.html index.htm;
        try_files $uri /index.html =404;
    }

我什至不确定这与nginx有关，可能是因为管理员的index.js中的这段代码吗？

const PrivateRoute = ({ component: Component, ...rest }) => (
    <Route {...rest} render={(props) => (
        AuthService.isLoggedIn() === true
            ? <Component {...props} />
            : <Redirect to={{
                pathname: '/',
                state: { from: props.location }
            }} />
    )} />
);

ReactDOM.render(
    <SnackbarProvider>
        <UserProvider>
            <Router history={hist} basename="/admin">
                <Switch>
                        [..]
                </Switch>
            </Router>
        </UserProvider>
    </SnackbarProvider>,
    document.getElementById("root")
);

indexRoutes 中的路由如下所示：

{ 
        path: "/",
        component: Login, 
        exact: true
},
{
    path: "/dashboard",
    sidebarName: "Accueil",
    navbarName: "Accueil",
    icon: Dashboard,
    component: DashboardPage,
    permissions: Permissions.Dashboard.value
}
...

我怀疑这可能是因为https://example.com/project/ 200 如果您来自管理仪表板，但如果您只是粘贴 url，则为 404（在“/”或客户端端点上）。

任何帮助将不胜感激。

Answer 1

没关系，我想通了，确实不是 nginx 的错， react 路由器是 'react-router-dom' 的默认路由器，我将其更改为 BrowserRouter。 所以

import {
    Router,
    Route,
    Switch
} from 'react-router-dom'

到

import {
    BrowserRouter as Router,
    Route,
    Switch
} from 'react-router-dom'