Django静态图片404问题：如何修改URL或模型显示图片？

方法一：使用Django媒体文件系统（推荐） #

这是Django处理用户上传文件的标准方案，能从根源解决路径拼接问题：

1. 配置settings.py
   打开项目的settings.py，添加媒体文件相关配置：

import os
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))

# 媒体文件根目录和访问URL
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'

2. 修改models.py的存储路径
   去掉upload_to里的photo/static/前缀，让文件自动存到media目录的子文件夹中：

class SubImage(models.Model):
    image = models.ForeignKey('Image', on_delete=models.SET_NULL, null=True)
    file = models.ImageField(upload_to='subImages/', max_length=1000, null=True)

class Image(models.Model):
    title = models.CharField(max_length = 100)
    file = models.ImageField(upload_to='images/', max_length=1000, null=True)

修改后，子图片会存在media/subImages/，主图片存在media/images/，更符合Django的文件管理规范。

3. 在urls.py中添加媒体文件路由
   让Django能正确映射媒体文件的访问路径：

from django.conf import settings
from django.conf.urls.static import static
from django.conf.urls import url
from . import views

urlpatterns = [
    url(r'^works/(?P<param1>\d+)/$', views.specsView, name='specsView'),
    # 其他已有的路由...
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

4. 调整模板中的图片引用
   在works.html里，使用ImageField自带的url属性获取正确的绝对路径：

<img src="{{ subImage.file.url }}">

这个属性会自动生成类似/media/subImages/blah.jpg的完整URL，浏览器会直接请求正确的地址，不会带上works/29/的前缀。

方法二：若坚持使用static目录（不推荐） #

如果必须把图片放在static目录下，可以这样调整：

1. 确认settings.py的静态文件配置

STATIC_URL = '/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'photo', 'static'),
]

2. 修改模板的引用方式
   先在works.html开头加载static标签：

{% load static %}

然后用static标签生成绝对路径：

<img src="{% static subImage.file.name %}">

这会把文件的相对路径转换成/static/subImages/blah.jpg，避免和当前页面URL拼接出错。

问题根源 #

你之前直接用{{subImage.file}}输出的是文件的相对存储路径，而当前页面URL是/works/29/，浏览器会自动把相对路径拼接到当前URL后，形成错误的请求地址/works/29/photo/static/subImages/blah.jpg，自然返回404。

内容的提问来源于stack exchange，提问作者Mohammad Amin Eskandari