为什么这种深层链接(applink),被Facebook产生不工作? [英] Why this deep link (applink), generated by facebook does not work?

查看:1767
本文介绍了为什么这种深层链接(applink),被Facebook产生不工作?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想使我的网站上的一个按钮,这将允许用户打开原生的Facebook应用程序(如果已安装),或打开Facebook的网站,否则。我的理解,我必须为创建单独的HTML页面。

我想Facebook的托管应用程序的链接,以获得工作应用程序链接的例子。继code是由Facebook的生成,可以通过访问此网址

我曾尝试打开与iOS(Safari浏览器,Chrome浏览器),机器人(默认浏览器,Chrome浏览器)这个链接。尽管我已经安装了两台设备上的Facebook应用程序,我重定向到Facebook的网站。

为什么会发生?我怎样才能使它打开本机应用程序?

 < HTML>
    < HEAD>
        <冠军>应用链接< /标题>
        <元属性=FB:APP_IDCONTENT =505860159524932/>
        <元属性=人:IOS:URLCONTENT =FB://资料/ 838619192839881/>
        <元属性=人:IOS:APP_NAMECONTENT =脸谱/>
        <元属性=人:IOS:app_store_idCONTENT =284882215/>
        <元属性=人:安卓包内容=com.facebook.katana/>
        <元属性=人:机器人:APP_NAMECONTENT =脸谱/>
        <元属性=人:机器人:URLCONTENT =FB://页/ 838619192839881/>
        <元属性=人:网址:should_fallbackCONTENT =FALSE/>
        <元属性=人:网址:网址CONTENT =htt​​ps://www.facebook.com/warpcompany/>
        < META HTTP-当量=刷新内容=0; URL = HTTPS://www.facebook.com/warpcompany/>
    < /头>
    <身体GT;重定向...< /身体GT;
< / HTML>
 

解决方案

AppLinks是一种协议,它只是Facebook的原生支持。这意味着,只有Facebook的Andr​​oid和iOS的原生应用程序将正确地解析了元标记,并采取行动。所有其他浏览器和平台忽略它们。

为了妥善处理联在其他浏览器中,使用客户端的JS重定向code除了AppLinks支持重定向在其他浏览器。如果你不想要建立出这一切,我建了一个免费的工具,称为 branch.io 将承载您的联系与这个客户端JS加自动配置AppLinks。

如果你宁愿建立它自己,这里的code可用于iOS的Safari浏览器:

 <脚本类型=文/ JavaScript的>
    在window.onload =功能(){
        的document.getElementById(L)SRC =FB://页/ 838619192839881。

        的setTimeout(函数(){
            了window.location =ITMS-应用程序://itunes.apple.com/app/id284882215;
        },750);
    };
< / SCRIPT>
< IFRAME ID =L宽度=1高度=1的风格=能见度:隐藏>< / IFRAME>
 

和Android版,您可以使用此客户端JS code片断:

 <脚本类型=文/ JavaScript的>
    在window.onload =功能(){
        VAR方法='IFRAME';
        VAR fallbackFunction =功能(){
            如果(方法=='IFRAME'){
                了window.location =?市场://细节ID = com.facebook.katana;
            }
        };
        VAR addIFrame =功能(){
            VAR的iframe = document.createElement方法(IFRAME);
            iframe.style.border =无;
            iframe.style.width =1px的;
            iframe.style.height =1px的;
            iframe.src =FB://页/ 838619192839881;
            document.body.appendChild(IFRAME);
        };
        VAR loadChromeIntent =功能(){
            方法='意图';
            document.location =意图://页/ 838619192839881#意向,计划= FB;包= com.facebook.katana;末;
        };
        如果(navigator.userAgent.match(/镀铬/)及和放大器;!navigator.userAgent.match(版/)){
            loadChromeIntent();
        }
        否则,如果(navigator.userAgent.match(/火狐/)){
            了window.location =FB://页/ 838619192839881;
        }
        其他 {
            addIFrame();
        }
        的setTimeout(fallbackFunction,750);
    };
< / SCRIPT>
 

I want to make a button on my website, that will allow user to open native facebook app (if it is installed), or open facebook website otherwise. As i understood, i have to create separate html page for that.

I tried facebook hosted app links to get working App Links example. Following code was generated by facebook, it can be accessed by this url.

I have tried to open this link with iOS (Safari, Chrome), Android (default browser, Chrome). Despite i have facebook app installed on both devices, i am redirected to facebook website.

Why does it happen? How i can make it open native apps?

<html>
    <head>
        <title>App Link</title>
        <meta property="fb:app_id" content="505860159524932" />
        <meta property="al:ios:url" content="fb://profile/838619192839881" />
        <meta property="al:ios:app_name" content="Facebook" />
        <meta property="al:ios:app_store_id" content="284882215" />
        <meta property="al:android:package" content="com.facebook.katana" />
        <meta property="al:android:app_name" content="Facebook" />
        <meta property="al:android:url" content="fb://page/838619192839881" />
        <meta property="al:web:should_fallback" content="false" />
        <meta property="al:web:url" content="https://www.facebook.com/warpcompany" />
        <meta http-equiv="refresh" content="0;url=https://www.facebook.com/warpcompany" />
    </head>
    <body>Redirecting...</body>
</html>

解决方案

AppLinks are a protocol that only Facebook native supports. This means that only the Facebook native apps for Android and iOS will properly parse the metatags and take action. All other browsers and platforms ignore them.

In order to properly handle linking in other browsers, you use the client side JS redirection code in addition to AppLinks to support redirection in other browsers. If you don't want to build this all out, I built a free tool called branch.io that will host your links with this client side JS plus auto-configure your AppLinks.

If you'd rather build it yourself, here's the code you can use for iOS safari:

<script type="text/javascript">
    window.onload = function() {
        document.getElementById("l").src = "fb://page/838619192839881";

        setTimeout(function() {
            window.location = "itms-apps://itunes.apple.com/app/id284882215";
        }, 750);
    };
</script>
<iframe id="l" width="1" height="1" style="visibility:hidden"></iframe>

And for Android, you can use this client side JS code snippet:

<script type="text/javascript">
    window.onload = function() {
        var method = 'iframe';
        var fallbackFunction = function() {
            if (method == 'iframe') {
                window.location = "market://details?id=com.facebook.katana";
            }
        };
        var addIFrame = function() {
            var iframe = document.createElement("iframe");
            iframe.style.border = "none";
            iframe.style.width = "1px";
            iframe.style.height = "1px";
            iframe.src = "fb://page/838619192839881";
            document.body.appendChild(iframe);
        };
        var loadChromeIntent = function() {
            method = 'intent';
            document.location = "intent://page/838619192839881#Intent;scheme=fb;package=com.facebook.katana;end";
        };
        if (navigator.userAgent.match(/Chrome/) && !navigator.userAgent.match("Version/")) {
            loadChromeIntent();
        }
        else if (navigator.userAgent.match(/Firefox/)) {
            window.location = "fb://page/838619192839881";
        }
        else {
            addIFrame();
        }
        setTimeout(fallbackFunction, 750);
    };
</script>

这篇关于为什么这种深层链接(applink),被Facebook产生不工作?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