单击 Django 中 get api 中的图像 url 时出现页面未找到错误

Question

我有一个使用 Django Rest Framework 构建的简单 get api。它从模型菜单中获取所有食物。它由图像字段组成。 api 响应成功，我在图像字段中获取了图像 URL，但是当我单击该 url 时，该图像不会显示在新选项卡中。我已经完成了几个项目，据我记得，它应该在新选项卡上显示图像。因此，图像不会显示在前端中，这是在 Reactjs 中完成的。 后端目前在 Heroku 中提供。

网址类似如下：

https://example.herokuapp.com/api/menus

本地api响应如下：

当我点击图像和image_url时，它显示以下内容：

我添加 image_url 只是为了看看它是否有效，但它也不起作用。

我的型号：

class Menus(models.Model):
    category = models.CharField(max_length=50,choices=CATEGORY,default='main courses')
    food_name = models.CharField(max_length=100,blank=True, null=True)
    image = models.ImageField(upload_to='media/pictures',null=True)
    rating = models.FloatField(blank=True, null=True)
    description = RichTextField(blank=True, null=True)
    price = models.FloatField(blank=True, null=True)

我的序列化器：

class MenusSerializer(serializers.ModelSerializer):
    image_url = serializers.SerializerMethodField('get_image_url')    

    def get_image_url(self, obj):
        request = self.context.get('request')
        image_url = obj.image.url
        return request.build_absolute_uri(image_url)



    class Meta:
        model = Menus
        fields = ['category','image', 'image_url','food_name',
                  'description','price','rating']

我的设置：

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles/')
STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'
django_heroku.settings(locals())

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

我的项目网址：

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

注意：它不适用于本地和实时 api（在 Heroku 上）。

更新：

文件夹如下所示：

Answer 1

您需要做的改变是：

设置.py

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

模型.py

class Menus(models.Model):
    ...
    image = models.ImageField(upload_to='pictures',null=True)
    ...

设置upload_to会检查MEDIA_ROOT之后的位置。 检查此处的文档，了解 FileField 或

ImageField

的

存储

。

在模型中使用 FileField 或 ImageField（见下文）需要花费一些时间 步骤：

1.) 在您的设置文件中，您需要将 MEDIA_ROOT 定义为完整的 您希望 Django 存储上传文件的目录的路径。 （出于性能考虑，这些文件不存储在数据库中。）定义 MEDIA_URL 作为该目录的基本公共 URL。确保 该目录可由 Web 服务器的用户帐户写入。

2.) 将 FileField 或 ImageField 添加到模型中，定义 upload_to 选项 指定用于上传文件的 MEDIA_ROOT 子目录。

3.）将存储在数据库中的所有内容都是文件的路径（相对 到 MEDIA_ROOT）。您很可能想使用方便的网址 Django 提供的属性。例如，如果您的 ImageField 是 称为 mug_shot，您可以在 a 中获取图像的绝对路径 带有 {{ object.mug_shot.url }} 的模板。