文章/答案/技术大牛

发布

社区首页 >问答首页 >快速404页与反应性路由器重叠。

问快速404页与反应性路由器重叠。
EN

Stack Overflow用户

提问于 2016-10-28 20:16:26

回答 1查看 515关注 0票数 0

Hello

我有一个作为REST服务器运行的快递应用程序，这意味着所有的/api/xx路由都是在express中处理的。

我还有一个作为客户端的react应用程序(在访问/时由express提供服务)，它还有一个路由器，当我刷新一个react route时，会出现一个404页错误，而不是react页面本身。

反应路由器

<Router history={browserHistory}>
  <Route path="/" component={MainLayout} user={user}>
    <IndexRoute component={DocumentsPage}></IndexRoute>
      <Route path="about" component={AboutPage}></Route>
      <Route path=":id/preview" component={PreviewPage}/>
      <Route path="upload" component={UploadPage}></Route>
  </Route>
</Router>

当我用<Link to="upload" </Link>访问时，页面就会显示出来，当我刷新页面时，我得到了404快递的页面。

任何帮助都是很好的

express

reactjs

routes

react-router

回答 1

Stack Overflow用户

发布于 2016-10-28 20:24:42

您需要配置一个回退，这样在您的Express路由中不存在的每个请求都会被重定向到您在/的React应用程序。下面是一个关于如何使用Express实现此操作的基本示例：

import fallback from 'express-history-api-fallback';
import express from 'express';
import http from 'http';

// Set up express
const app = express();
const server = http.createServer(app);
const root = `${__dirname}`;

// History Fallback for express
app.use(express.static(root));
app.use(fallback('index.html', { root }));

// Listen
server.listen(8080, '0.0.0.0');

然后，您还可以使用React路由器处理404页面。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/40312629

复制

相似问题

问快速404页与反应性路由器重叠。
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问快速404页与反应性路由器重叠。EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问快速404页与反应性路由器重叠。
EN