Question

我正在使用BrowserRouter和带有参数[xyz /：id]的路由，如下所示。在本地主机中，这很好，但是当我在生产环境中部署页面时，无法打开xyz /：id。请帮助解决。我不想使用HashRouter，因为哈希具有与生产中的安全性相关的问题。

代码段：

Index.js

 <Router basename="/my-app">
    <App />
  </Router>,

App.js

<Switch>
          <Route exact={true} path="/" component={Home} />
          <Route exact={true} path="/xyz/:id" component={MyPage} />
          <Route component={Invalid} />
        </Switch>

Answer 1

您需要将所有请求路由到index.html文件。例如，如果要将应用程序部署到Apache Web服务器，则可以将.htaccess文件添加到网站的根目录，并在其中写入以下代码行。

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /index.html [L,QSA]

反应中带有参数的路线

1 个答案: