Обнаружение между мобильным браузером или приложением PhoneGap

Можно ли определить, доступен ли пользователь через браузер или приложение с использованием JavaScript?

Я разрабатываю гибридное приложение для нескольких мобильных ОС через веб-страницу и приложение PhoneGap, и цель будет заключаться в следующем:

  • Использовать тот же код независимо от цели развертывания
  • Добавить файл PhoneGap.js только в том случае, если пользовательский агент является приложением

ОТВЕТЫ

Ответ 1

Вы можете проверить, содержит ли текущий URL-адрес протокол http.

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

Ответ 2

Быстрое решение приходит на ум,

onDeviceReady

поможет вам. Поскольку этот вызов JS вызывается только собственным мостом (objC или Java), браузер для браузера Safari не сможет обнаружить это. Таким образом, исходная база вашего устройства (телефонного разрыва) будет начинаться с onDeviceReady.

И если любой из вызовов JS Phonegap, таких как Device.platform или Device.name, является NaN или null, то это, очевидно, мобильный веб-вызов.

Пожалуйста, проверьте и дайте мне знать результаты.

Ответ 3

Я понял способ сделать это и не полагаться на события deviceready, тем самым сохраняя целостность веб-базы...

Текущая проблема с использованием встроенного события deviceready заключается в том, что при загрузке страницы вы не можете сообщать о приложении: "Эй, это НЕ работает на мобильном устройстве, нет необходимости ждать устройства чтобы быть готовым к запуску".

1.- В нативной части кода, например, для iOS, в MainViewController.m есть метод viewDidLoad, я отправляю переменную javascript, которую я позже проверяю в веб-коде, если эта переменная находится вокруг, Я буду ждать, чтобы запустить код для моей страницы, пока все не будет готово (например, геолокация навигатора)

В разделе 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();
    });
}

Ответ 4

В PhoneGap есть окно. PhoneGap (или в Кордове, это window.cordova или window.Cordova). Проверьте, существует ли этот объект и выполняйте магию.

Ответ 5

Внутри нативного вызова, где загружается URL-адрес приложения phonegap, вы добавляете параметр target со значением phonegap. Таким образом, вызов андроида становится чем-то вроде этого.   

super.loadUrl("file:///android_asset/www/index.html?target=phonegap");
Ваш сайт, используя этот код, не будет вызываться с дополнительным параметром, поэтому теперь у нас есть что-то другое между двумя развертывающими платформами.
Внутри javascript мы проверяем, существует ли этот параметр, и если мы добавим тег script для 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>');
    }
Небольшое предостережение: этот метод требует изменения вызова в index.html в телефонной защелке для каждой целевой целевой мобильной платформы. Я не знаю, где это сделать для большинства платформ.

Ответ 6

Я использую тот же код для приложения phonegap и нашего веб-клиента. Вот код, который я использую, чтобы определить, доступна ли телефонная книга:

window.phonegap = false;
$.getScript("cordova-1.7.0.js", function(){
    window.phonegap = true;
});

Имейте в виду, что файл jg phonegap загружается асинхронно. Вы можете загрузить его синхронно, установив правильный вариант функции nifty jquery $.getScript.

Обратите внимание, что этот подход делает дополнительный запрос GET для захвата файла jg phonegap даже в вашем веб-клиенте. В моем случае это не повлияло на производительность моего веб-клиента; поэтому он оказался хорошим/чистым способом сделать это. По крайней мере, пока кто-то не найдет быстрое однострочное решение:)

Ответ 7

Похоже, что вы загружаете другую веб-страницу после того, как веб-просмотр начинается в приложении Phonegap, верно ли это? Если это правда, то вы можете добавить параметр к URL-адресу запроса на основе конфигурации.

Например, если предположить PHP,

App.Config = {
  target: "phonegap"
};

<body onload="onbodyload()">

var onbodyload = function () {
  var target = App.Config.target;
  document.location = "/home?target=" + target;
};

Затем на стороне сервера включите телефонную стрелку js, если целью является телефонная задержка.

