Chrome的“请求桌面网站”选项是如何工作的？

Question

对于iOS版的Google Chrome浏览器，当用户点击“请求桌面站点”按钮时，浏览器会做什么来尝试呈现桌面站点？我想象中可能是在请求头中添加了某种站点所需的信息，或者类似的操作。

- butallmj

Answer 1

我认为唯一的区别在于请求中的 User-Agent: 头部。

这里是我在安卓设备上使用Chrome时发送的User-Agent头部：

Mozilla/5.0 (Linux; Android 4.0.4; Galaxy Nexus Build/IMM76K) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.166 Mobile Safari/535.19

Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/535.19 (KHTML, like Gecko) Chrome/18.0.1025.45 Safari/535.19

注意第一个里面的“移动”这个词，还有提到了Android系统和设备。检查这些内容后，我发现它也提供了错误的信息 - 即X11和x86_64 - 以紧密匹配Chrome桌面版发送的值。

- dsh

---

一个单独的标题会很棒。用户代理嗅探太糟糕了。 - Mu Mind

我同意。有时候一些网站实施的自动检测和重定向非常适得其反，并且令人恼火。 - dsh

更好的解决方案是检测设备的尺寸、接口和功能。CSS 媒体查询是朝着正确方向迈出的一步。 - Brad

这个功能不能通过简单的UA切换和刷新来实现。事实是，如果使用桌面UA字符串加载移动站点，大多数移动站点将不会切换回桌面。那么Safari会使用您的原始请求吗？不是的。即使您最初键入了移动站点的URL，它似乎也能正常工作。我不知道它是如何实现的，因为移动版本的名称绝不是标准化的，但是有比简单的UA更智能的东西正在发生。 - Andrew G

我想指出的是，如果触发“请求桌面站点”选项，则“布局视口”也会更改，这会影响媒体查询。有关布局视口的更多信息，请查看the-mobile-web-handbook。 - Rick

Answer 2

我想指出的是，现在Chrome不仅更改User-Agent，而且如果你选择“请求桌面站点”，它还会忽略原始的viewport meta标记。因此，不再需要嗅探User-Agent了，你可以依靠viewport的变化，因为大多数响应式网站都会自动进行调整。请参阅此更改以获取更多信息。

- Thomas

---

谢谢。我的简单网站在未被点击时表现非常不同，我无法理解为什么，因为我只是在CSS中使用媒体查询。 - R Reveley

Answer 3

还有一个细微的区别，那就是请求似乎是针对最后一个有意输入的URL，而在任何重定向器移动它之前。例如：

假设：somesite.com检测到代理，看到Android，并执行document.location += "/m";

那么：浏览器的URL将为somesite.com/m

但是：如果您“请求桌面站点”，它将更改用户代理并从somesite.com重新请求

除非：您一开始就直接进入移动端的somesite.com/m URL，否则它只会重新加载somesite.com/m。

我希望这适用于HTTP 301和302重定向，我知道它适用于document.location更改（至少如描述的那样），并且推测它适用于刷新。

- Jason Miller

---

你的回答是基于这个吗？ - Keale

@Keale 可能是相反的，考虑到时间戳。 - verbumSapienti

看起来，如果POST请求收到302或303建议获取另一个URL，则用户更改“桌面视图”设置，浏览器将向返回302/303的原始URL提交GET请求（丢失POST参数）。 火狐和谷歌都这样做，我认为这绝对不是应该发生的事情。 - Jake

Answer 4

这个 JavaScript 代码片段将有效地执行相同的操作：

function requestDesktopSite() {
    document.getElementsByTagName('meta')['viewport'].content='min-width: 980px;';
}

<button onclick="requestDesktopSite()">Request Desktop Site</button>

- 10us