facebookConnectPlugin未定义(ngCordova,Ionic app)

时间:2015-01-12 16:12:17

标签: angularjs cordova ionic

我试图将原生fb连接添加到我的离子应用程序。

我正在使用: - 离子 - ngCordova - http://ngcordova.com/docs/plugins/facebook/

这是我的代码:

angular.module('starter.controllers', ['ngCordova'])

.config(function($cordovaFacebookProvider) {
var appID = 123456789;
var version = "v2.0"; // or leave blank and default is v2.0
$cordovaFacebookProvider.browserInit(appID, version);
})

导致此错误>

Uncaught Error: [$injector:modulerr] Failed to instantiate module starter due to:
Error: [$injector:modulerr] Failed to instantiate module starter.controllers due to:
ReferenceError: facebookConnectPlugin is not defined
at browserInit (http://localhost:8100/lib/ngCordova/dist/ng-cordova.js:1576:7)
at http://localhost:8100/js/controllers.js:6:30
at Object.invoke (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11994:17)
at runInvokeQueue (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11900:35)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:11909:11
at forEach (http://localhost:8100/lib/ionic/js/ionic.bundle.js:8147:20)
at loadModules (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11890:5)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:11907:40
at forEach (http://localhost:8100/lib/ionic/js/ionic.bundle.js:8147:20)
at loadModules (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11890:5)

尝试了几件事,但没有任何积极的结果: - 当我构建它并在我的设备上运行时,应用程序显示一个空白屏幕

  • 尝试了正常的cordova js代码:

  • 将$ cordovaFacebookProvider更改为$ cordovaFacebook(基于此主题: forum.ionicframework.com/t/unknown-provider-cordovaprovider/13305/3

  • 这是另一个相关的主题,但并没有帮助我思考.. forum.ionicframework.com/t/does-ng-crodova-has-facebook-login/9163

我已经在应用程序内浏览器中使用了fb auth的原型。但我真的想要一个原生的fb连接功能。

3 个答案:

答案 0 :(得分:5)

我找到了解决此问题的方法。

感谢这个主题:https://github.com/driftyco/ng-cordova/issues/446

和本教程:https://github.com/Wizcorp/phonegap-facebook-plugin/blob/master/platforms/browser/README.md

第1步:不要忘记身体后的<div id="fb-root"></div>

第二步:我将facebookConnectPlugin添加到我的bower依赖

见我的bower.json:

"dependencies": {
    "angular-google-maps": "~2.0.13",
    "google-map": "~0.4.1",
    "facebook-connect-plugin": "https://cdn.rawgit.com/Wizcorp/phonegap-facebook-plugin/master/facebookConnectPlugin.js"
}

请参阅我的app.config +代码到init:

app.config(function ($stateProvider, $urlRouterProvider, $ionicConfigProvider, $animateProvider, $httpProvider, $cordovaFacebookProvider) {

var appID = 597135743751760;
var version = "v2.0"; // or leave blank and default is v2.0
$cordovaFacebookProvider.browserInit(appID, version);

$ cordovaFacebookProvider调用facebookConnectPlugin()

第3步:更改此依赖项后,不要忘记从您的CLI调用bower update。 bower update example

第4步:在index.html中包含新的facebookblablabla.js。

可以是

<script src='bower_components/facebook-connect-plugin/index.js'></script>

对我来说是

<script src='lib/facebook-connect-plugin/index.js'></script>

第5步:在Facebook App中添加Valid OAuth重定向URI字段: http://static.ak.facebook.com/connect/xd_arbiter/

希望它适合你:)!

答案 1 :(得分:0)

我的答案不是为您的问题提供解决方案,而是提供建议。

为什么在使用HelloJS时使用facebook Cordova? faceBook Cordova是平台相关的,因为它运行cordova true node.js而不是演变而慢得多。

HelloJS允许非常容易地整数各种Oauth2身份验证,包括facebook / google / twitter / instagram ......

没有说明facebook cordova的编辑对于facebook密钥应用来说非常棘手。在HelloJS上,这只是一个可以轻松更改的参数。

答案 2 :(得分:0)

我不知道是否有人仍然坚持这件事,请按照我@Alexy提到的方法,然后编辑&#39; lib / facebook-connect-plugin / index.js&#39;文件行来自:

if(cordova.platformId === 'browser')

if(!window.cordova || (window.cordova && window.cordova.platformId === 'browser'))

希望这有助于:)