如何在我的科尔多瓦应用程序中为 Facebook 页面点赞?

Posted

技术标签:

【中文标题】如何在我的科尔多瓦应用程序中为 Facebook 页面点赞?【英文标题】:How can I like a facebook page in my cordova app? 【发布时间】:2014-05-28 13:53:53 【问题描述】:

实际上,我需要像在我的 cordova ios 应用程序中那样实现 FB。所以我在我的科尔多瓦应用程序中包含了Cordova FB connect 插件。我使用了以下代码。

<div class="fb-like" data-href="https://www.facebook.com/testentertainer" data-layout="button" data-action="like" data-show-faces="false" data-share="false"></div>

它正在创建一个喜欢的按钮,它很好。当我第一次点击喜欢按钮时,它会弹出 fb 登录页面。输入凭据请求后不会返回我的页面。它显示白色的空白页面,应用程序自行挂在那里。如果我重新打开我的应用程序,那么我会喜欢,因为我已经登录。现在喜欢和不同的功能正在工作,但我无法获得这些事件的回调。

我试过了

FB.Event.subscribe('edge.create', function(href, widget) 
       console.log("in edge create");
       alert('You just liked the page!');
);
FB.Event.subscribe('edge.remove', function(href, widget) 
       alert('You just unliked the page!');
);

但它不起作用。

FIDDLE

【问题讨论】:

【参考方案1】:

Facebook 登录页面是弹出窗口还是打开 Facebook 应用程序?如果是弹出窗口,则必须先安装 InAppBrowser 插件。

【讨论】:

我只使用inappbrowser。 检查 cordova_plugins.js 是否引用了正确的 InAppBrowser.js 文件。 我正在使用 oauthio 插件进行社交登录。这仅使用 inappbrowser。它对该插件的工作真棒。但它不适用于 fb 登录按钮。【参考方案2】:

同样的事情发生在我身上,这很烦人,似乎 fb sn-p 不能很好地与 inappbroswer 配合使用,但是现在没有浪费更多时间我正在利用图形 api,因为我正在制作一个angular(还有打字稿)应用程序我已经为 Facebook 做出了一个指令,并从那里处理事件

 <facebook-like url="vm.currentUrl"></facebook-like>

指令模板

 <div ng-switch="vm.likeStatus">
<div ng-switch-when="like" ng-click="vm.setLike(true)">

    <span class="fbLike"><img src="content/images/like.png" class="img-responsive"/></span>
</div>
<div ng-switch-when="unlike" >
    <span ng-click="vm.setLike(false)">

        <span class="fbLiked"><img src="content/images/liked.png" class="img-responsive" /></span>
    </span>

</div>
<div ng-switch-when="loading"><img src="content/images/loader.gif" class="img-responsive" /></div>
<div ng-switch-when="login" ng-click="vm.login()">login</div>
<div ng-switch-default></div>
</div>

指令定义

 namespace portal.directives 

export class facebookLike 

    constructor() 
        let directive: ng.IDirective = <ng.IDirective>;
        directive.restrict = 'E';
        directive.scope = 
            url:"@"
        ;
        directive.templateUrl = "views/directives/facebookLike.html";
        directive.controller = 'facebookLikeController';
        return directive;

      
   

指令控制器

   namespace portal.controllers 

