uwsgi静态文件加载错误表单django(react和webpack)
Posted
技术标签:
【中文标题】uwsgi静态文件加载错误表单django(react和webpack)【英文标题】:uwsgi static files loading error form django (react and webpack) 【发布时间】:2021-05-19 12:27:24 【问题描述】:我的应用由 django 和 react 组成,最后捆绑到静态 (.js) 文件中。 我的目标是为其设置一个 nginx,但现在我只想在 uwsgi 中运行以查看它是否有效。 Aaaaand 它根本不起作用。我相信加载这个 webpack 正在编译的捆绑文件存在问题。
与 uwsgi 的连接正常,服务器已启动并正在运行,但是当连接到 127.0.0.1:8080 时,我得到(在 Mozilla 中):
The resource from “http://127.0.0.1:8080/static/frontend/main.js”
was blocked due to MIME type (“text/html”) mismatch
(X-Content-Type-Options: nosniff).
# and another
GET http://127.0.0.1:8080/static/frontend/main.js
HTTP/1.1 404 Not Found
Content-Type: text/html
X-Frame-Options: DENY
Content-Length: 3277
X-Content-Type-Options: nosniff
Referrer-Policy: same-origin
Vary: Origin
我找到了类似的话题:Difference between static STATIC_URL and STATIC_ROOT on Django
还有这个:Django + React The resource was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff)
但与python manage.py collectstatic
搞混并没有解决任何问题。
我有这行代码来管理静态文件:
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join('/app/label_it/front/static/frontend/')
这就是我开始 uwsgi 连接的方式:
python manage.py collectstatic --no-input
uwsgi --http 0.0.0.0:8080 --master --enable-threads --module label_it.wsgi
除了collectstatic
,我还尝试过使用<script src"static_file_path"></script>
这个静态路径:
<script src="../../static/frontend/main.js"></script>
# and
<script src="% static "frontend/main.js" %"></script>
什么都没有。
感谢任何线索!
编辑:
我的文件结构:
【问题讨论】:
你能附上你的 django 项目文件结构的截图吗?我想看看 react 前端文件相对于 django 应用程序的存储位置 @Danoram 已更新。在/front/static/frontend
dir 中是捆绑的静态文件
【参考方案1】:
好的,我刚刚对自己的服务器和 django 项目进行了一些测试以确认我的怀疑,我得出以下结论:如果静态文件的路径不存在,则会发生此错误。这意味着 uwsgi 无法使用您的设置找到这个 main.js
文件。
我的建议是执行以下操作,以确保您的静态文件以 django 知道在哪里查找的方式正确提供。
默认情况下,django 在每个已安装的应用程序中搜索 static
文件夹以查找静态资源。因为您的项目不是这样设置的,所以您必须指定静态文件所在的其他目录。
这就是STATICFILES_DIRS
的用途。
在您的settings.py
中输入以下内容
STATICFILES_DIRS = [
BASE_DIR / 'label_it/front/static'
]
这将使label_it/front/static
中的所有文件都可以被 django 发现。
这意味着
<script src="% static "frontend/main.js" %"></script>
将(希望)工作。
此外,如果您还没有在urls.py
文件中包含您的静态网址,请记住。
urls.py
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns = [
...
]
# static content urls
urlpatterns += staticfiles_urlpatterns()
旁注:STATIC_ROOT
旨在成为运行python manage.py collectstatic
时所有静态文件将被收集到的位置。
因此它应该是一个空目录,最好是在您的 django 项目的根目录中。
STATIC_ROOT = os.path.join(BASE_DIR, 'static_collected')
文件夹的名称并不重要,我以static_collected
为例。
如果您希望运行该命令,您会看到label_it/front/static/
中的所有文件都复制到那里。
【讨论】:
是的,你是对的。通过一些艰苦的调试,我确实设法解决了这个问题,并将--static-map
设置为 uwsgi cmd 标志。
处理完这个问题后,更有趣的事情发生了。我的页面加载为空白,即使页面的 http 请求是 200 OK
并收到正确的 html。如果您愿意提供帮助,这是我的问题:***.com/questions/66247510/…以上是关于uwsgi静态文件加载错误表单django(react和webpack)的主要内容,如果未能解决你的问题,请参考以下文章
Django,即使在 collectstatic 之后也没有提供 uwsgi 静态文件