azure - CDN - 根据 Accept header 提供不同的内容类型(Verizon/EdgeCast Premium)？

Question

我有一个服务器，它根据 Accept header 返回不同的响应，例如如果 Accept header 包含“image/webp”，则提供 webp 图像，否则提供 jpg。

我们在服务器级别运行 Varnish，它可以正确执行此操作，如下例所示:

请求(Accept header 中包含 image/webp):

curl -s -D - -o /dev/null "https://REDACTED/media/tokinoha_bowl-4.jpg?sh=2&fmt=webp,jpg" -H "Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8"

响应(提供 webp 图像):

HTTP/2 200 
date: Wed, 06 Feb 2019 08:25:05 GMT
content-type: image/webp
access-control-allow-origin: *
cache-control: public, s-maxage=31536000, max-age=31536000
x-frame-options: SAMEORIGIN
x-xss-protection: 1; mode=block
x-content-type-options: nosniff
strict-transport-security: max-age=31536000; includeSubDomains
vary: Accept-Encoding, Accept-Encoding,Origin
referrer-policy: strict-origin-when-cross-origin
accept-ranges: bytes
content-length: 60028

请求(接受 header 中没有 webp，提供 jpg):

curl -s -D - -o /dev/null "https://REDACTED/media/tokinoha_bowl-4.jpg?sh=2&fmt=webp,jpg" -H "Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/apng,*/*;q=0.8"

回应:

HTTP/2 200 
date: Wed, 06 Feb 2019 08:25:18 GMT
content-type: image/jpeg
access-control-allow-origin: *
cache-control: public, s-maxage=31536000, max-age=31536000
x-frame-options: SAMEORIGIN
x-xss-protection: 1; mode=block
x-content-type-options: nosniff
strict-transport-security: max-age=31536000; includeSubDomains
vary: Accept-Encoding, Accept-Encoding,Origin
referrer-policy: strict-origin-when-cross-origin
accept-ranges: bytes
content-length: 166991

我们在规则引擎设置中设置了以下选项，但是无论请求 header 如何，都会在所有后续请求中提供首先缓存的内容类型。

规则引擎设置

有谁知道实现这一目标的方法吗？

提前致谢!

Answer 1

我们在 Verizon/Edgecast 上遇到了同样的问题: 一个 URL 提供了两种不同的图像类型(JPEG 和 WebP)，具体取决于 >接受 header 。来源 (imgix) 正确发送了 Vary: Accept，但 Edgecast 忽略了这一点并缓存了它所获得的内容，因此不支持 WebP 的浏览器有时会出现格式错误。

我们用 Edgecast 中的规则解决了这个问题: WebP rule

查询参数 auto 始终是 URL 的一部分，因此始终可以从缓存键中删除。通过第二个查询参数 varyWebP，我们可以明确识别 URL，并防止与没有查询参数 auto 的 URL 发生冲突。

在本例中为 URL

https://[HOST]/[PATH]?a=1&b=2&c=3&auto=compress,format

创建相同的缓存键:

https://[HOST]/[PATH]?a=1&b=2&c=3

这就是查询参数 varyWebP 保护我们的原因。