Невозможно обнаружить разницу с помощью пользовательского агента.

Ответ 8

Как я это делаю, используется глобальная переменная, которая перезаписывается только версией cordova.js для браузера. В основном файле html (обычно index.html) у меня есть следующие скрипты, зависящие от порядка:

    <script>
        var __cordovaRunningOnBrowser__ = false
    </script>
    <script src="cordova.js"></script> <!-- must be included after __cordovaRunningOnBrowser__ is initialized -->
    <script src="index.js"></script> <!-- must be included after cordova.js so that __cordovaRunningOnBrowser__ is set correctly -->

И внутри cordova.js я просто:

__cordovaRunningOnBrowser__ = true

При создании мобильного устройства, cordova.js не будет использоваться (и вместо этого будет использоваться файл кордоны, специфичный для платформы), поэтому этот метод имеет право быть на 100% правильным независимо от протоколов, userAgents, или переменные библиотеки (которые могут измениться). Могут быть другие вещи, которые я должен включить в cordova.js, но я не знаю, что они еще.

Ответ 9

Ive ben тоже борется с этим, и я знаю, что это старая нить, но я никогда не видел своего подхода нигде, поэтому подумал, что эта доля может помочь кому-то.

Я устанавливаю пользовательский useragent после фактического useragent:

String useragent = settings.getUserAgentString();
settings.setUserAgentString(useragent + ";phonegap");

который просто добавляет строку phonegap, так что другие сайты, полагающиеся на обнаружение вашего мобильного useragent, все еще работают.

Затем вы можете загрузить телефонную таблицу следующим образом:

if( /phonegap/i.test(navigator.userAgent) ) 
{
//you are on a phonegap app, $getScript etc
} else {
alert("not phonegap");
}

Ответ 10

что делать, если вы попробуете следующее:

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

Ответ 11

На мой взгляд, вы пытаетесь сделать проблему для себя. Вы не упомянули свою платформу разработки, но большинство из них имеют разную конфигурацию развертывания. Вы можете определить две конфигурации. И установите переменную, указывающую, каким образом был развернут код. В этом случае вам не нужно заботиться о устройствах, где вы развернули приложение.

Ответ 12

Короткие и эффективные:

if (document.location.protocol == 'file:') { //Phonegap is present }

Ответ 13

Как и B T решение, но проще:

У меня есть пустая cordova.js в моей папке www, которая при перезаписывании Кордовы перезаписывается. Не забудьте включить cordova.js перед файлом приложения script (мне потребовался мой час, чтобы узнать, что у меня они были в неправильном порядке...).

Затем вы можете проверить объект Cordova:

document.addEventListener('DOMContentLoaded', function(){
    if (window.Cordova) {
        document.addEventListener('DeviceReady', bootstrap);
    } else {
        bootstrap();
    }
});

function bootstrap() {
   do_something()
}

Ответ 14

Новое решение: 

var isPhoneGapWebView = location.href.match(/^file:/); // returns true for PhoneGap app

Старое решение:

Используйте jQuery, выполните следующие действия

$(document).ready(function(){
   alert(window.innerHeight);
});

Возьмите iPhone в качестве примера для своего мобильного приложения,

При использовании PhoneGap или Cordova вы получите 460px WebView, но в сафари вы потеряете немного высоты из-за заголовка и нижнего колонтитула браузера.

Если window.innerHeight равно 460, вы можете загрузить phonegap.js и вызвать функцию onDeviceReady С >

Ответ 15

Никто еще не упомянул об этом, но, похоже, теперь Кордова поддерживает добавление браузера в качестве платформы:

cordova platforms add browser

Это автоматически добавит cordova.js во время выполнения, в котором есть событие onDeviceReady, так что вам не нужно его подделывать. Кроме того, у многих плагинов есть поддержка браузера, поэтому в вашем коде больше не будет браузеров.

Чтобы использовать ваше приложение в браузере, вы должны использовать cordova run browser. Если вы хотите развернуть его, вы можете сделать это, используя те же команды, что и другие платформы.

EDIT: забыл упомянуть мой источник.