代码之家 › 专栏 › 技术社区 › devmrh

django rest和angular nginx加载静态图像问题

static-files django-staticfiles django-rest-framework django

2

devmrh · 技术社区 · 7 年前

hi-im尝试用nginx加载我的角度应用程序,除了模板中的静态图像(保存在upload文件夹中的产品图像是可以的),其他一切都正常。这是setting.py的相关代码:

MEDIA_URL = '/upload/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'upload')


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.9/howto/static-files/

PROJECT_ROOT = os.path.dirname(os.path.dirname((__file__)))
STATIC_ROOT = os.path.join(PROJECT_ROOT, 'staticfiles')
STATIC_URL = '/static/'

# Extra places for collectstatic to find static files.
STATICFILES_DIRS = (
    os.path.join(PROJECT_ROOT, 'static'),
)

# Simplified static file serving.
# https://warehouse.python.org/project/whitenoise/

STATICFILES_STORAGE = 'whitenoise.django.GzipManifestStaticFilesStorage'

这是我在/static/文件夹中的索引文件:

{% load static %}
<!DOCTYPE html>
<html lang="fa" id="persain">
<head>
    <meta charset="utf-8">
    <title>M4new</title>
    <base href="/">

    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/x-icon" href="favicon.ico">
    <link rel="stylesheet" href="{% static 'styles.4bdc8f4141f772a8814a.css' %}">
</head>
<body>
<app-root>Loading . . .</app-root>
<script type="text/javascript" src="{% static 'runtime.6afe30102d8fe7337431.js' %}"></script>
<script type="text/javascript" src="{% static 'polyfills.b0205464c9bd4e7fe3b3.js' %}"></script>
<script type="text/javascript" src="{% static 'scripts.59ed76cc23ba77b0ec72.js' %}"></script>
<script type="text/javascript" src="{% static 'main.159b545905e86c2df1d4.js' %}"></script>
</body>
</html>

我的静态目录是这样的:

我的结果是:

如您所见,图像无法加载,因为它们在url的开头丢失了静态关键字。

我试过了 Python manage.py collectstatic 我补充说

urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

到我的网址的末尾,但是没有改变…对这个问题有什么想法吗?谢谢

更多信息: nginx配置:

http {
    include       mime.types;
    default_type  application/octet-stream;

    #log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
    #                  '$status $body_bytes_sent "$http_referer" '
    #                  '"$http_user_agent" "$http_x_forwarded_for"';

    #access_log  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    gzip  on;

    server {
        listen       80;
        server_name  localhost;


      location = /favicon.ico { access_log off; log_not_found off; }
    location /static/ {
        root /home/mohammadreza/PycharmProjects/ac2/academy/academy;
    }

    location / {
        proxy_set_header Host $http_host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    add_header Access-Control-Allow-Origin *;
        add_header 'Access-Control-Allow-Credentials' 'true';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'Access-Control-Allow-Orgin,XMLHttpRequest,Accept,Authorization,Cache-Control,Content-Type,DNT,If-Modified-Since,Keep-Alive,Origin,User-Agent,X-Mx-ReqToken,X-Requested-With';
        proxy_pass http://unix:/home/mohammadreza/PycharmProjects/ac2/academy.sock;
    }

注:我在Gunicorn也有同样的问题。

1 回复 | 直到 7 年前

1

0

Mohammad Efazati 7 年前

你应该把你的网址改成 static 返回正确的url

urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT) + \
               static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

和改变 STATIC_ROOT 到 静止的

目前,您的项目错误地生成了url,应该将它们替换为/static.file to/static/static.file

有了以上的解决方案,我想你可以处理这个问题