cdn图片资源自动返回合适的图片格式

Question

例：传上来的图片资源是jpg格式的，cdn如何自动识别当前浏览器环境，去支持显示最近的图片格式，比如webp这类图片格式

本人在七牛云api那找到了相关实现
https://developer.qiniu.com/d...
通过对比 资源下载优化的提升很大 ，前提是要做好兼容，目前是在pc上使用，所以兼容性影响不大

Answer 1

之前我正好做过这个优化，可以看看我的方案： https://blog.dteam.top/posts/...

阿里云的OSS正好支持图片转换功能，利用OSS的图片转换功能，配合在CDN的边缘脚本进行内部URL重写就可以实现这个功能了。如果你用的是其他家的CDN，也可以类似处理。

EDIT: 写当时那篇文章的时候，阿里云CDN尚不支持图片转换，因此是在OSS级别上做的，通过CDN重写回源URL的方案使用webp图片。但是当回复帖子的时候，阿里云CDN本身已经支持自适应webp了: https://help.aliyun.com/docum... 使用比较简单，直接开启配置就行了。公测期间免费，未来会收费。

Answer 2

除了让 CDN 支持之外，可以考虑前端方案：在 HTML 页面应用 picture + source + img 的组合。
虽然 IE 等浏览器不支持 picture 标签，但它们仍会正确渲染 img 标签，兼容性应该没有问题。