javascript - 我如何在网站上使用 http url fallback 制作跨浏览器 native 应用程序 url？

Question

我需要在用户点击 url 时打开 vk.com、facebook、twitter 应用程序，以防安装此应用程序。

否则，应使用 http url 打开新选项卡。

有现成的解决方案吗？

我需要这个才能在 ios、android 和 windows 设备上工作。

Answer 1

这可以使用 URL 方案来完成。不幸的是，不同的操作系统(ios、android 等)对其移动应用程序响应不同的 URL 方案。因此，首先您必须找出用户使用的是什么设备。这可以通过使用 navigator.userAgent 属性获得:

var ua = window.navigator.userAgent;

ua 变量是一个表示用户信息的字符串，例如他们使用的浏览器。所以你可以使用 String 的 match method 来寻找特定的值:

var IS_IPAD = ua.match(/iPad/i) != null,
    IS_IPHONE = !IS_IPAD && ((ua.match(/iPhone/i) != null) || (ua.match(/iPod/i) != null)),
    IS_IOS = IS_IPAD || IS_IPHONE,
    IS_ANDROID = !IS_IOS && ua.match(/android/i) != null,
    IS_MOBILE = IS_IOS || IS_ANDROID;

既然您知道用户使用的是哪种设备，您就可以使用正确的 URL 方案了。 Android 使用带有 intent:// 前缀的 Intents，IOS 使用格式 appname://parameters。所以，你可以这样做:

if(IS_IOS){
    window.location = "myapp://view?id=123";
}else if(IS_ANDROID){
    window.location = 'intent://view?id=123#Intent;package=my.app.id;scheme=myapp;launchFlags=268435456;end;';
}

您可能需要为 IOS 使用超时(如果未安装应用，Android 将进入 Play 商店)以查看应用是否已加载。如果应用未加载，您可以将窗口位置设置为标准 URL。

这解决了 Android 和 IOS 的问题，但是，它不包括 Windows 移动设备。不过，我确信这是一种类似的方法。我还没有找到任何特定的库来为您抽象和处理这段代码，但它实现起来相当简单。

资源/进一步阅读:

• How to launch apps (facebook/twitter/etc) from mobile browser but fall back to hyperlink if the app isn't installed
• URL schemes for iOS and Android (2/2)