Question

很抱歉，这个问题没有被回答，但是到目前为止，在我的特定情况下，其他解决方案似乎仍未能解决我的问题。我有一个django-vue项目，该项目使用GraphQL在vue和django之间进行通信。

我正在尝试使用uwsgi和NGINX为我的Web应用程序提供服务，并且Django部分可以正常工作，但是在查找Vue / dist /静态文件时似乎存在一些问题，例如得到http://ip.ip.ip.ip:8000/js/app.js ERR_ABORTED 404，应用程序和大块供应商的CSS也是如此。

不幸的是，这是我的第一个部署，因此我的理解还很不稳定，但是很明显NGINX不能正确理解dist文件夹的路径，但是到目前为止我尝试过的变体都没有成功它可以正常工作。

mysite_nginx.conf：

# hubdev_nginx.conf

# the upstream component nginx needs to connect to
upstream django {
    server unix:///srv/hub/hub.sock;
#   server 127.0.0.1:8001;
}

# configuration for the server
server {
    # the port your site will be served on
    listen 8000;
    # the domain name it will serve for
    server_name ip.ip.ip.ip;
    charset utf-8

    root    /srv/hub/frontend/dist/;
    index   index.html;

    # max upload size
    client_max_body_size    75M;    # 'Adjust to taste'

    # Django media
    # none yet

    # Django static - I've tried both of these
    location /static {
    alias /srv/hub/staticfiles;
#   alias /srv/hub/frontend/dist;
    }

    # send all non-media requests to the Django server
    location / {
        uwsgi_pass  django;
        include     /srv/hub/uwsgi_params;
    }
}

我看过的这个问题似乎很相似：Serving Django and Vue with Nginx

但是其中一个答案的这一部分在如何将两个路径组合到一个方面没有多大意义。

location /static {
        autoindex on;
        alias *path to you static files both django static files and vue related static files*;
    }

urls.py中的

urlpatterns

url(r'^static/(?P<path>.*)$', serve,
        {'document_root': settings.STATIC_ROOT}),
    url(r'^dmedia/(?P<path>.*)$', serve,
        {'document_root': settings.MEDIA_ROOT}),

    url(r'^media/(?P<path>.*)$', serve,
        {'document_root': os.path.join(settings.VUE_ROOT, 'media')}),
    url(r'^img/(?P<path>.*)$', serve,
        {'document_root': os.path.join(settings.VUE_ROOT, 'img')}),
    url(r'^js/(?P<path>.*)$', serve,
        {'document_root': os.path.join(settings.VUE_ROOT, 'js')}),
    url(r'^css/(?P<path>.*)$', serve,
        {'document_root': os.path.join(settings.VUE_ROOT, 'css')}),
    url(r'^fonts/(?P<path>.*)$', serve,
        {'document_root': os.path.join(settings.VUE_ROOT, 'fonts')}),
    url(r'^graphql', csrf_exempt(GraphQLView.as_view(graphiql=True))),

在prod设置中将VUE_ROOT定义为“ \ frontend \ dist”-在我的Windows开发环境中可以正常工作。

非常感谢您的帮助。

Answer 1

答案似乎是为NGINX无法加载的每个资源创建单独的位置。就我而言，它是在添加：

location /dist {
    alias /srv/hub/frontend/dist;
    autoindex    on;
    }

然后在获取Vue应用程序中使用的img文件时出现错误。

因此：

location /img {
    alias    /srv/hub/frontend/dist/img;
}

我高度怀疑这是最佳的最佳实践，但它现在可以正常工作，很高兴我可以继续...

在NGINX上部署Vue-Django-graphene

1 个答案: