cordova - Facebook Connect 与 PhoneGap Build - ReferenceError : Can't find variable: facebookConnectPlugin

Question

这是一个 self 回答的问答，希望能够消除一些困惑。遵循 Facebook Connect plugin v0.4.0 的官方自述文件后发现于https://github.com/phonegap-build/FacebookConnect/blob/962eb0a1c07935ff813e28aa9eaa5581f2e10416/README.md ，它并没有立即起作用，所以我们在本地安装了该插件。

由于上面是专门针对 PhoneGap Build 的分支，因此我们使用官方插件存储库 https://github.com/phonegap/phonegap-facebook-plugin 中的说明安装了该插件。

有太多错误信息和建议，没有说明 PhoneGap 的版本、插件、是否使用 PhoneGap 版本等，以至于很难理解如何实际让它工作。

我们遵循的一些指南/提示: PhoneGap add Facebook Connect plugin http://pjsdev.blogspot.com/2013/03/phonegap-build-facebook-connect-part-2.html http://informatico.hol.es/blog/instalar-phonegap-facebook-plugin/ http://excellencemagentoblog.com/cordova-3-5-0-facebook-login-0-5-1-using-command-line-android

尽管可以正常工作(设备的 XCode Organizer 中的控制台日志显示 Cordova Facebook Connect 插件已成功初始化。)，但我们还是遇到了 ReferenceError: Can' 的问题每当尝试运行 PhoneGap 构建版本时，都找不到变量:facebookConnectPlugin。

Answer 1

问题是 facebookConnectPlugin 仅在该插件的 v0.5.1 中可用，而我们在使用 PhoneGap 构建进行构建时正在运行 v0.4.0，同时不小心在本地安装了 v0.5.1。

直白的巨大困惑:

• 该插件的最新版本是 0.5.1，这是我们本地安装的
• PhoneGap 版本最多只有 0.4.0
• 该文档链接到 962eb0a1c07935ff813e28aa9eaa5581f2e10416 处的代码/树，而不是 0.4.0 标记 - 目前尚不清楚它们是否相同
• 在 0.4.0 和 0.5.1 之间，嵌入和使用插件的方式发生了巨大变化

版本 0.4.0:

您应该在 html 中包含以下内容以使其在您的设备上运行:

<script src="cdv-plugin-fb-connect.js"></script>
<script src="facebook-js-sdk.js"></script>

如果您有一个既适用于 PhoneGap 又可作为浏览器中的 Web 应用程序的代码库，请确保在为 PhoneGap 构建时仅包含上述代码。要使其在将网页作为普通网页运行时工作，请遵循 Facebook 的普通 Facebook JS SDK 说明。在 if (!window.cordova) {} 中运行该代码。

使用示例:

if (typeof CDV === 'undefined') {
    alert('CDV variable does not exist. Check that you have included cdv-plugin-fb-connect.js correctly');
}
if (typeof FB === 'undefined') {
    alert('FB variable does not exist. Check that you have included the Facebook JS SDK file.');
}

// Initialize the Facebook SDK
FB.init({
    appId: 'yourappid',
    nativeInterface: CDV.FB,
    useCachedDialogs: false
});

FB.getLoginStatus(handleStatusChange);

其中 handleStatusChange 是一个回调，用于接收有关用户是否登录的信息。

要提示登录，请根据官方文档使用 FB.login()。 0.4.0 树中的示例非常有帮助:https://github.com/phonegap-build/FacebookConnect/tree/962eb0a1c07935ff813e28aa9eaa5581f2e10416/example

版本 0.5.1:

该插件在设备上运行时会公开 window.facebookConnectPlugin，而无需手动包含任何 js。您应该复制https://github.com/phonegap/phonegap-facebook-plugin/blob/master/www/js/facebookConnectPlugin.js到您的项目中并将其包含在您的 html 中，以便在将网页作为普通网页运行时获得类似的 API。

使用示例:

var fbLoginSuccess = function (userData) {
    alert("UserInfo: " + JSON.stringify(userData));
}

facebookConnectPlugin.login(["basic_info"],
    fbLoginSuccess,
    function (error) { alert("" + error) }
);

PS PhoneGap 构建的一些调试技巧:

• 使用设备的 XCode Organizer 中的控制台日志来查看 PhoneGap 代码中 console.log() 的输出(仅在 deviceready 后输出消息)
• 在 JavaScript 中使用 try/catch-blocks 来捕获并查看代码中的 js 错误。

本地安装 v0.4.0:

cd ~/tmp/
wget https://github.com/phonegap/phonegap-facebook-plugin/archive/0.4.0.tar.gz --no-check-certificate
tar -xvf 0.4.0.tar.gz
cordova plugin add ~/tmp/phonegap-facebook-plugin-0.4.0/ --variable APP_ID="yourfbappid" --variable APP_NAME="fb app name"