如何在Wagtail API v2中按页面关联集合筛选图片？

方案一：修复Pages端点返回集合图片的问题 #

核心问题并非Collection是MP_Node，而是Wagtail的Image与Collection的反向关联默认命名为image_set（Django ForeignKey反向关联的默认规则），且ModelSerializer不会自动包含反向关联字段，需显式处理，同时要注意预取数据避免N+1查询问题。

修正代码示例： #

1. 调整CollectionSerializer，显式处理图片反向关联：

from wagtail.images.models import Image
from rest_framework import serializers

class CollectionSerializer(serializers.ModelSerializer):
    # 方式1：用SerializerMethodField主动查询当前集合下的图片
    images = serializers.SerializerMethodField()
    
    def get_images(self, obj):
        images = Image.objects.filter(collection=obj)
        return ImageSerializer(images, many=True).data
    
    # 方式2：直接指定反向关联源（默认是image_set）
    # images = ImageSerializer(source='image_set', read_only=True, many=True)

    class Meta:
        model = Collection
        fields = ["id", "name", "images"]

2. 在页面模型中添加API字段时，预取关联数据优化性能：

from django.db.models import Prefetch
from wagtail.api import APIField
from wagtail.models import Page

class PageWithManyPhotos(Page):
    collection = models.ForeignKey("wagtailcore.Collection", on_delete=models.SET_NULL, null=True, blank=True)
    
    api_fields = [
        APIField(
            "collection", 
            serializer=CollectionSerializer(),
            # 预取集合及关联图片，避免多次数据库查询
            queryset=PageWithManyPhotos.objects.prefetch_related(
                Prefetch('collection__image_set', queryset=Image.objects.all())
            )
        )
    ]

此时请求/api/v2/pages/?type=base.GalleryPage&fields=collection，返回的collection对象中会包含images字段。

方案二：实现Images端点按Collection筛选 #

你已成功为Image序列化器添加了collection字段，但缺少筛选逻辑配置，需让API识别collection参数并过滤图片。

修正代码示例： #

from wagtail.api.v2.views import ImagesAPIViewSet
from wagtail.api.v2.serializers import BaseSerializer
from rest_framework import filters, serializers
from wagtail.images.models import Image

class CollectionField(serializers.Field):
    def get_attribute(self, instance):
        return instance

    def to_representation(self, image):
        return image.collection_id

class CustomImageSerializer(BaseSerializer):
    collection = CollectionField(read_only=True)

class CustomImagesAPIViewSet(ImagesAPIViewSet):
    meta_fields = ImagesAPIViewSet.meta_fields + ["collection"]
    base_serializer_class = CustomImageSerializer
    
    # 添加Django过滤器后端，允许按collection_id筛选
    filter_backends = ImagesAPIViewSet.filter_backends + [filters.DjangoFilterBackend]
    filterset_fields = ImagesAPIViewSet.filterset_fields + ["collection"]

api_router.register_endpoint("images", CustomImagesAPIViewSet)

现在可通过/api/v2/images/?collection=8这类请求，直接筛选出指定集合下的所有图片。

内容的提问来源于stack exchange，提问作者fekioh