Détecter entre un navigateur mobile ou une application PhoneGap

Question

Est-il possible de détecter si l'utilisateur accède via le navigateur ou l'application en utilisant JavaScript?

Je développe une application hybride pour plusieurs systèmes d’exploitation mobiles via une page Web et une application PhoneGap. L’objectif serait de:

1. Utiliser le même code indépendamment de la cible de déploiement
2. Ajouter le fichier PhoneGap.js uniquement lorsque l'agent utilisateur est une application

Answer 1

Vous pouvez vérifier si l'URL actuelle contient le protocole http .

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

Answer 2

Une solution rapide me vient à l’esprit:

 onDeviceReady
 

doit vous aider. Cet appel JS n'étant appelé que par le pont natif (objC ou Java), le navigateur mobile Safari ne parviendra pas à le détecter. Ainsi, votre base source d'application sur appareil (intervalle téléphonique) sera lancée à partir de onDeviceReady .

Et si l'un des appels JS de Phonegap, comme Device.platform ou Device.name, est NaN ou null, il s'agit évidemment d'un appel Web mobile.

S'il vous plaît vérifier et laissez-moi savoir les résultats.

Answer 3

J'ai trouvé une façon de le faire et ne pas compter sur deviceready évènements ainsi, en gardant le web codebase intacte...

Le problème actuel avec l'aide de la construite en deviceready, c'est que lorsque la page est chargée, vous n'avez aucun moyen de demander à l'application: "Hé, ce n'est PAS en cours d'exécution sur un appareil mobile, il n'y a pas besoin d'attendre pour que l'appareil soit prêt à démarrer".

1.- Dans le natif portion de code, par exemple pour iOS, en MainViewController.m il y a une méthode viewDidLoad, je suis de l'envoi d'une variable javascript que j'ai ensuite vérifier dans le code web, si cette variable est dans le coin, je vais attendre pour commencer le code de ma page jusqu'à ce que tout est prêt (par exemple, le navigateur de géolocalisation)

En Vertu De MainViewController.m:

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

2.- index.html le code qui va comme ceci:

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 a le jeu d'objets window.PhoneGap (ou dans Cordova, c'est window.cordova ou window.Cordova). Vérifiez si cet objet existe et faites la magie.

Answer 5

Je n'ai pas essayé de quelque manière que ce soit, mais comment à ce sujet?

À l'intérieur de l'appel des indigènes où l'url de l'application phonegap est chargé d'ajouter un paramètre cible avec la valeur phonegap. Donc, l'appel pour android devient quelque chose comme ça.

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

Votre site en utilisant ce code ne sera pas appelé avec le paramètre supplémentaire, de sorte que nous avons maintenant quelque chose de différent entre les deux déploiement de plates-formes.
À l'intérieur du javascript, nous vérifions si le paramètre existe et si oui, nous ajouter la balise de script pour phonegap/cordova.

 var urlVars = fenêtre.emplacement.href.split('?');
 si(urlVars.longueur > 1 && urlVars[1].recherche ("target=phonegap') != -1){
 //phonegap a été utilisé pour l'appel.
 $('head').append('<script src="cordova.js"></script>');
}
 

Une petite mise en garde

: cette méthode nécessite de modifier l'appel à index.html dans phonegap pour chaque ciblés plate-forme mobile. Je suis pas familier où pour ce faire, pour la plupart des plates-formes.