export class facebookLikeController 

    public likeStatus: string;
    public postId: string;
    public setLike = (value: boolean) => 
        this.likeStatus = "loading";

        if (value) 
            this.facebookService.setLike(this.$scope.url).then((postId) => 
                this.likeStatus = 'unlike';
                this.postId = postId;
            );
        
        else 
            this.facebookService.setUnlike(this.postId).then(() => 
                this.likeStatus = 'like';
                this.postId = void 0;
            );
        
    ;
    public login = () => 
        this.userService.socialLogin(socialProviders.facebook).then(() => 
            this.$state.forceReload();
        );
    ;

    static $inject = ['$element', '$scope', 'facebookService', 'userService', '$state','localStorageHandler'];
    constructor(public $element: JQuery, public $scope, public facebookService: services.facebookService, public userService: services.userService, public $state, localStorageHandler) 

        facebookService.isObjectLiked($scope.url).then((res) => 
            this.likeStatus = res ? 'unlike' : 'like'; // if object is like then show unlike button and vice versa
            this.postId = res;
        , () => 
            //user is not logged in via facebook,may be via other carrier
            let tokenDetails: IUser = localStorageHandler.get(storageNames.socialLoginDetails);
            if (!tokenDetails)
                this.likeStatus = 'login';
            );

        $scope.vm = this;

     
    
 

脸书服务

   export class facebookService 

          public fireGraphApi = (endPoint, verb): ng.IPromise<any>=> 

        let config: IRequestConfig = 
            method: verb,
            url: "https://graph.facebook.com/v2.4/" + endPoint,
            showLoader: false
        

        return this.$http(config).then((res: any) => 
            return res.data;
        );


    ;

    get isUserLoggedIn(): ng.IPromise<any> 
        let tokenDetails: IUser = this.localStorageHandler.get(storageNames.socialLoginDetails);
        if (tokenDetails && tokenDetails.social_provider == socialProviders.facebook) 
            let url = "me?access_token=" + tokenDetails.access_token;
            return this.fireGraphApi(url, 'GET');
        
        else
            return this.$q.reject();
    

    public isObjectLiked = (objectUrl: string): ng.IPromise<any> => 
        let def = this.$q.defer();
        let tokenDetails: IUser = this.localStorageHandler.get(storageNames.socialLoginDetails);
        this.isUserLoggedIn.then(() => 
            //user is logged in 
            let url = "me/og.likes?access_token=" + tokenDetails.access_token + '&object=' + objectUrl;
            this.fireGraphApi(url, 'GET').then((res) => 
                if (res && res.data.length == 0) 
                    // not yet liked
                    def.resolve(void 0);
                
                else 
                    //liked and show unlike button                     
                    def.resolve(res.data[0].id);
                

            );
        , () => 
            //rejected when user not logged in 
            def.reject();
        );

        return def.promise;
    ;


    public setLike = (objectUrl: string): ng.IPromise<string> => 
        return this.isUserLoggedIn.then(() => 
            let url: string;
            let tokenDetails: IUser = this.localStorageHandler.get(storageNames.socialLoginDetails);
            url = "me/og.likes?access_token=" + tokenDetails.access_token + '&object=' + objectUrl;

            return this.fireGraphApi(url, 'POST').then((res) => 
                return res.id;
            );
        );
    ;

    public setUnlike = (postId: string): ng.IPromise<any> => 
        return this.isUserLoggedIn.then(() => 
            let url: string;
            let tokenDetails: IUser = this.localStorageHandler.get(storageNames.socialLoginDetails);           
                url = postId + "?access_token=" + tokenDetails.access_token;

            return this.apiService.fireGraphApi(url, "DELETE").then((res) => 
                return res;
            );
        );
    


    static $inject = ['$http', '$q', 'localStorageHandler', 'apiService'];
    constructor(public $http, public $q, public localStorageHandler: services.localStorageHandler, public apiService: services.apiService) 

        
   

【讨论】:

以上是关于如何在我的科尔多瓦应用程序中为 Facebook 页面点赞?的主要内容,如果未能解决你的问题,请参考以下文章

Phonegap 科尔多瓦 2.3.0 phonegap-facebook-plugin

在我的 android 应用程序中为社区公开使用 Facebook,而不在 Playstore 上发布它

如何让本地通知插件在我的科尔多瓦应用程序上工作?

Facebook Openfb 科尔多瓦

科尔多瓦:android 4.1 中的 facebook 登录错误“为 facebook 登录配置错误”

登录表单中的 IoS 自动填充数据在科尔多瓦应用程序中为空(使用角度)