我试图在我的项目中分离我的前端和后端。我的前端由 reactjs 组成，路由将使用 react-router 完成，我的后端由 Django 组成，我打算使用前端对 Django 进行 API (ajax) 调用。
现在我不确定如何让这两个端正确地相互交谈。
这是 link到我的项目
这是我的项目结构:
/cherngloong
/app (frontend)
/cherngloong
/templates
index.jtml
urls.py
settings.py
...
/contact
urls.py
views.py
我使用 webpack 构建我所有的 JS 和 CSS 并将其放入 index.html 和 webpack_loader 中，如下所示:
{% load render_bundle from webpack_loader %}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Example</title>
</head>
<body>
<div id="app"></div>
{% render_bundle 'main' %}
</body>
</html>
在 Django 中，这是我的 cherngloong/urls.py:
urlpatterns = [
url(r'^admin/', include(admin.site.urls)),
url(r'', TemplateView.as_view(template_name='index.html')),
url(r'^api/', include('contact.urls'))
]
urlpatterns += staticfiles_urlpatterns()
我不想从 django 提供我的应用程序或让 django 在任何 url 上提供相同的 View 。
这是我的 react-router 路由:
var routes = (
<Router>
<Route path="/" component={ Views.Layout } >
<Route path="contact" component={ Views.Contact }/>
</Route>
<Route path="*" component={ Views.RouteNotFound } />
</Router>
);
export default routes;
我目前可以运行服务器，但是当我运行前端部分时，我会在开发人员工具中看到它
http://localhost:8000/static/public/js/main.js Failed to load resource: the server responded with a status of 404 (NOT FOUND)
最佳答案
您的 settings.py 定义了以下内容:
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'app'),
)
这将提供 /app/ 目录中的文件。所以 url /static/public/js/ 转换为 /app/public/js/ 目录。
您想要的是提供 /public/ 目录中的文件。使用以下设置:
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'public'),
)
WEBPACK_LOADER = {
'DEFAULT': {
'BUNDLE_DIR_NAME': 'js/',
'STATS_FILE': os.path.join(BASE_DIR, 'webpack-stats.json')
}
}
此外，您在此处发布的代码与在 github 中发布的代码中的 url 不同。 url(r'', Templa... 将匹配所有 url 并仅呈现 index.html，即使在调用 /api/ 时也是如此. 把这一行移到底部:
urlpatterns = [
url(r'^admin/', include(admin.site.urls)),
url(r'^api/', include('contact.urls')),
]
urlpatterns += staticfiles_urlpatterns()
urlpatterns += [
url(r'', TemplateView.as_view(template_name='index.html')),
]
关于python - 使用 Django、webpack、reactjs、react-router 解耦前后端，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33271923/