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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/22275174/
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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 01:11:11  来源:igfitidea点击:

Facebook URL schemes on a mobile website, open app if its installed, otherwise go to the webpage

htmlfacebookmobile-website

提问by user1795832

I am creating a hybrid desktop/mobile website that all share the same pages, aka I do not have two separate URLs for desktop and mobile. I am trying to get Facebook links to open in the native Facebook app, if possible, otherwise go to the regular URL. Is there something out there in the Facebook schemes that handles that automatically?

我正在创建一个混合桌面/移动网站,它们都共享相同的页面,也就是我没有桌面和移动两个单独的 URL。如果可能的话,我试图让 Facebook 链接在本机 Facebook 应用程序中打开,否则请转到常规 URL。Facebook 计划中是否有一些可以自动处理的内容?

Basically, if mobile app is not installed or if the user is on a desktop, go here: https://www.facebook.com/pages/[pageid]

基本上,如果未安装移动应用程序或用户在桌面上,请访问:https://www.facebook.com/pages/[pageid]

If mobile app is installed, then go here:

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

fb://page/[pageid]

fb://page/[pageid]

回答by Connor Finn McKelvey

A Simple way would be CSS Media Queries.

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

Show the fb:// link for small device widths. and a regular http:// link for larger screen sizes.

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

EDIT

编辑

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

Then using CSS Media queries hide one of the links depending on the size of the screen.

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

UPDATE

更新

Instead of using CSS a more satisfying user experience can be created with javascript by attempting to open the deep link URL directly after opening the HTTP URL after X seconds in a timeout.

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

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

The HTTP URL will always load, but in the case that deep links are not available, attempting to open one will silently fail, falling back to the web version.

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

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

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