Javascript 如何从移动浏览器启动应用程序(facebook/twitter/etc)但如果未安装应用程序则退回到超链接
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13675535/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to launch apps (facebook/twitter/etc) from mobile browser but fall back to hyperlink if the app isn't installed
提问by Chase Florell
I am hoping there might be some way of detecting whether or not an uri:scheme is registered on a mobile device from within the browser.
我希望可能有某种方法可以从浏览器中检测 uri:scheme 是否已在移动设备上注册。
IE: I'd like to check if the facebook, twitter, pinterest apps are installed and can be launched from their associated uri:scheme.
IE:我想检查一下 facebook、twitter、pinterest 应用程序是否已安装并且可以从它们关联的 uri:scheme 启动。
if(fb_isInstalled) {
// href="fb://profile/...."
} else {
// href="http://m.facebook.com/..."
}
Basically if the user has installed facebook, then launch the app, but fall back to the mobile version of the fb website if the app is not installed.
基本上,如果用户安装了 facebook,则启动该应用程序,但如果未安装该应用程序,则退回到 fb 网站的移动版本。
采纳答案by Chase Florell
I think I've got a working solution.
我想我有一个可行的解决方案。
<!-- links will work as expected where javascript is disabled-->
<a class="intent"
href="http://facebook.com/someProfile"
data-scheme="fb://profile/10000">facebook</a>
And my javascript works like this.
note: there's a little jQuery mixed in there, but you don't need to use it if you don't want to.
我的 javascript 是这样工作的。
注意:其中混入了一些 jQuery,但如果您不想使用它,则无需使用它。
(function () {
// tries to execute the uri:scheme
function goToUri(uri, href) {
var start, end, elapsed;
// start a timer
start = new Date().getTime();
// attempt to redirect to the uri:scheme
// the lovely thing about javascript is that it's single threadded.
// if this WORKS, it'll stutter for a split second, causing the timer to be off
document.location = uri;
// end timer
end = new Date().getTime();
elapsed = (end - start);
// if there's no elapsed time, then the scheme didn't fire, and we head to the url.
if (elapsed < 1) {
document.location = href;
}
}
$('a.intent').on('click', function (event) {
goToUri($(this).data('scheme'), $(this).attr('href'));
event.preventDefault();
});
})();
I also threw this up as a gistthat you can fork and mess with. You can also include the gistin a jsfiddle if you so choose.
我也把它作为一个要点,你可以分叉和弄乱。如果您愿意,您还可以将要点包含在 jsfiddle 中。
Edit
编辑
@kmalleaforked the gist and radically simplified it. https://gist.github.com/kmallea/6784568
@kmallea分叉了要点并从根本上简化了它。 https://gist.github.com/kmallea/6784568
// tries to execute the uri:scheme
function uriSchemeWithHyperlinkFallback(uri, href) {
if(!window.open(uri)){
window.location = href;
}
}
// `intent` is the class we're using to wire this up. Use whatever you like.
$('a.intent').on('click', function (event) {
uriSchemeWithHyperlinkFallback($(this).data('scheme'), $(this).attr('href'));
// we don't want the default browser behavior kicking in and screwing everything up.
event.preventDefault();
});

