Wagtail后台使用图片选择器上传HEIC图片时无法选择HEIC文件的问题

嗨，这个问题我之前也碰到过！你已经在后端配置里添加了HEIC/HEIF格式，但文件选择器里看不到这类文件，核心原因是前端的文件筛选规则没同步更新——Wagtail默认的图片选择器只预设了常见图片格式的MIME类型，HEIC和HEIF的类型不在其中，所以浏览器会自动过滤掉这些文件。

下面给你两个可行的解决方案，按需选择：

方案一：自定义单个图片选择器组件 #

如果只需要在特定页面/模型的图片字段上支持HEIC，可以自定义一个图片选择器Widget：

1. 先在你的项目里创建一个widgets.py文件，写入以下代码：

from wagtail.images.widgets import AdminImageChooser

class HEICAdminImageChooser(AdminImageChooser):
    def render(self, name, value, attrs=None, renderer=None):
        attrs = attrs or {}
        # 把HEIC和HEIF的MIME类型添加到accept属性里
        attrs['accept'] = 'image/png, image/jpeg, image/gif, image/heic, image/heif'
        return super().render(name, value, attrs, renderer)

2. 然后在你的页面模型里，使用这个自定义Widget替换默认的图片选择器：

from django.db import models
from wagtail.models import Page
from wagtail.images.models import Image
from wagtail.admin.panels import FieldPanel
from .widgets import HEICAdminImageChooser

class YourCustomPage(Page):
    banner_image = models.ForeignKey(
        Image,
        null=True,
        blank=True,
        on_delete=models.SET_NULL,
        related_name='+'
    )

    content_panels = Page.content_panels + [
        # 这里指定使用自定义的HEICAdminImageChooser
        FieldPanel('banner_image', widget=HEICAdminImageChooser),
    ]

方案二：全局修改所有图片选择器 #

如果想让整个后台的图片选择器都支持HEIC/HEIF，可以用Wagtail的钩子来全局配置：

在项目的wagtail_hooks.py文件里（如果没有就新建一个），添加以下代码：

from wagtail import hooks
from wagtail.images.widgets import AdminImageChooser

@hooks.register('construct_image_chooser_widget')
def add_heic_support_to_all_image_choosers(widget, context):
    # 更新全局图片选择器的accept属性
    widget.attrs['accept'] = 'image/png, image/jpeg, image/gif, image/heic, image/heif'

额外注意事项 #

别忘了安装处理HEIC图片的依赖库！Wagtail依赖Pillow处理图片，而默认Pillow不支持HEIC格式，需要安装pillow-heif扩展：

pip install pillow-heif

安装后，Wagtail才能正常生成HEIC图片的缩略图，避免上传后出现图片处理失败的问题。

备注：内容来源于stack exchange，提问作者Headmaster