如何为服务器启用AVIF支持 [英] How to enable AVIF support for a server

查看:67
本文介绍了如何为服务器启用AVIF支持的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

AVIF图像格式看起来是一种很有前途的格式.如何在Web服务器上编译和使用它?我的专门是Ubuntu 18.04/Nginx,但我正在寻找如何编译和开始转换图像的要点?

The AVIF image format looks to be a really promising format. How can you compile and use it on a web server? Mine specifically is Ubuntu 18.04/Nginx but I'm looking for a gist of how to compile and start converting images?

推荐答案

AVIF似乎是一种新格式,找不到太多信息.但是,让我们立即进入那里的发现:

AVIF seems to be a new format, and not much info could be found. But, let's go right away into the findings, that were there:

从[1]中,我找到了一本烹饪书,介绍如何在Nginx上使用这些书:

From [1] I found a cook book how to serve those on Nginx:

http {
    # ... Omitted.
    map $http_accept $ai {
        "~avif" "a";
        "~webp" "w";
        default "";
    }
    types {
        image/avif avif;
    }
    server {
        # ... Omitted.
        # Rewrite .i files.
        location ~ \.i$ {
            # Change .i request to .avif file.
            if ($ai = "a") {
                rewrite ^(.*)$ $1.avif last;
            }
            # Change .i to .webp file.
            if ($ai = "w") {
                rewrite ^(.*)$ $1.webp last;
            }
            # If no AVIF support, use PNG image.
            if ($ai = "") {
                rewrite ^(.*)$ $1.png last;
            }
        }
    }
}

该解决方案依赖于Accept标头和一个map语句.假定此处的图像以.i结尾,但是如果进行了这样的修改,也可以与.png和其他图像一起使用.

The solution relies on Accept header and a map statement. Images here are assumed to end with .i but this would work with .png and others too, if modified so.

对服务器的请求应具有"image/avif"类型.

Requests to server should have a type "image/avif".

有一项名为Squoosh的服务,您可以在其中转换图像.在[2]上还提到了一些编程方法,该方法依赖于Sharp.

There is a service called Squoosh, where you can convert your images. Some programmatic approach is also mentioned on [2], which relies on Sharp.

有关转化的代码:

import * as sharp from 'sharp';

sharp('input.png')
 .toFormat('heif', { quality: 30, compression: 'av1' })
 .toFile('output.avif')
 .then(info => console.log(info));

来源:

[1] https://www.dotnetperls.com/nginx-examples

[2] https://dev.to/adamlacombe/如何将图像转换为avif-in-nodejs-5083

这篇关于如何为服务器启用AVIF支持的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