I have a Django Restfull Application. And a user can upload images from the Admin panel of Django. But the problem I am facing is that in the corresponding api call. The id’s of the images are displayed instead of the url’s of the images. See the api call below-

imag

is the property:

    {
        "id": 30,
        "name": "Dier",
        "sort": "hghkjhkh",
        "uis": false,
        "cites": "B",
        "pet_list": "nvt",
        "description": "Wat een lekker dier",
        "feeding": "",
        "housing": "",
        "care": "",
        "literature": "",
        "images": "https://dier.blob.core.windows.net/media/media/photos/animals/amphibiance_X04Eh6N_1z0N4Gs_9EPmeMA_6j3axdY_da4cpTO_2VAY67x_hcUVB7f_bv9qvuY.jpg",
        "category": 11,
        "category_name": "mammal",
        "klasse_name": "mammal",
        "hdd_list_remark": "Wat een mooi dier",
        "bird_directive_list": "Bijlage|",
        "Habitat_directive_list": "Bijlage |V",
        "imag": [
            5,
            6
        ],
        
    },

So the corresponding code: model.py:

import sys
from io import BytesIO
from django.core.files.uploadedfile import InMemoryUploadedFile
from django.contrib.auth.models import Permission
from PIL import Image
from django.db import models
from django.conf import settings

class AnimalImage(models.Model):
    animal = models.ForeignKey(
        'Animal', related_name='imag', on_delete=models.CASCADE)
    image = models.ImageField(upload_to='media/photos/animals')

    def __str__(self):
        return f"Image for {self.animal.name}"

class Animal(models.Model):

    images = models.ImageField(
        upload_to="media/photos/animals",   blank=False, null=False, verbose_name="Foto")
    animal_images = models.ManyToManyField(
        AnimalImage, related_name='related_animals', blank=True)

    def img_preview(self):  # new
        return mark_safe(f'<img src = "{self.images.url}" width = "300"/>')
    img_preview.short_description = "Huidige Foto"

    def img_previews(self):
        images = self.images.all()
        return mark_safe(''.join([f'<img src="{img.image.url}" width="100"/>' for img in images]))
    img_previews.short_description = "Thumbnails"

    class Meta:
        verbose_name = "Dier"
        verbose_name_plural = "Dieren"
        # permissions = [("set_display_flag", "Check name is display or not",)]

        super(Animal, self).save()

    def __str__(self):
        return self.name

Serializers.py:

from .models import Animal, Category, AnimalImage
from rest_framework import serializers
from django.contrib.auth.decorators import permission_required


class AnimalImageSerializer(serializers.ModelSerializer):
    class Meta:
        model = AnimalImage
        fields = ['id', 'image']


 class Meta:
        model = AnimalImage
        fields = ['image_url']

        def get_image_url(self, obj):
            return obj.image.url

    @permission_required("can_view_animal")
    def get_animal(self, obj):
        return obj.get_animal_display()


class SubAnimalSerializer(serializers.ModelSerializer):
    category = serializers.SlugRelatedField(
        slug_field='name', queryset=Category.objects.all()
    )
    uis = serializers.SerializerMethodField(method_name='naming_bool')

    class Meta:
        model = Animal

        fields = ['images', "animal_images"]
        read_only_fields = ['id']

    def naming_bool(self, instance):
        if instance.uis == True:
            return "Ja"
        else:
            return "Nee"

Question: How to pass in the api call by the property: imag the url’s of the images instead of the id?