2011-04-15 13 views
9

Tengo dos enlaces en un sitio web optimizado de Safari móvil. Uno es un enlace a la App Store para descargar mi aplicación. El otro es un botón Iniciar aplicación que usa el protocolo de la aplicación registrada: // para abrir la aplicación. El problema es que el Safari móvil se bloquea cuando el usuario hace clic en el botón Iniciar aplicación si la aplicación no está instalada. ¿Es posible detectar si el protocolo registrado está disponible y, de no ser así, cambiar el botón Iniciar aplicación con una URL adecuada, como la URL de la aplicación de descarga, para que el usuario no reciba una ventana emergente desagradable?iPhone: redirigir a la tienda de aplicaciones en el safari móvil si la aplicación no está instalada

Respuesta

4

Esto es muy similar a this question; las sugerencias más relevantes son tener un solo botón que intente iniciar la aplicación, creando simultáneamente un temporizador que se activará si la aplicación no se instala con el argumento de que si fuera así, Safari habría salido antes de que se dispare el temporizador.

1

A continuación se muestra un fragmento de código que funciona, pero no es perfecto. Sigue viendo el emergente safari, pero todo lo demás funciona como se espera:

<script type="text/javascript"> 
    var timer; 
    var heartbeat; 
    var lastInterval; 

    function clearTimers() { 
     clearTimeout(timer); 
     clearTimeout(heartbeat); 
    } 

    window.addEventListener("pageshow", function(evt){ 
     clearTimers(); 
    }, false); 

    window.addEventListener("pagehide", function(evt){ 
     clearTimers(); 
    }, false); 

    function getTime() { 
     return (new Date()).getTime(); 
    } 

    // For all other browsers except Safari (which do not support pageshow and pagehide properly) 
    function intervalHeartbeat() { 
     var now = getTime(); 
     var diff = now - lastInterval - 200; 
     lastInterval = now; 
     if(diff > 1000) { // don't trigger on small stutters less than 1000ms 
      clearTimers(); 
     } 
    } 

    function launch_app_or_alt_url(el) { 
     lastInterval = getTime(); 
     heartbeat = setInterval(intervalHeartbeat, 200); 
     document.location = 'myapp://customurl'; 
     timer = setTimeout(function() { 
      document.location = 'http://alternate.url.com'; 
     }, 2000); 
    } 

    $(".source_url").click(function(event) { 
     launch_app_or_alt_url($(this)); 
     event.preventDefault(); 
    }); 
</script> 

he blogged acerca de los detalles aquí: http://aawaara.com/post/74543339755/smallest-piece-of-code-thats-going-to-change-the-world

3

Si agrega una iframe en su página web con la src conjunto de esquema personalizado para su aplicación, iOS redirigirá automáticamente a esa ubicación en la aplicación. Si la aplicación no está instalada, no pasará nada. Esto le permite realizar un enlace profundo a la aplicación si está instalada, o redireccionar a la tienda de aplicaciones si no está instalada.

Por ejemplo, si tiene instalada la aplicación de Twitter y navega a una página web que contiene el siguiente marcado, se lo dirigirá inmediatamente a la aplicación. Si no tiene instalada la aplicación Twitter, verá el texto "La aplicación Twitter no está instalada".

<!DOCTYPE html> 
<html> 
    <head> 
    <title>iOS Automatic Deep Linking</title> 
    </head> 
    <body> 
     <iframe src="twitter://" width="0" height="0"></iframe> 
     <p>The Twitter App is not installed</p> 
    </body> 
</html> 

Esto significa que usted podría tener un solo botón que dirige a una página web con el formato similar a este:

<!DOCTYPE html> 
<html> 
    <head> 
    <title>iOS Automatic Deep Linking</title> 
    <script src='//code.jquery.com/jquery-1.11.2.min.js'></script> 
    <script src='//mobileesp.googlecode.com/svn/JavaScript/mdetect.js'></script> 
    <script> 
     (function ($, MobileEsp) { 
     // On document ready, redirect to the App on the App store. 
     $(function() { 
      if (typeof MobileEsp.DetectIos !== 'undefined' && MobileEsp.DetectIos()) { 
      // Add an iframe to twitter://, and then an iframe for the app store 
      // link. If the first fails to redirect to the Twitter app, the 
      // second will redirect to the app on the App Store. We use jQuery 
      // to add this after the document is fully loaded, so if the user 
      // comes back to the browser, they see the content they expect. 
      $('body').append('<iframe class="twitter-detect" src="twitter://" />') 
       .append('<iframe class="twitter-detect" src="itms-apps://itunes.com/apps/twitter" />'); 
      } 
     }); 
     })(jQuery, MobileEsp); 
    </script> 
    <style type="text/css"> 
     .twitter-detect { 
     display: none; 
     } 
    </style> 
    </head> 
    <body> 
    <p>Website content.</p> 
    </body> 
</html> 
+0

Esto funciona en iOS7, pero no parece que trabajar en ios8. Puedo llamar a cualquier otra URL de la aplicación excepto itms: // o itms-app: //. Funciona en ios7. ¿Tiene esto que ver con que Apple impulse el uso de banners inteligentes en lugar de redirigir automáticamente a la tienda de aplicaciones? – SuperDuperTango

Cuestiones relacionadas