Django + React:如何连接它们进行部署?

IT技术 django reactjs production
2021-05-23 23:04:05

我正在运行一个带有Django+DRF, CELERY+REDIS, ReactJs+REDUX&的应用程序JWT我很难连接backendfrontend部署。

我曾经用来create-react-app生成 React 代码;npm run build生成生产版本。

我一直在环顾四周,但找不到有关如何将它们链接在一起的教程。

如果你们口袋里有任何我可以关注的链接,我会感谢你们。

2个回答

正如您在评论中提到的,这个解决方案对我来说似乎是合理的。

部署单独的 React Frontend 和 Django DRF API

据我了解,在您的情况下,您可以在随机端口上启动 Django+DRF 的 DEV 版本,例如 localhost:5000/。然后你可以在另一个端口上的 create-react-app 上启动 DEV 服务器,比如 localhost:8080/。出于测试目的,您可以使用 React 应用程序中的 DRF url 检查前端和后端之间的连接。

之后,您可以构建您的 React 应用程序并将 bundle.js 作为标准 js 文件添加到 Django 项目中的 index.html 中。在 django 中创建 'home' url 并将其与简单的模板连接,例如您在 React 应用程序的 index.html 中使用的模板。

您的 bundle.js 将包含所有必要的库。但是对于服务器上的生产版本,您将需要再次为具有实际域的实际 url 构建您的应用程序。

希望能帮助到你。

你不需要将你的 React 文件“移到”Django。只需分别为它们服务。

这就是我为我的项目提供服务的方式:

在此处输入图片说明

我从/api/url提供我的 API ,所以这里是我的 Nginx 配置的粗略表示:

server {

    # urls that start with /api or /admin
    location ~ ^/(api|admin) {
        # pass them to uwsgi or gunicorn
        ...
    }

    # urls that start with /media
    location /media  {
        # serve from your project's media folder
        ...
    }

    # urls that start with /static/admin 
    location /static/admin {
        # these requests are made to admin's static files
        # serve them from your staticroot folder
        # i.e. where your files are stored after you run `collectstatic`
        ...
    }

    # everything else
    location / {
        # serve from frontend build folder
        root   /path/to/the/build/folder;
        index  index.html;
        # this is important
        # first try to find files matching url, like css, or js, or favicon
        # if nothing found, serve the index.html            
        try_files $uri /index.html; 
    }
}