如果 PC 端和移动端是一套代码则不会出现这个问题。这个问题出现在 PC 端和移动端是两套代码,却共用一个域名。
使用 nginx
配置如下,根据 UA 判断是否移动端,而走不同的逻辑 (判断UA是否移动端容易出问题)
location / {
// 默认 PC 端
root /usr/local/website/web;
# 判断 UA,访问移动端
if ( $http_user_agent ~* "(Android|webOS|iPhone|iPad|BlackBerry)" ){
root /usr/local/website/mobile;
}
index index.html index.htm;
}
复制代码
解决方案通常使用 Vary
响应头,来控制 CDN 对不同请求头的缓存。
此处可以使用 Vary: User-Agent
,代表如果 User-Agent 不一样,则重新发起请求,而非从缓存中读取页面
Vary: User-Agent
复制代码
当然,User-Agent
实在过多,此时缓存失效就会过多。
简答
使用 Vary: User-Agent
,根据 UA 进行缓存。
Vary: User-Agent
复制代码
但最好不要出现这种情况,PC 端和移动端如果是两套代码,建议用两个域名,理由如下
nginx
判断是否移动端容易出错- 对缓存不友好
作者:shanyue
链接:https://juejin.im/post/5f1e1d365188252e332ecc61
来源:掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。