Essayez d'appeler le code de l'instance APP dans la page H5

Cet article partage principalement avec vous l'exemple de code pour essayer d'appeler l'APP dans la page H5. J'espère que cela pourra vous aider.

Fonctions courantes sur le marché

Ce type de fonction devrait être très courant de nos jours, Taobao H5, Zhihu H5 et ainsi de suite. . .

Cliquer dessus lancera l'application ou ouvrira la page de téléchargement ou téléchargera directement.

Mais j'ai trouvé que cette fonction de Zhihu est un peu différente

Sa logique est de me demander d'abord si je dois ouvrir l'application Zhihu sur mon téléphone (le mécanisme du navigateur demande la permission à l'utilisateur). ). Ensuite, l’invite de téléchargement apparaît à nouveau.

Schéma d'URL de la solution

Le schéma d'URL est pris en charge sur IOS et Android et a une bonne compatibilité.

Préférez utiliser iframe

Le pseudo-code est le suivant :

const iframe = document.createElement('iframe');iframe.src = 'URL scheme'; // URL scheme的方式跳转iframe.style.display = 'none';document.body.appendChild(iframe);

À ce stade, si tous les environnements le prennent en charge, il se réveillera jusqu'à l'application.

Mais c'est une situation idéale, il faut plutôt faire la logique rapide du traitement de compatibilité.

Certains systèmes intercepteront le src de l'iframe (ce n'est qu'une des raisons de l'échec du réveil de l'APP), car cet attribut src est un pirate informatique illégal et de nombreuses vulnérabilités sont causées par son exploitation.

Donc, à ce stade, il est nécessaire de déterminer l'échec du réglage de l'APP.

Le pseudo code est le suivant :

const timer = 1000;setTimeout(function() {        // 执行成功后移除iframedocument.body.removeChild(iframe);//setTimeout小于2000通常认为是唤起APP失败 if (Date.now() - last 

Comprendre :

• Si le l'évocation est réussie, H5 La page passera en arrière-plan et le timer sera retardé. Même si l'utilisateur passe de l'application à la page H5, le décalage horaire doit être supérieur à 2S.

• Si l'éveil échoue, le timer sera exécuté à temps (même s'il y a un délai de 100 ms, c'est suffisant), et il doit être inférieur à 2S à ce moment.

Lorsque l'iframe est interceptée, nous pouvons utiliser window.location.href = URL scheme pour la compatibilité.

Recommandations associées :

10 articles recommandés sur les pages H5

Explication détaillée du processus de création d'une page WeChat H5

Notes sur les pages 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!