如何在不重定向到移动网站的情况下在移动网站上创建 "Desktop Version" link

Question

所以，我之前看到过这个问题，但没有真正的答案（除非我错过了）。

我正在使用它重定向到 site.com

上的移动网站

      if (screen.width <= 800) {
      window.location = "/m";
      }

并且简单 HTML 重定向到 m 上的桌面版本。site.com

     <a href="../"> Desktop Version </a>

当然，由于上面的 if 语句，它会重定向到移动版本。

如何使用 javascript 解决此问题？

谢谢。

Answer 1

本地存储被广泛支持，让我们使用它吧。无需为 cookie 而烦恼。

如果我们在点击移动网站上显示的 "Desktop Version" link 时执行类似操作：

localStorage.setItem("forceToDesktop", "true")
// Followed by redirect to desktop with JS

然后我们修改屏幕宽度检查以包括对上述值的检查：

if (localStorage.forceToDesktop !== "true" && screen.width <= 800) {
    // Do redirect stuff
}

如果没有设置 forceToDesktop 值，并且屏幕宽度小于或等于 800，这将显示移动站点。

不过，还是少了一部分拼图。在选择仅查看桌面网站后，移动用户如何返回移动网站？

我们需要以某种方式删除 forceToDesktop 值。我会做这样的事情。

if (localStorage.forceToDesktop === "true" && screen.width <= 800) {
    // Add a link to the page called something like "view mobile site",
    // and have it run the below javascript function on click
    var backToMobile = function () {
        localStorage.removeItem("forceToDesktop");
        // Redirect back to the mobile version of the page, 
        // or just redirect back to this page, and let the normal 
        // mobile redirect do its thing.
    }
}

如何在不重定向到移动网站的情况下在移动网站上创建 "Desktop Version" link

How to create a "Desktop Version" link on mobile website without it redirecting to the mobile site

javascript

mobile

redirect

version

web