如何使用Phonegap打开Twitter和Facebook应用程序?

时间:2014-04-15 22:45:09

标签: javascript android facebook cordova twitter

我正在尝试使用我的PhoneGap应用程序链接在Twitter应用程序中打开特定的用户个人资料页面。我知道不是每个人都在他们的设备上安装了Twitter应用程序,所以我想将它们发送到Play商店下载它,如果他们没有。

问题是我每次点击Android设备上的链接时都会收到错误消息:

Application Error:

net::ERR_UNKNOWN_URL_SCHEME(twitter://user?screen_name=xerxesnoble)

我的JavaScript如下:

//If Android

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf("android") > -1; //&& ua.indexOf("mobile");

if (isAndroid) {

    alert('Android!');

    twitterCheck = function() {
        alert('Android!');
        var now = new Date().valueOf();

        setTimeout(function () {
            if (new Date().valueOf() - now > 100) return;
            window.open('https://play.google.com/store/apps/details?id=com.twitter.android', '_system', 'location=no');
        }, 50);

    window.open('twitter://user?screen_name=XerxesNoble', '_system', 'location=no');
    };
};

$('.twiterNav').click(function() {
     window.open('twitter://user?screen_name=xerxesnoble', '_system', 'location=no');
});

我尝试过的事情:

  • 使用twitter:///代替twitter://
  • <access origin="twitter://user?screen_name=xerxesnoble" />添加到我的config.xml

我不确定还有什么可以尝试,Facebook也没有任何工作,但是现在我一直关注一个问题。

2 个答案:

答案 0 :(得分:15)

问题是没有安装InAppBrowser插件。新版本的PhoneGap / Cordova没有安装所有插件 - 而是选择您希望应用程序访问的内容。

在终端cd yourApp$ cordova plugin add org.apache.cordova.inappbrowser

这样做之后,它完美无缺。

修改

关于我如何获得我的.js来检查是否安装了twitter,只是为了分析一下。

我安装了另一个插件:AppAvailability for iOS and Android

然后我改变了我的.js看起来像这样:

//Twitter checker

// If Mac//

var twitterCheck = function(){

appAvailability.check('twitter://', function(availability) {
    // availability is either true or false
    if(availability) { window.open('twitter://user?screen_name=xerxesnoble', '_system', 'location=no');}
    else{window.open('https://itunes.apple.com/ca/app/twitter/id333903271?mt=8', '_system', 'location=no'); };
});
};

//If Android

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf("android") > -1; //&& ua.indexOf("mobile");

if(isAndroid) {

twitterCheck = function(){    

appAvailability.check('com.twitter.android', function(availability) {
    // availability is either true or false
    if(availability) {window.open('twitter://user?screen_name=xerxesnoble', '_system', 'location=no');}
    else{window.open('https://play.google.com/store/apps/details?id=com.twitter.android', '_system', 'location=no');};
});
};
};

AppAvailability插件中提供的文档非常有用&gt;

希望这有助于某人!

答案 1 :(得分:4)

仅为其他可能来到这里并想要更多的人提供参考:

我已经能够在iOS和Android上运行良好(到目前为止),并使用下面的代码动态地回退到浏览器。

必需的插件有cordova-plugin-inappbrowsercordova-plugin-appavailability

function openBrowser (url) {
    if (!url) {
        return;
    }

    // turn my url into a scheme/intent url
    getAvailabilityScheme(url, function (url) {
        window.open(url, '_system');
    });
}

function getAvailabilityScheme (url, callback) {
    var schemeOrPackage;
    var schemeUrl;

    // check for appavaialbility plugin
    if (!window.appAvailability) {
        callback(url);
    }

    // facebook
    if (url.indexOf('facebook.com/') !== -1) {
        schemeOrPackage = isAndroid ? 'com.facebook.katana' : 'fb://'
        schemeUrl = 'fb://profile/' + url.split('facebook.com/')[1];
    }

    // twitter
    if (url.indexOf('twitter.com/') !== -1) {
        schemeOrPackage = isAndroid ? null : 'twitter://'
        schemeUrl = 'twitter://user?screen_name=' + url.split('twitter.com/')[1];
    }

    if (schemeOrPackage && schemeUrl) {
        window.appAvailability.check(schemeOrPackage, function () {
            callback(schemeUrl);
        }, function () {
            callback(url);
        });
    } else {
        callback(url);
    }
}

使用它很简单,只需使用普通网站网址调用openBrowser(url)方法即可。我发现的唯一问题是,对于Facebook页面,它需要一个ID而不是slug名称