检查在JavaScript中是否支持URLscheme
有没有什么办法来检查一个URLscheme是否目前在手机上注册…使用JavaScript?
不,不是来自网页。
不是无缝的。 但有一种方法类似于检查popup窗口是否被阻止。
当您尝试不支持的URLscheme时,Safari会警告用户不知道如何处理,并保持在同一页面上。
所以,如果你给你的应用程序调用一些时间来激活,比如说300毫秒,然后做一些其他的事情来回应scheme的不存在。
这不是最漂亮的,但它的工作原理:
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>
这是一个解决scheme,当你从应用程序回来时不显示popup窗口,它假定你已经走了超过400毫秒:
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); }
我发现pagehide
事件比取决于系统时间更强大。 对于我们这些喜欢非jQuery的人来说,这里是代码片断。
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); }
从iOS 6.0开始,苹果公司推出了Smart App Banners,它们可以满足我们大多数人的需求:
- 如果应用程序没有安装,请发送到App Store。
- 使用应用参数参数打开具有特定深层链接的应用。
包含以下元标记:
<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">
从这里获取: Safari网页内容指南
另一个很好的(至less在最新的浏览器版本中)解决方法是在短暂的超时后检查浏览器窗口是否有焦点,这样,只有当URIscheme不起作用时,才能向用户显示一个对话框
HTML:
<a class="uri-link" data-uri="qobuzapp://" href="#">URI</a>
Javascript(在这里使用jQuery):
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')); });
这里是一个工作jsFiddle,只需使用自己的URIscheme进行更新: http : //jsfiddle.net/mF6TZ/
这是前两个解决scheme的变化。 它会创build一个可以在Google Chrome中打开的链接。 如果失败,则使用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>
这是基于mrahman的回答。 如前所述,由JoshNaro 新Date()在超时时间内调用返回错误的date。 testing表明date未在应用程序停用之前启动的线程中更新。
激活之后调用的另一个丑陋的setTimeout将会创build一个包含当前date的新线程。
这是在iOS 8上testing的。
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); }
我尝试只使用“页面隐藏”事件,但它不适用于Firefox。 我在这里创build了这个版本http://jsfiddle.net/thiagomata/6tvoc4f1/2/什么在Firefox,谷歌浏览器和Safari的作品。; 我还没有在Internet Explorer中testing过。
有一件事需要使其工作到Firefox,是使用iframe来设置src。 这使我可以在不离开我的页面的情况下调用应用程序。
<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>