iPhone:如果未安装应用,则redirect到移动Safari浏览器上的app store

我有一个优化的移动Safari网站上的两个链接。 一个是到App Store的链接来下载我的应用程序。 另一个是启动应用程序button,它使用已注册的应用程序://协议来打开应用程序。 问题是,如果应用程序未安装,则用户单击“启动应用程序”button时,移动Safari会窒息。 是否可以检测注册协议是否可用,如果不可用,请使用适当的URL(如下载应用程序URL)更改Launch Appbutton,以便用户不会遇到恶意popup窗口?

这与这个问题大致相同。 最相关的build议是有一个button试图启动应用程序,同时创build一个计时器,如果没有安装该应用程序,将会触发,如果是的话,Safari会在计时器启动之前退出。

如果您的网页上添加了一个iframesrc设置为您的应用程序的自定义scheme,iOS将自动redirect到应用程序中的该位置。 如果应用程序没有安装,什么都不会发生。 这可以让你深入链接到应用程序,如果它安装,或redirect到App Store,如果没有安装。

例如,如果您安装了twitter应用程序,并导航到包含以下标记的网页,则会立即转到该应用程序。 如果您没有安装Twitter应用程序,则会看到“Twitter应用程序未安装”文本。

 <!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> 

这意味着你可以有一个button指向一个网页,其标记类似于:

 <!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> 

下面是一个可用的代码片段,但并不完美。 您仍然可以看到Safari浏览器的popup窗口,但其他所有function都按预期工作

 <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> 

我已经在这里详细的博客: http : //aawaara.com/post/74543339755/smallest-piece-of-code-thats-going-to-change-the-world