使用nginx作为服务器，在HTML中添加avif图像

Question

我用heif-anc创建了一些图像

for i in card*.png ; do heif-enc "$i" -o "${i%.*}.avif" ; done

但是当我把它们添加到我的网站上时，它只是提议下载图片。

然后我用enabled avif images in my nginx-config和

http {
  types {
    image/avif avif;
  }
  ...

现在它试图显示图像，但它们似乎被打破了。如果您直接调用它，成功启用了avif支持的Firefox将显示以下错误消息：

无法显示

avif，因为它包含错误。

在这里:您可以看到我试图提供的avif文件：

https://cards.incantata.de/cdn/avif_orig/card_63.avif

我是否必须以不同的方式创建该图像，这样firefox就可以显示它了吗？

Answer 1

Firefox还不能显示HEIF/HEIC图像。

为了通过heif-enc对AVIF进行编码，添加-A参数。当您省略-A参数时，将对HEIC文件进行编码。

AVIF编码的另一种方法是使用libavif包中的avifenc。