如何使用 ngCordova facebook 插件？

Question

我正在尝试在我的 ionic 应用程序中开发 facebook 登录。我想使用 ngCordova Facebook 插件，并按照那里的说明进行操作，但收到错误消息：facebook connect plugin is not defined。

我该怎么办？我已按照 Android 的说明进行操作，并且我的应用是基于离子的。

Answer 1

您可以使用这篇详细的文章 - OAuth with Ionic and ngCordova

或者添加指向您正在使用的文档的链接并指定您停止的步骤？

你关注过这个guide吗？

编辑：好的，我检查我的源代码。我没有使用任何依赖于 SDK 的插件。 我正在使用轻量级库OpenFB。我按照自述文件中介绍的步骤操作，并在我的 ionic 应用程序中登录了 fb。

EDIT2：顺便说一句，我尝试过使用 ngCordova 包装器（我将它添加到我的答案的第一个版本）相同的结果。

我还以为你错过了什么......可能你没有添加到 facebookConnectPlugin.js 的链接？

我的 index.html 页面：

<script src="js/facebookConnectPlugin.js"></script>
<script src="js/ng-cordova.js"></script>
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>

<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>

控制器：

.controller('DashCtrl', function ($scope, $cordovaFacebook) {
    $scope.getLoginStatus = function () {
        $cordovaFacebook.getLoginStatus().then(function (status) {
            $scope.status = status;
        }, function (error) {
            $scope.status = error;
        })
    };
    $scope.login = function () {
        $cordovaFacebook.login(["public_profile"]).then(function (success) {
            $scope.loginInfo = success;
        }, function (error) {
            $scope.error = error;
            alert(error);
        })
    };
    $scope.logout = function () {
        $cordovaFacebook.logout().then(function (success) {
            console.log(success);
        }, function (error) {
            $scope.error = error;
            alert(error);
        })
    };
    $scope.getMe = function () {
        $scope.me = ["refreshing..."];
        $cordovaFacebook.api("me", null).then(function (success) {
            $scope.me = success;
        }, function (error) {
            $scope.error = error;
        })
    };
})

查看：

<button class="button button-block button-positive" ng-click="login()">Login</button>
<h5>Login info</h5>
<div ng-repeat="info in loginInfo">{{info}}</div>
<div class="card">
    <div class="item item-divider">Login Info</div>
    <div class="item" ng-repeat="info in loginInfo">{{info}}</div>
</div>
<button class="button button-block button-dark" ng-click="getLoginStatus()">Check Login Status</button>
<div class="card">
    <div class="item item-divider">Login Status</div>
    <div class="item" ng-repeat="info in status">{{info}}</div>
</div>
<button class="button button-block button-energized" ng-click="getMe()">API - get Me</button>
<h5>Api Me info</h5>
<div class="card">
    <div class="item item-divider">Api Me info</div>
    <div class="item" ng-repeat="info in me">{{info}}</div>
</div>
<button class="button button-block button-assertive" ng-click="logout()">Logout</button>

如果没有帮助 - 我明天会将我的源代码放在 github 上。