Django、React、Redux：提供图像答案

【问题标题】：Django, React, Redux: Serving up imagesDjango、React、Redux：提供图像
【发布时间】：2017-11-10 17:32:58
【问题描述】：

我正在为一个小项目使用 React/Redux 前端和 Django 后端。除了标准的 Django 服务器进行开发，我没有使用任何东西。我正在尝试将图像字段添加到已经存在的 UserProfile 模型。目前，除了 Django 无法将我的图像正确地提供给 React 主站点或管理站点之外，我已经完成了所有工作。当我尝试导航到有问题的 url 或使用 Python 请求库直接请求媒体时，响应的类型为“text/html”。目前我的模型有以下字段：

models.py

class UserProfile(models.Model):
    ...
    ...
    profile_image = models.ImageField(upload_to='path_to_media')

项目 urls.py

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^api/account/', include('account.urls')),
    url(r'^api/post/', include('post.urls')),
    url(r'.*', views.root, name='root')
]

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

settings.py

STATIC_ROOT = os.path.join(os.path.dirname(BASE_DIR), 'static_cdn')
STATIC_URL = '/static/'

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'nattr'),
)

帐户 urls.py

urlpatterns = (
    ...,
    url(r'^edit_profile/(?P<user_id>[^/]+)/$',
       views.edit_profile,
      name='edit_profile'),
)

帐户views.py

def edit_profile(request, user_id):
    try:
        user = User.objects.get(pk=user_id)
         form = UserProfileForm(request.POST, request.FILES, instance=user.profile, user=request.user)
        valid = form.is_valid()
        if valid:
            profile = form.save()
            return JsonResponse(profile.to_user())
        else:
            return JsonResponse({'errors': form.errors}, status=400)
    except User.DoesNotExist:
        return JsonResponse({'errors': 'cannot find user with that id'}, status=400)

我做错了什么？我已经分配了我的media_url & media_root;我已将媒体网址添加到我的urlpatterns。我的视图和表单非常标准，我可以看到图像正在上传到文件夹结构中

【问题讨论】：

我认为您应该将media_url 放在.* 上方的urlpatterns 列表中。否则即使是你的图片也会被.*捕获。
@kichik 天才！谢谢你;让它成为一个答案，我会接受它

标签： django reactjs

【解决方案1】：

Django URL 模式是按顺序处理的。你在settings.MEDIA_URL 之前有.*，所以每个URL，无论如何，都会被它捕获。您应该将静态 URL 移到 .* 上方。

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^api/account/', include('account.urls')),
    url(r'^api/post/', include('post.urls')),
]

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

# make sure this is always last
urlpatterns += [url(r'.*', views.root, name='root')]

【讨论】：

【解决方案2】：

在您的urlpatterns 中添加以下内容

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

并将其添加到您的settings.py

ENV_PATH = os.path.abspath(os.path.dirname(__file__))
MEDIA_ROOT = os.path.join(ENV_PATH, 'media/')

MEDIA_URL = '/media/'

【讨论】：