小编典典

react-router在生产和浪涌部署中不起作用

reactjs

我的react应用程序在localhost上运行良好,但是当我将其部署到gh-pages中或激增后,它并不能使我使用URL在页面之间移动。

用户可以通过单击右上角的menuItem进入注册页面。但如果用户使用http://chat.susi.ai/signup/
URL,则会显示404页

我尝试了几种来自Internet的解决方案,但是没有用。

下一个问题是:我创建了一个404页面以在用户尝试移动到断开的链接时显示。在localhost中可以正常工作。但不在生产中。我尝试了解决方案,但没有任何改变。

这是我的index.js文件的一部分

const App = () => (
    <Router history={hashHistory}>
        <MuiThemeProvider>
            <Switch>
                <Route exact path="/" component={ChatApp} />
                <Route exact path="/signup" component={SignUp} />
                <Route exact path="/logout" component={Logout} />
                <Route exact path="/forgotpwd" component={ForgotPassword} />
                <Route exact path="*" component={NotFound} />

            </Switch>
        </MuiThemeProvider>
    </Router>
);

ReactDOM.render(
    <App />,
    document.getElementById('root')
);

如果有人可以为我的问题提供带有示例代码的好的解决方案,那对我真的很有帮助。


阅读 293

收藏
2020-07-22

共1个答案

小编典典

之所以发生这种情况,是因为没有向用户提供服务,index.html而当用户直接访问这些URL时会引导您的应用程序。

为了增加流量,您可以添加一个200.html文件文件包含与index.html您正在部署文件相同的内容(或只是将其重命名为200.html)-然后,该文件将以用户访问的任何网址(与静态文件都不对应)提供给用户您的应用开始运行。


编辑:看起来您正在使用create-react-app。当您在本地进行开发时,此方法有效,因为create-react-appreact- scripts软件包将您index.html作为这些请求的后备。

react-scripts用户指南对部分如何部署到GitHub的页数时处理这种surge.sh(如上)。

2020-07-22