![bcb2d79b6597660d8824264f9f7cd53f.png](https://i-blog.csdnimg.cn/blog_migrate/7cec8d5df5110a69433d2f05e92dd83e.jpeg)
(© Jorge Romano/Offset by Shutterstock)
❝本题摘自于我 github 上的面试每日一题:https://github.com/shfshanyue/Daily-Question,并有大厂面经及内推信息,可「在左下角打开本题原文链接」
❞
如果 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
判断是否移动端容易出错- 对缓存不友好
更多面试
![98895592f76e96407a94aeaa2c52d7a4.png](https://i-blog.csdnimg.cn/blog_migrate/31e802070f141179d0dc3a2434d13dc0.jpeg)
![be8a0fa9bc83a7aaf2af55286170909a.png](https://i-blog.csdnimg.cn/blog_migrate/f645cbdbb4159c1fcd9c5af0128fddb1.jpeg)
![5b220bc3b7a657daff8abb09216a1a6f.png](https://i-blog.csdnimg.cn/blog_migrate/7c6012d320e0489fe77084bc6284b578.jpeg)
关注我
我是山月,正致力于「每天用五分钟能够看完的简短答案回答一个大厂高频面试题」。扫码添加我的微信,备注进群,加入高级前端进阶群.
![9b56b5a1aec2318c8dddda6e1c058292.png](https://i-blog.csdnimg.cn/blog_migrate/8136f722fe6e50c86224d220a6d29501.jpeg)
欢迎关注公众号【互联网大厂招聘】,定时推送大厂内推信息及面试题简答,每天学习五分钟,半年进入大厂中
![679a9a8d011b1b9b3d064d81544a4730.png](https://i-blog.csdnimg.cn/blog_migrate/0d3187a1b4f2d359ae43c87b36169ec5.jpeg)