javascript - 部署reactJS应用程序 - 生产模式下的路由问题

Question

在生产模式下部署后，我遇到了一些路由问题。(我的应用程序在 aws S3 Bucket 上运行)一切正常，只是路由存在一些问题。

匹配未知的路由是问题所在。我有以下路由:

import {BrowserRouter as Router, hashHistory, Switch, NavLink, Route} from "react-router-dom";

<Provider store={store}>
    <AppContainer>
        <Router history={createHistory}>
            <div>
                <ThemeProvider theme={theme}>
                    <div className={i.content}>
                        {/*Switch is for Error Routing*/}
                        <Switch>
                            <Route exact path="/" component={() => (<Logins foo={"test"} loginHandler={this.props.loginHandler}/>)}/>
                            <Route path="/logout" component={() => (<Logins foo={"test"} loginHandler={this.loginHandler}/>)}/>
                            <Route path="/signup" component={() => (<SignUp loginHandler={this.loginHandler}/>)}/>
                            <Route path="/imprint" component={() => (<Impressum/>)}/>
                            <Route path="/verification/:verificationToken/:verificationEmail" component={() => (<Verification/>)}/>
                            <Route component={() => (<Error/>)}/>
                        </Switch>
                        <div className={i.footer}>
                            <a href="https://johner-institut.de" target="_blank">{t('application:made')} <img src={jilogo} width="8px;"/>
                            </a> | <NavLink to="/imprint">{t('application:imprint')}</NavLink> | <LanguageChooserSmall/>
                        </div>
                    </div>
                </ThemeProvider>
            </div>
        </Router>
    </AppContainer>
</Provider>

已知路线运行良好。但在错误情况下，交换机应影响所有未知路由，应重定向到 <Route component={() => (<Error/>)} />但这不起作用...

可能是什么问题？

Answer 1

尝试在 cloudfront 的自定义错误响应设置中将响应页面路径设置为index.html。