Question

这对我来说是全新的，并且不知道我在做什么，所以我真的更喜欢一个简单的实现解决方案（如果它存在）。

我需要将访问移动设备（非平板电脑）www.domain.co.uk（托管在Wordpress）上的用户重定向到这样的特定页面（使用WP的永久链接）：

www.domain.co.uk/mobile-home

从该移动页面，我还需要提供一个返回同一域名桌面主页的链接，如下所示：

www.domain.co.uk/desktop-home

我在header.php文件中使用的代码与此类似：

<script>if( 'ontouchstart' in window ) window.location = 'mobile.html';</script>

但如果我直接链接到桌面页面，它只会将移动用户重定向回移动版本。如何获得我需要的功能？

更新

好的，我的第一步是将我的移动访问者引导至移动页面。所以我将以下代码粘贴到我网站主页的页面模板中，测试似乎有效。我把它放在开头的'body'标签下面：

<script>
if( /Android|webOS|iPhone|iPod|BlackBerry|IEMobile/i.test(navigator.userAgent) ) {
window.location = "176.32.230.17/domain.co.uk/m";
}
</script>

现在我无法使用以下代码链接回主页。它让我回到了主题，但主页上面有代码检测设备，并不断带我回到移动网站。我是否将设备检测放在正确的位置？：

<a href="http://176.32.230.17/domain.co.uk/?ref=desktop">Link back to desktop website</a>

Answer 1

您可以使用navigator的用户代理属性检测移动浏览器，并将访问者重定向到移动页面。平板电脑和手机之间的差异是不可靠的（i.E。是Galaxy Note平板电脑还是手机？）

if( /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) ) {
    window.location = "yourmobileurl.com/?ref=desktop";
}

在服务器上，您可以检查桌面的ref var，并向访问者显示一个链接以获取并将选择存储在会话中

Answer 2

var isMobile = {
    Android: function() {
        return navigator.userAgent.match(/Android/i);
    },
    BlackBerry: function() {
        return navigator.userAgent.match(/BlackBerry/i);
    },
    iOS: function() {
        return navigator.userAgent.match(/iPhone|iPad|iPod/i);
    },
    Opera: function() {
        return navigator.userAgent.match(/Opera Mini/i);
    },
    Windows: function() {
        return navigator.userAgent.match(/IEMobile/i);
    },
    any: function() {
        return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
    }
};

请参考此链接：http://www.abeautifulsite.net/blog/2011/11/detecting-mobile-devices-with-javascript/

它解释了如何使用javascript检测设备

Answer 3

因此，通过使用@ Phillip的代码，我设法为我的问题提出了一个完整的解决方案。

我将以下JS放在我的header.php模板中以检测用户代理是否是移动设备，如果是，则执行另一项检查以查看该URL是否包含＃desktop;＃desktop＆＃39;，如果它做什么，什么也不做，让用户保持桌面版。如果它没有重定向到移动网站：

<强> JS

<script>
if( /Android|webOS|iPhone|iPod|BlackBerry|IEMobile/i.test(navigator.userAgent) ) {

if(window.location.hash == "#desktop"){
    // Stay on desktop website
} else {
    window.location = "http://www.domain.co.uk/m";
}

}
</script>

然后，要完成循环，请在移动网站上添加一个链接，添加标签＆＃39;＃desktop＆＃39;到网址，确保他们不会自动重定向回移动版本：

<a href="http://www.domain.co.uk/#desktop">View desktop site</a>

Answer 4

一种解决方案是让返回桌面版本的链接具有url参数，并且仅在未设置该参数时从桌面转发到移动设备。

对于检测设备，您必须阅读用户代理并提供逻辑。 Here's a link to detect iPad and iPhone。类似的用户代理适用于其他人。没有银弹来识别平板电脑。

您可以通过了解其用户代理返回的内容来识别大多数特定设备，但这些设备始终可以更改，您必须为每个可能的平板电脑执行此操作。

至于参数解决方案，这似乎是直截了当的。您可以链接到http://www.mywebpage.com/MyDesktopHome?forwardToMobile=no。否则，您可以将其存储在会话或cookie中，具体取决于您希望持久的时间。

如果在移动设备（不是平板电脑）上重定向用户，但提供反向链接

4 个答案: