html - 移动网站上的 Facebook URL 方案，如果已安装则打开应用程序，否则转到网页

Question

我正在创建一个共享相同页面的桌面/移动混合网站，也就是我没有用于桌面和移动的两个单独的 URL。我正在尝试让 Facebook 链接在 native Facebook 应用程序中打开，如果可能的话，否则转到常规 URL。 Facebook 计划中有什么东西可以自动处理吗？

基本上，如果未安装移动应用程序或用户使用的是台式机，请转到此处:https://www.facebook.com/pages/[pageid]

如果安装了移动应用程序，请转到此处:

fb://页面/[页面id]

Answer 1

一种简单的方法是 CSS 媒体查询。

显示小设备宽度的 fb://链接。以及用于更大屏幕尺寸的常规 http://链接。

编辑

<a href="https://facebook.com/page" class="large-screen">Clicky</a>
<a href="fb://page/mypage" class="small-screen">Clicky</a>

然后使用 CSS 媒体查询根据屏幕大小 Conceal 其中一个链接。

更新

通过在超时 X 秒后尝试在打开 HTTP URL 后直接打开深层链接 URL，可以使用 javascript 创建更令人满意的用户体验，而不是使用 CSS。

setTimeout(function () { window.location = "https://www.facebook.com"; }, 25);
window.location = "fb://";

HTTP URL 将始终加载，但在深层链接不可用的情况下，尝试打开一个链接将静默失败，退回到网页版本。

来源:https://www.quora.com/How-does-Bitlys-Deep-Linking-detect-if-the-user-already-has-the-app-installed