手机间隙：检测是否在桌面浏览器上运行

javascript cordova

2022-08-30 05:02:13

我正在开发一个Web应用程序，该应用程序使用PhoneGap：Build作为移动版本，并希望为“桌面”和移动版本提供单个代码库。我希望能够检测PhoneGap呼叫是否有效（即，是支持PhoneGap的移动设备上的用户）。

我已经搜索过，不敢相信没有简单的方法来做到这一点。许多人提出了建议;

除非您从应用程序的桌面版本中删除PhoneGap Javascript文件，否则这些都不起作用，这违背了我拥有一个代码库的目标。

到目前为止，我想出的唯一解决方案是浏览器/用户代理嗅探，但这至少可以说并不健壮。欢迎任何更好的解决方案！

编辑：一个更好的解决方案是在一些小的超时后尝试调用PhoneGap函数 - 如果它不起作用，那么假设用户在桌面Web浏览器上。

答案 1

我用这个代码：

if (navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry|IEMobile)/)) {
  document.addEventListener("deviceready", onDeviceReady, false);
} else {
  onDeviceReady(); //this is the browser
}

更新

还有许多其他方法可以检测phonegap是否在浏览器上运行，这是另一个不错的选择：

var app = document.URL.indexOf( 'http://' ) === -1 && document.URL.indexOf( 'https://' ) === -1;
if ( app ) {
    // PhoneGap application
} else {
    // Web page
}

如下所示：在移动浏览器或 PhoneGap 应用程序之间进行检测

答案 2

几天前我写了一篇关于它的帖子。这是你能找到的最好的解决方案（直到PhoneGap发布一些东西，也许或可能不会），它简短，简单和完美（我已经以各种可能的方式和平台检查了它）。

此功能将完成 98% 的案例的工作。

/**
 * Determine whether the file loaded from PhoneGap or not
 */
function isPhoneGap() {
    return (window.cordova || window.PhoneGap || window.phonegap) 
    && /^file:\/{3}[^\/]/i.test(window.location.href) 
    && /ios|iphone|ipod|ipad|android/i.test(navigator.userAgent);
}

if ( isPhoneGap() ) {
    alert("Running on PhoneGap!");
} else {
    alert("Not running on PhoneGap!");
}

要完成其他 2% 的情况，请按照以下步骤操作（它涉及对本机代码的轻微更改）：

创建一个名为 __phonegap_index.html 的文件，其源代码为：

<!-- __phonegap_index.html -->
<script type="text/javascript">
    function isPhoneGap() {
        //the function's content is as described above
    }

    //ensure the 98% that this file is called from PhoneGap.
    //in case somebody accessed this file directly from the browser.
    if ( isPhoneGap() )
        localStorage.setItem("isPhoneGap","1");

    //and redirect to the main site file.
    window.location = "index.html";
</script>

现在，在本机上，只需在所有PhoneGap平台上将起始页从索引.html更改为__phonegap_index.html。假设我的项目名称是示例，您需要更改的文件是（对于PhoneGap版本2.2.0）：

苹果操作系统 - CordovaLibApp/AppDelegate.m
人造人 - src/org/apache/cordova/example/cordovaExample.java
视窗 8 - example/package.appxmanifest
黑莓 - www/config.xml
网络操作系统 - framework/appinfo.json
八达 - （第56行）src/WebForm.cpp
Window Phone 7 - 不知道在哪里（有人还在那个平台上开发？！

最后，您可以在网站上的任何地方使用它，无论它是否在PhoneGap上运行：

if ( localStorage.getItem("isPhoneGap") ) {
    alert("Running on PhoneGap!");
} else {
    alert("Not running on PhoneGap!");
}

希望它有帮助。:-)