Python 如何让django服务于非静态js文件？_Python_Django_Reactjs_Webpack_Create React App

Python 如何让django服务于非静态js文件？

python django reactjs webpack

Python 如何让django服务于非静态js文件？,python,django,reactjs,webpack,create-react-app,Python,Django,Reactjs,Webpack,Create React App,我的python后端服务器作为静态文件提供react应用程序。在react中，当我们构建应用程序时，src目录中的所有内容都被捆绑在一起，但是，在src之外的公共目录中有一个javascript文件，我把它放在那里，因为我希望在构建之后不被触及。之所以这样做，是因为在src代码中，我创建了worker，要创建worker，我们必须指定worker文件的url。该文件名为worker.js，在构建后它保持不变，但在部署后端后，前端无法访问/worker.js url，因为django显然只服务于

我的python后端服务器作为静态文件提供react应用程序。

在react中，当我们构建应用程序时，src目录中的所有内容都被捆绑在一起，但是，在src之外的公共目录中有一个javascript文件，我把它放在那里，因为我希望在构建之后不被触及。之所以这样做，是因为在src代码中，我创建了worker，要创建worker，我们必须指定worker文件的url。该文件名为worker.js，在构建后它保持不变，但在部署后端后，前端无法访问/worker.js url，因为django显然只服务于静态文件，因此无法识别/worker.js，而是返回index.html。如何才能访问此非静态js文件？

静态文件工作原理说明：

发展让我们首先在开发环境中使用它（django使用runserver为您的静态文件提供服务）。在这种情况下，静态根不相关

Django可以从以下位置找到所有静态文件：

应用程序中的任何/static/文件夹，例如，如果您有
```
博客
```
应用程序，则将解析文件夹
```
/blog/static/
```
在
```
STATICFILES\u DIRS
```
中指定的任何文件夹，例如，如果主项目中有一个
```
assets
```
文件夹，则可以使用
```
os.path.join（BASE\u DIR，“assets”）
```
将其添加到
```
STATICFILES\u DIRS
```
中，其中
```
BASE\u DIR
```
是manage.py的位置

如果

博客

应用程序和您的资产目录都需要一个“logo.png”怎么办？不要担心图像、js文件、css文件具有唯一的名称，而是使用名称空间。在

blog

应用程序中，将所有静态文件放入

/blog/static/blog/

中，因此在使用它们时，您需要参考

/blog/logo.png

，您肯定知道它将是正确的logo.png。在主项目内部，将文件放入

资产/assets

（或者称之为

静态/assets

），以便您可以参考

/assets/logo.png

，了解项目的主要资产

现在，如果您设置了

STATIC\u URL=“/STATIC/”

，这将告诉django所有静态文件URL的前缀都是“/STATIC/”，即可以使用“/STATIC/assets/logo.png”和“/STATIC/blog/logo.png”检索上面的徽标。这是必需的，因为它允许区分静态文件的url和Django路由到视图的url

实际上，在模板中，您将使用

{%static'blog/logo.png%}

这样就不必到处硬编码

静态URL

现在进入网页。它需要将其软件包资产放在上述任何目录中，或者放在自己的目录中，您**也可以将其添加到

STATICFILES\u DIRS

。让我们假设后者：我们的项目中还有一个

/webpack/webpack/

文件夹，它在

STATICFILES\u DIRS

中定义，因此所有网页包资产都将通过url前缀“/static/webpack/”访问

worker.js文件应该在“assets/assets”中，并且在其他脚本中，如果您通过url引用它（通过HTTP请求获取它），那么您应该通过“/static/assets/worker.js”或使用相对url“./assets/worker.js”来引用它

生产部署后，不再使用Django提供静态文件，而是使用Web服务器，例如Apache或nginx。您可以将web服务器配置为识别以

STATIC\u URL

（“/STATIC/”）开头的任何请求，并从

STATIC\u ROOT

获取相应的文件

因此，首先要做的是将django应用程序的所有静态文件复制到web服务器可以访问的文件夹/位置。该位置在项目文件夹之外

设置

STATIC\u ROOT=os.path.abspath（os.path.join（os.path.dirname（os.path.dirname（BASE_DIR）），'STATIC'））

，将其指向项目父文件夹中的“STATIC”目录

然后运行

python manage.py

这将把所有静态文件复制到项目外部的新静态文件夹中。您将看到：

path/to/dir/
   |_ static/
   |   |_ blog/
   |   |   |_ logo.png
   |   |_ assets/
   |   |   |_ logo.png
   |   |   |_ worker.js
   |   |_ webpack/
   |       |_ some_file.js
   |_ django_project/
       |_ manage.py
       |_ main_app/
       |    |_ settings.py
       |_ assets/
       |    |_ assets/
       |        |_ worker.js
       |_ blog/
       |   |_ static/
       |       |_ blog/
       ...

现在，当web服务器看到url“/static/assets/worker.js”时，它将返回“path/to/dir/static/assets/worker.js”中的文件

如果您让生产服务器生成webpack文件，而不是将其提交到源代码（即它们不在“django_项目”中），那么您应该将webpack配置为将它们放在正确的位置“path/to/dir/static/webpack/”，因为您的web服务器将在那里查找它们

想象一下，现在您将所有内容都转移到第三方存储提供商。然后，您只需做两件事：

安装并配置该存储提供程序的存储后端，以便Django知道如何在那里读/写文件（使用
```
collecstatic
```
）。这可能包括设置
```
STATIC\u ROOT
```
，例如
```
STATIC\u ROOT=https://my-bucket.my-storage-provider.com/static
```
将
```
STATIC\u URL
```
设置为存储提供程序的URL，例如
```
STATIC\u URL=https://my-bucket.some_cdn.com/
```
。在这里，我们指向CDN，您已将其配置为知道从何处获取文件

仅此而已，一切都在继续工作。

静态文件工作原理说明：

发展让我们首先在开发环境中使用它（django使用runserver为您的静态文件提供服务）。在这种情况下，静态根不相关

Django可以从以下位置找到所有静态文件：

应用程序中的任何/static/文件夹，例如，如果您有
```
博客
```
应用程序，则将解析文件夹
```
/blog/static/
```

在

STATICFILES\u DIRS

中指定的任何文件夹，例如，如果主项目中有一个

assets

文件夹，则可以使用

os.path.jo将其添加到STATICFILES\u DIRS