javascript - BuzzFeed 如何进行移动重定向?

标签 javascript http redirect nginx varnish

我正在尝试向我的网站添加移动重定向。我想我想要一个完全独立的布局,而不是使用媒体查询。

实现此目的的一种简单方法是让 CloudFlare 检测并重定向到子域 m.example.com

出于多种原因,我不想使用子域。

我过去做的另一种方法是使用 this mobile detect script与媒体查询和部分加载页面的部分。从长远来看,这被证明是一场噩梦,我不想使用媒体查询。

我注意到了路buzzfeed.com这几乎正​​是我想要的方式。看起来他们以某种方式检测浏览器或其他东西,然后重定向到显示移动网站的 ?s=mobile。

我无法判断这是在服务器上还是在 Javascript 中完成的,或者他们是如何做到的。我假设它在服务器上,因为如果我 curl http://www.buzzfeed.com/?s=mobile 我会收到 302 响应...我猜因为curl 没有发送看起来像移动设备的 header 。

是否有常见的、经常维护的 nginx 或 varnish 脚本来执行此操作?我主要是摸不着头脑,谷歌搜索似乎没有带来太多相关的讨论,除了 3 年前看起来很弱的片段。

最佳答案

您可以使用varnish-devicedetect VCL 可以完成您正在寻找的一切。 installation guide举例说明如何向请求 URL 添加查询参数,或向发送到后端的请求添加自定义 header 。这使您能够透明地处理不同类型的客户端。

要让所有 Vary header 、清除等完美工作,需要大量的思考和摆弄,但在示例的帮助下,您应该能够使 varnish-devicedetect 为您工作。

关于javascript - BuzzFeed 如何进行移动重定向?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26691847/

相关文章:

javascript - 将多个 d3 图表放在同一页面上但应用不同的样式

javascript - 使用 Javascript 和 Jquery 为列表中的每个条目动态创建表

javascript - 如何在 For 循环内每次提交后保持延迟?

flutter | Dart : Target of URI does not exist

javascript - 无法在谷歌文档文件中找到函数错误

android - http post方法将空值传递给服务器

angular - HTTP 拦截器使用 Angular 2、4、6、7、8、9 TypeScript 在请求失败时获取状态 0

javascript - 新浏览器选项卡或窗口中的 HTML

redirect - IIS 重写规则以将特定域 url 重定向到同一域上的不同 url

PowerShell:将控制台输出发送到文件而不会使此控制台输出震耳欲聋