web-dev-qa-db-fra.com

comment empêcher l'alerte safari iOS lorsque vous essayez d'ouvrir une application native non installée?

Je cherchais un moyen d'ouvrir une application iOS native à partir du navigateur. J'ai trouvé une solution décente ici: Est-il possible d'enregistrer un schéma d'URL basé sur le domaine http + pour les applications iPhone, comme YouTube et Maps?

Cette solution fonctionne très bien lorsque l'application est installée. mais lorsqu'un utilisateur n'a pas installé cette application - safari déclenche un message d'erreur qui dit "Safari ne peut pas ouvrir la page car l'adresse n'est pas valide."

Existe-t-il un moyen d'empêcher ce comportement et d'inciter l'utilisateur à télécharger l'application?

javascriptiossafarimobile-safarimobile-website
40
Dima Feldman

Voici une solution qui fonctionne pour moi:

var timeout;

function preventPopup() {
    clearTimeout(timeout);
    timeout = null;
    window.removeEventListener('pagehide', preventPopup);
}

function openApp() {    
    $('<iframe />')
    .attr('src', appurl)
    .attr('style', 'display:none;')
    .appendTo('body');

    timeout = setTimeout(function() {
            document.location = appstore;
    }, 500);
    window.addEventListener('pagehide', preventPopup);
}
27
ElizaS

utilisez iframe.

$('<iframe />').attr('src', "appname://").attr('style', 'display:none;').appendTo('body');
5
Kohei Iwasaki

Pour résoudre ce problème et éviter toute alerte de safari iOS souhaitée, j'ai utilisé une autre approche, également un iframe, mais sans événements jquery et listener. Cela fonctionne parfaitement.

    var iframe = document.createElement("iframe");

    iframe.style.border = "none";
    iframe.style.width = "1px";
    iframe.style.height = "1px";
    iframe.onload = function () {
        document.location = alt;
    };
    iframe.src = nativeSchemaUrl; //iOS app schema url

    window.onload = function(){
        document.body.appendChild(iframe);
    }

    setTimeout(function(){
        window.location = fallbackUrl; //fallback url
    },300);
2
akruspe

J'utilise Meta Refresh comme solution de rechange, car cela fonctionne sans javascript. Ce code fonctionne sous iOS et Android.

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta http-equiv="refresh" content="1; url=http://www.facebook.com">
    <title>Redirecting..</title>
    <script>
    function tryOpenApp() {
                var iframe = document.createElement("iframe");
                iframe.style.border = "none";
                iframe.style.width = "1px";
                iframe.style.height = "1px";
                iframe.src = "fb://feed/";
                document.body.appendChild(iframe);
    }
    </script>
  </head>
  <body onload="tryOpenApp()">
  </body>
</html>

Test http://static-pmoretti.herokuapp.com/deep-link/

1
Pablo Moretti