在移动浏览器或PhoneGap应用程序之间进行检测

Question

是否可以使用JavaScript检测用户是否通过浏览器或应用程序进行访问？

我正在通过网页和PhoneGap应用程序为多个移动操作系统开发混合应用程序,目标是:

1. 独立于部署目标使用相同的代码
2. 仅当用户代理是应用程序时才添加PhoneGap.js文件

Answer 1

您可以检查当前URL是否包含http协议.

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

Answer 2

想到的快速解决方案是,

onDeviceReady

应该帮助你.由于此JS调用仅由Native桥(objC或Java)调用,因此safari移动浏览器将无法检测到此情况.因此,您的设备应用程序(手机缺口)源基础将从onDeviceReady.

如果任何Phonegap的JS调用如Device.platform或Device.name是NaN或null,那么它显然是一个移动Web调用.

请检查并告诉我结果.

Answer 3

我想出了一种方法来做到这一点,而不是依赖于deviceready事件,从而保持Web代码库的完整性......

使用内置的deviceready事件的当前问题是,当页面加载时,你无法告诉应用程序:"嘿,这不是在移动设备上运行,没有必要等待设备准备好开始".

1.-在代码的原生部分,例如iOS,在MainViewController.m中有一个方法viewDidLoad,我发送一个javascript变量,我稍后在Web代码中检查,如果该变量在,我会等启动我的页面的代码,直到一切准备就绪(例如,导航器地理位置)

在MainViewController.m下:

- (void) viewDidLoad
{
    [super viewDidLoad];
    NSString* jsString = [NSString stringWithFormat:@"isAppNative = true;"];
    [self.webView stringByEvaluatingJavaScriptFromString:jsString];
}

2.- index.html代码如下:

function onBodyLoad()
{
    document.addEventListener("deviceready", onDeviceReady, false);
}

function onDeviceReady(){;
    myApp.run();
}

try{
    if(isAppNative!=undefined);
}catch(err){
    $(document).ready(function(){
        myApp.run();
    });
}

Answer 4

PhoneGap有window.PhoneGap(或在Cordova,它的window.cordova或window.Cordova)对象集.检查该对象是否存在并执行魔术.

Answer 5

在本地调用内部,其中加载了phonegap应用的url,您可以添加带有值phonegap的参数目标.因此对android的调用变成了这样的东西.

super.loadUrl("file:///android_asset/www/index.html?target=phonegap");

使用此代码的网站不会使用额外参数调用,因此我们现在在两个部署平台之间有不同之处.
在javascript中我们检查参数是否存在,如果是,我们为phonegap/cordova添加脚本标记.

    var urlVars = window.location.href.split('?');
    if(urlVars.length > 1 && urlVars[1].search('target=phonegap') != -1){
        //phonegap was used for the call
        $('head').append('<script src="cordova.js"></script>');
    }
    

一个小警告:此方法需要在每个不同的目标移动平台的phonegap中更改对index.html的调用.我不熟悉大多数平台在哪里这样做.

Answer 6

如果您尝试以下操作会怎样：

if(window._cordovaNative) {
  alert("loading cordova");
  requirejs(["...path/to/cordova.js"], function () { 
         alert("Finished loading cordova");
  });
}