Como funciona a opção “Solicitar site da área de trabalho” do Chrome?


94

Para iOS google chrome, quando um usuário clica no botão "Solicitar site para desktop", o que o navegador faz para tentar abrir um site para desktop? Imagino algum tipo de cabeçalho na solicitação que os sites estão procurando, ou algo semelhante?

Respostas:


64

Eu acho que a única diferença é a User-Agent: cabeçalho da solicitação.

Aqui estão os cabeçalhos do User-Agent enviados pelo Chrome em meu dispositivo Android:

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

Observe a palavra "Mobile" no primeiro, e também a menção do sistema e dispositivo Android. Verificando isso, vejo que também fornece informações falsas - a saber X11 e x86_64 - para coincidir com o valor enviado pela versão Desktop Linux do Cromada.


14
Um cabeçalho separado seria brilhante. Farejar o agente do usuário é tão horrível.
Mu Mind

10
Concordo. Às vezes, a detecção automática e o redirecionamento implementados por alguns sites são extremamente contraproducentes e agravantes.
dsh

5
Uma solução melhor seria detectar o tamanho, as interfaces e os recursos do dispositivo. As consultas de mídia CSS são um passo na direção certa.
Brad

1
Este recurso não é implementado por uma simples troca e atualização do UA. A verdade é que a maioria dos sites para celular NÃO voltará para o desktop se carregados com uma string UA para desktop. Então o Safari usa sua solicitação original? Não. Parece funcionar mesmo que você tenha digitado originalmente o URL do site para celular. Não sei como é implementado porque o nome das versões móveis não é padronizado, mas há algo mais inteligente acontecendo do que uma simples mudança no UA.
Andrew G

Gostaria de salientar que a "janela de visualização do layout" também mudaria se a opção "Solicitar site da área de trabalho" fosse acionada, o que afeta a consulta de mídia. Verifique o-mobile-web-handbook para obter mais informações sobre a janela de visualização de layout.
Rick

19

Queria apenas salientar que o Chrome agora não apenas altera, User-Agentmas também ignora a meta tag da janela de visualização original se você "Solicitar site da área de trabalho". Assim, não será mais necessário farejar o User-Agente você pode contar com a mudança da janela de visualização, como a maioria dos sites responsivos fazem automaticamente. Veja esta alteração para mais referências.


1
Obrigado por isso. meu próprio site muito simples se comporta de maneira muito diferente quando não é clicado e não consigo entender o porquê, já que não estou fazendo nada além de consultas de mídia em CSS.
R Reveley

17

Uma outra pequena diferença é que a solicitação parece ter sido para o último URL inserido intencionalmente antes de qualquer redirecionamento movê-lo. Por exemplo:

Dado: somesite.com fareja o agente, vê o Android e executa um document.location + = "/ m";

Então: o navegador terá um URL de somesite.com/m

Mas: se você "Solicitar site para desktop", isso mudará o User-Agent e solicitará novamente de somesite.com

A menos que: você tenha acessado diretamente o URL móvel de somesite.com/m em primeiro lugar, caso em que apenas recarrega somesite.com/m.

Eu esperaria que isso funcionasse com redirecionamentos HTTP 301 e 302, sei que funciona com alterações de document.location (pelo menos como descrito) e especularia que funciona com <meta> atualizações.


Você baseou sua resposta nisso ?
Keale

@Keale provavelmente o contrário, dados os carimbos de data
verbumSapienti

Parece que, se uma solicitação POST obtiver um 302 ou 303 sugerindo um GET para outro URL, o usuário alterar a configuração de 'visualização da área de trabalho' e o navegador enviará uma solicitação GET para o URL original que retornou o 302/303 (perdendo os parâmetros POST ) Parece que tanto o Firefox quanto o Chrome fazem isso e, IMO, definitivamente não é o que deveria estar acontecendo.
Jake

-2

Este snippet de javascript fará efetivamente o mesmo:

function requestDesktopSite() {
    document.getElementsByTagName('meta')['viewport'].content='min-width: 980px;';
}
<button onclick="requestDesktopSite()">Request Desktop Site</button>

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.