Maison > interface Web > Tutoriel H5 > Comment réveiller l'application h5

Comment réveiller l'application h5

php中世界最好的语言
Libérer: 2018-01-11 09:27:42
original
4188 Les gens l'ont consulté

Cette fois, je vais vous montrer comment réveiller l'application en utilisant h5, comment réveiller l'application en utilisant h5 ? Quelles sont les précautions pour les applications de réveil h5 Voici des cas pratiques, jetons un oeil.

Il est courant que h5 évoque les besoins des applications. À une époque où le mobile est roi, h5 joue un rôle important dans le détournement du trafic des applications.

Trois schémas d'évocation

Actuellement, la méthode d'évocation que nous utilisons est le schéma d'URL (pris en charge par les plateformes iOS et Android. Il vous suffit d'enregistrer le schéma lors de l'application native). développement. Ensuite, lorsque les utilisateurs cliquent sur un tel lien, ils accèdent automatiquement à l'application.

var last = Date.now(),
    doc = window.document,
    ifr = doc.createElement('iframe');
 
//创建一个隐藏的iframe
ifr.src = nativeUrl;
ifr.style.cssText = 'display:none;border:0;width:0;height:0;';
doc.body.appendChild(ifr);
 
setTimeout(function() {
    doc.body.removeChild(ifr);
    //setTimeout回小于2000一般为唤起失败
    if (Date.now() - last < 2000) {
        if (typeof onFail == &#39;function&#39;) {
            onFail();
        } else {
            //弹窗提示或下载处理等
        }
    } else {
        if (typeof onSuccess == &#39;function&#39;) {
            onSuccess();
        }
    }
}, 1000);
Copier après la connexion

Le principe d'évocation du schéma iframe est le suivant : lorsque le programme passe en arrière-plan, la minuterie sera retardée (une autre situation où la minuterie est inexacte). Si l'application est réveillée, la page Web entrera inévitablement en arrière-plan. Si l'utilisateur quitte l'application, le temps dépassera généralement 2 secondes ; si l'application n'est pas réveillée, la page Web n'entrera pas en arrière-plan. setTimeout est essentiellement déclenché. Temps, et le temps ne dépassera pas 2s.

window.location.href passe directement à

window.location.href = nativeUrl;
Copier après la connexion


une balise évoque

<a href="nativeUrl">唤起app</a>
Copier après la connexion


En comparant l'évocation iframe et location.href, nous pouvons trouver :

Pour iOS, le saut location.href est plus approprié, car cette méthode peut évoquer avec succès l'application dans Safari. Inutile de dire l'importance de Safari comme navigateur par défaut pour iPhone, mais pour les clients WeChat et QQ, ces deux méthodes sont inutiles dans ios==

Pour Android, lors de l'entrée dans la page En cas d'évocation directe , iframe et location.href sont identiques, mais si l'évocation de l'événement conduit , les performances de l'évocation iframe sont meilleures que celles de location.href.

Grâce aux tests, il a été constaté que les performances de l'évocation directe et de l'évocation événementielle lors de l'entrée dans la page sont différentes pour de nombreux navigateurs. En termes simples, l'évocation directe échoue davantage.

Grâce à l'analyse comparative ci-dessus, il est plus approprié d'utiliser iframe pour Android et window.location.href pour iOS.

Je pense que vous maîtrisez les méthodes après avoir lu ces cas. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture connexe :

Comment utiliser le stockage local Web de H5

Comment implémenter la fonction glisser-déposer dans H5

Balise en ligne avancée de H5

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal