Tùy chọn “Yêu cầu trang web trên máy tính để bàn” của Chrome hoạt động như thế nào?


94

Đối với iOS google chrome, khi người dùng nhấn vào nút "Yêu cầu trang web dành cho máy tính để bàn", trình duyệt sẽ làm gì để cố gắng hiển thị trang web trên máy tính để bàn? Tôi tưởng tượng một số loại tiêu đề theo yêu cầu mà các trang web đang tìm kiếm, hoặc một cái gì đó tương tự?

Câu trả lời:


64

Tôi nghĩ sự khác biệt duy nhất là User-Agent:tiêu đề trong yêu cầu.

Dưới đây là các tiêu đề Tác nhân người dùng do Chrome gửi trên thiết bị Android của tôi:

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

Lưu ý từ "Di động" trong phần đầu tiên, đồng thời đề cập đến hệ thống và thiết bị Android. Kiểm tra những điều này, tôi thấy rằng nó cũng cung cấp thông tin sai - cụ thể là X11 và x86_64 - để khớp chặt chẽ với giá trị được gửi bởi phiên bản Desktop Linux của Trình duyệt Chrome.


14
Một tiêu đề riêng biệt sẽ rất tuyệt. Việc đánh hơi User Agent thật là kinh khủng.
Mu Mind

10
Tôi đồng ý. Đôi khi tính năng tự động phát hiện và chuyển hướng được thực hiện bởi một số trang web cực kỳ phản tác dụng và làm trầm trọng thêm.
dsh

5
Giải pháp tốt hơn sẽ là phát hiện kích thước, giao diện và khả năng của thiết bị. Truy vấn phương tiện CSS là một bước đi đúng hướng.
Brad

1
Tính năng này không được thực hiện bởi một chuyển đổi UA đơn giản và làm mới. Sự thật của vấn đề là hầu hết các trang web dành cho thiết bị di động sẽ KHÔNG chuyển về máy tính để bàn nếu được tải bằng chuỗi UA trên máy tính để bàn. Vì vậy, sau đó Safari sử dụng yêu cầu ban đầu của bạn? Không. Nó dường như hoạt động ngay cả khi ban đầu bạn đã nhập URL cho trang web dành cho thiết bị di động. Tôi không biết nó được triển khai như thế nào vì tên của các phiên bản dành cho thiết bị di động hoàn toàn không được tiêu chuẩn hóa, nhưng có một điều gì đó thông minh hơn đang diễn ra hơn là một thay đổi UA đơn giản.
Andrew G

Tôi muốn chỉ ra rằng "chế độ xem bố cục" cũng sẽ thay đổi nếu một người kích hoạt tùy chọn "Yêu cầu trang web trên máy tính", tùy chọn này ảnh hưởng đến truy vấn phương tiện. Kiểm tra -mobile-web-handbook để biết thêm thông tin về chế độ xem bố cục.
Rick

19

Chỉ muốn chỉ ra rằng Chrome hiện không chỉ thay đổi User-Agentmà còn bỏ qua thẻ meta chế độ xem ban đầu nếu bạn "Yêu cầu trang web trên máy tính để bàn". Vì vậy, không cần thiết phải đánh hơi User-Agentnữa và bạn có thể dựa vào sự thay đổi chế độ xem vì hầu hết các trang web đáp ứng sẽ tự động làm. Xem Thay đổi này để tham khảo thêm.


1
Cảm ơn vì điều đó. trang web rất đơn giản của riêng tôi đang hoạt động rất khác khi nó không được nhấp vào và tôi không thể hiểu tại sao vì tôi không làm gì hơn ngoài truy vấn phương tiện trong CSS.
R Reveley

17

Một sự khác biệt nhỏ khác là yêu cầu dường như đến URL được nhập có chủ đích cuối cùng trước khi bất kỳ giám đốc nào chuyển nó đi. Ví dụ:

Được: somesite.com đánh hơi tác nhân, xem Android và thực hiện một document.location + = "/ m";

Sau đó: trình duyệt sẽ có URL là somesite.com/m

Nhưng: nếu bạn "Yêu cầu trang web dành cho máy tính để bàn", nó sẽ thay đổi Tác nhân người dùng và yêu cầu lại từ somesite.com

Trừ khi: bạn đã truy cập trực tiếp vào URL di động của somesite.com/m, trong trường hợp đó, nó chỉ tải lại somesite.com/m.

Tôi mong đợi rằng điều này hoạt động với chuyển hướng HTTP 301 và 302, tôi biết nó hoạt động với các thay đổi của document.location (ít nhất là như được mô tả) và sẽ suy đoán rằng nó hoạt động với các lần làm mới <meta>.


Bạn có cơ sở câu trả lời của bạn từ điều này ?
Keale

@Keale có lẽ ngược lại, với các dấu thời gian
verbumSapienti.

Có vẻ như nếu yêu cầu POST nhận được 302 hoặc 303 đề xuất GET cho một URL khác, khi đó người dùng thay đổi cài đặt 'chế độ xem trên máy tính để bàn', trình duyệt sẽ gửi yêu cầu GET đến URL ban đầu trả lại 302/303 (mất thông số POST ). Có vẻ như cả Firefox và Chrome đều làm điều này và IMO đây chắc chắn không phải là điều nên xảy ra.
Jake

-2

Đoạn mã javascript này sẽ thực hiện tương tự một cách hiệu quả:

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

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.