使用Django + react-router找不到404页面

Question

我正在尝试使用reactjs和react-router(1.x)与我的Django应用程序,但我很难将所有这些放在一起.这是github项目,因为我在这个问题中没有提供足够的信息.

https://github.com/liondancer/django-cherngloong

我path="about"在我的内心创造了一个routes.js

var routes = (
    <Router>
        <Route path="/" component={ Views.Layout }>
            <IndexRoute component={ Views.Index } />
            <Route path="about" component={ Views.About } />
        </Route>
        <Route path="*" component={ Views.RouteNotFound } />
    </Router>
);

export default routes;

我的 layout.js

class Layout extends React.Component {
    constructor(props) {
        super(props);
    }
    render() {
        return (
            <div id="review-web">
                <header className="header">
                    <LogoElement />
                    <CenterPiece />
                </header>
                <div>
                    { React.cloneElement(this.props.children, { path: this.props.path }) }
                </div>
                <Footer />
            </div>
        );
    }
}

export default Layout;

当我进入时,localhost.8000/about我得到一个404Django错误

我的目标是保持前端和后端分离,所以我相信我应该能够将Django用作数据的端点而不是渲染视图.

Answer 1

我遇到了同样的问题,最终得到了这个解决方案.

settings.py:

REACT_ROUTES = [
    'login',
    'signup',
    'password-reset',
    'password-change',
    'about',
    ...
]

urls.py:

routes = getattr(settings, 'REACT_ROUTES', [])
urlpatterns = [
    ...
    url(r'^(%s)?$' % '|'.join(routes), TemplateView.as_view(template_name='index.html')),
]

我不喜欢在django设置中复制所有react-routes,但是如果我们把所有内容放在那里url(r'^.*$'),服务器将始终返回HTTP status_code 200.这只是一种能够为不存在的URL返回有效HTTP status_code 404的方法.

Answer 2

我的应用程序为所有有效路由提供相同的客户端 JS。请原谅 Flask 代码。

@blueprint.route('/stuff/<path:path>', methods=["get"])
@blueprint.route('/', methods=["get"])
def index(path=None):
    return render_template('app.html')