如何在 Edge、IE 和旧版 Safari 中使用 webp？答案

【问题标题】：How to work with webp in Edge, IE and older Safari?如何在 Edge、IE 和旧版 Safari 中使用 webp？
【发布时间】：2019-10-06 15:12:34
【问题描述】：

我想减少页面负载，因为比较 webp 与 jpg 或 png，webp 的大小要小得多（以 KB 为单位），但这是一个问题，它在 Edge、IE(11) 和旧版 Safari(5.1.7) 中不起作用)。

寻找解决方案我找到了@WaughWaugh https://stackoverflow.com/a/56021203/10966377 的帖子，该帖子发布了使用base64 将webp 转换为png 的工具，但是在我可以毫无压力地睡觉之前，这不会增加不必要的页面加载，因为它必须将webp 转换为png？

【问题讨论】：

标签： html browser webp

【解决方案1】：

它不会通过网络传输 PNG。

成本来自下载库本身以及运行它所占用的 CPU/内存。

【讨论】：

【解决方案2】：

您可以结合使用内容协商和 URL 重写来让网络服务器处理它，但这当然不会为不支持的浏览器启用 WebP。以下是使用 Apache 的方法（来自图像文件夹中的 .htaccess）：

<If "%{HTTP_ACCEPT} =~ /webp/">
    Options +MultiViews
</If>
<Else>
    RewriteEngine on
    RewriteCond   "$1.jpg"           -f
    RewriteRule   "^(.*)$" "$1.jpg"
</Else>

因此，如果浏览器请求的 Accept 标头中包含“webp”，则使用 ConNeg，否则提供 JPG（如果存在）。

【讨论】：