Vérifier si le schéma d'URL est supporté en javascript

Question

Existe-t-il un moyen de vérifier si un schéma d'URL est actuellement enregistré sur le téléphone ... avec JavaScript?

Answer 1

Non, pas à partir d'une page Web.

Answer 2

Pas de manière transparente. Mais il existe un moyen similaire à celui de vérifier si une fenêtre contextuelle a été bloquée ou non.

Lorsque vous essayez un schéma d'URL non pris en charge, Safari avertit l'utilisateur qu'il ne sait pas quoi faire avec et qu'il reste sur la même page.

Donc, si vous avez donné à votre appel d'application le temps de s'activer, disons 300 ms, puis faites quelque chose d'autre pour répondre à la non-existence du schéma.

Ce n'est pas la plus jolie mais ça marche:

function startIThrown(){
  document.location = 'ithrown://restart';
  setTimeout(function(){
    if(confirm('You do not seem to have iThrown installed, do you want to go download it now?')){
      document.location = 'http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=293049283&mt=8&uo=6';
    }
  }, 300);
}

<a href="#" onclick="startIThrown()">Restart iThrown</a>

Answer 3

Voici une solution qui n'affiche pas le popup lorsque vous revenez de l'application, mais suppose que vous êtes parti depuis plus de 400 ms:

function startiThrown() {
    document.location = appurl;
    var time = (new Date()).getTime();
    setTimeout(function(){
        var now = (new Date()).getTime();

        if((now - time)<400) {
            if(confirm('You do not seem to have iThrown installed, do you want to go download it now?')){
            document.location = 'http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=293049283&mt=8&uo=6';
            }
         }
    }, 300);
}

Answer 4

J'ai trouvé que pagehide était plus robuste que dépendre de l'heure du système. Pour ceux d'entre nous qui préfèrent une faveur non-jQuery, voici l'extrait de code.

  var appurl = 'custom://url';
  var appstore = 'https://itunes.apple.com/us/app/your-app';

  var timeout;
  function preventPopup() {
    clearTimeout(timeout);
    timeout = null;
    window.removeEventListener('pagehide', preventPopup);
  }
  function startApp() {
    window.location = appurl;
    timeout = setTimeout(function(){
      if(confirm('You do not seem to have the App installed, do you want to go download it now?')){
        document.location = appstore;
      }
    }, 1000);
    window.addEventListener('pagehide', preventPopup);
  }

Answer 5

Une autre excellente solution (au moins dans les dernières versions du navigateur) consiste à vérifier si la fenêtre du navigateur est activée au bout d’un court délai. Vous pouvez ainsi afficher une boîte de dialogue à l’utilisateur uniquement si le schéma d’URI ne fonctionne pas.

HTML:

<a class="uri-link" data-uri="qobuzapp://" href="#">URI</a>​

Javascript (en utilisant jQuery ici):

var windowHasFocus;

$(window).focus(function() {
  windowHasFocus = true;
}).blur(function() {
  windowHasFocus = false;
});

function goToUri(uri) {
  window.location = uri;
  setTimeout(function(){
    if (windowHasFocus) {
      if (confirm('You do not seem to have Qobuz installed, do you want to go download it now?')){
        window.location = 'http://www.qobuz.com';
      }
    }
  }, 100);
}

$('a').on('click', function(){ 
  goToUri($(this).data('uri')); 
});​

Voici un jsFiddle qui fonctionne, il suffit de le mettre à jour avec votre propre schéma d’URI: http://jsfiddle.net/mF6TZ/

Answer 6

À partir d'iOS 6.0, Apple a présenté les bannières Smart App qui font ce que la plupart d'entre nous recherchent:

• Envoyer sur l'App Store si l'application n'est pas installée.
• Ouvrez l'application avec un lien profond spécifique, à l'aide du paramètre app-argument.

Incluez la balise Meta suivante:

<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">

pris d'ici: Guide du contenu Web de Safari

Answer 7

Voici une variation des 2 solutions précédentes. Cela créera un lien pouvant être ouvert dans Google Chrome. Si cela échoue, il ouvre le lien en utilisant http

<script>
 function checkChrome(h){
  document.location=h;
  var time = (new Date()).getTime();
  setTimeout(function(){
   var now = (new Date()).getTime();
   if((now-time)<400) {
    if(confirm('Missing Chrome. Download it now?')){
     document.location = 'http://itunes.apple.com/us/app/chrome/id535886823?mt=8';
    } else {
     document.location=h.replace('googlechrome','http');
    }
   }
  }, 300);
 }
</script>

<a href="googlechrome://www.google.com" onclick="checkChrome(this.href);return false;">Open Google with Chrome</a>

Answer 8

Ceci est basé sur la réponse de mrahman. Comme indiqué par JoshNaro, new Date () renvoie une mauvaise date lorsqu'il est appelé dans le délai imparti. Les tests suggèrent que la date n'est pas mise à jour dans les threads démarrés avant la désactivation de l'application.

Un autre setTimeout moche appelé après l'activation créera un nouveau thread avec la date du jour.

Ceci a été testé sur iOS 8.

function startiThrown() {
    document.location = appurl;
    var time = (new Date()).getTime();
    setTimeout(function(){
        setTimeout(function(){ // <-- start new thread after activation
            var now = (new Date()).getTime();
            if((now - time)<400) {
                if(confirm('You do not seem to have iThrown installed, do you want to go download it now?')){
                    document.location = 'http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=293049283&mt=8&uo=6';
                }
            }
        }, 10); // <-- start new thread after activation
    }, 300);
}

Answer 9

J'essaie d'utiliser uniquement l'événement 'pagehide', mais cela ne fonctionne pas dans Firefox. J'ai créé cette version ici http://jsfiddle.net/thiagomata/6tvoc4f1/2/ quoi fonctionne dans Firefox, Google Chrome et Safari. Je n'ai pas encore testé Internet Explorer.

Une chose nécessaire pour que Firefox fonctionne est d'utiliser Iframe pour définir le code source. Cela me permet d'appeler l'application sans quitter ma page.

<a class="uri-link" href="#" 
  data-uri-app="myapp://" 
  data-url-app-not-found="http://www.google.com?q=not-found-link"
  >
  Example 1
</a>​
<a class="uri-link" href="#" 
  data-uri-app="myapp://" 
  data-url-app-not-found="http://www.google.com?q=not-found-link"
  data-url-app-found="http://www.google.com?q=found-link"
  >
  Example 2
</a>​
<a class="uri-link"  href="#"
  data-uri-app="notexists://" 
  data-url-app-not-found="http://www.google.com?q=not-exists"
>
  Example 3
</a>​
<iframe id="callapp" style="display:none"></iframe>

Answer 10

J'ai ce commentaire https://stackoverflow.com/a/18715513/49114 avec un plugin jQuery à ajouter lien d'application alternatif vers des liens réguliers.