Titanium - Facebook模块不使用本机登录

Question

我正在尝试将facebook登录到我正在尝试使用Titanium开发的应用程序,当我点击"连接"按钮时,它会显示一个如下所示的对话框:

它看起来像一个web-app facebook登录,而不是本机应该是什么样子.我希望它是这样的:

那么,我怎样才能使这个模块使用本机登录对话框而不是这个web风格的对话框呢？

Answer 1

要使用iOS本机facebook登录,您必须:

1. 使用新的facebook模块require('facebook'),旧的模块已被弃用
2. 设置forceDialogAuth = false;
3. 确保您的应用程序的软件包ID也在您的Facebook应用程序中设置
4. 在tiapp.xml中设置facebook app id
5. 将Info.plist移动​​到应用程序的根文件夹,并在那里提供facebook id和url方案(使用新的SDK,您可以在tiapp.xml中执行此操作,我将在一分钟内给出一些示例)

您发布的图像是后备解决方案,如果发生,则会发生

• 用户尚未激活设备上的facebook login/facebok应用程序
• 用户在本机facebook登录之前有iOS版本
• 你在模拟器中运行你的应用程序

这就是我如何使用本机iOS登录,一步一步:

1.创建Facebook应用程序
为了使用本机iOS facebook登录,您必须在developers.facebook.com上创建一个Facebook应用程序.将您的应用ID复制到文本编辑器,稍后我们将需要它.

2.设置您的Facebook应用
程序在基础部分启用"原生iOS应用程序"集成.

(1)输入您用于应用程序的软件包ID,与tiapp.xml中设置的软件包ID相同
(2)如果您希望Facebook从书签等启动应用程序,请激活Facebook登录.
(3)可选:用于分享您的应用程序facebook id跨多个应用程序.我们也将在Info.plist中使用此url方案.

3.设置tiapp.xml
转到Titanium Studio并打开tiapp.xml(通常是apps目录中的最后一个文件).左下角有两个标签.我们首先需要概述.确保您的应用程序ID与您在Facebook应用程序中输入的ID相匹配.单击模块的+并添加Appcelerators自己的facebook模块,默认安装.它应该出现在下面的列表中.
仍然在tiapp.xml中,单击tiapp.xml选项卡,并添加以下内容:
<property name="ti.facebook.appid">XXXXXXXX</property>
显然,Xs是您的Facebook应用程序ID.

4.复制和编辑Info.plist文件
在Finder中,导航到您的应用程序根文件夹.从这里开始构建> iphone.你应该在这里看到Info.plist.复制并粘贴到您应用的根文件夹中.
使用您选择的文本编辑器打开它.将FacebookAppID和FacebookDisplayName添加到文件中,并将占位符值替换为您自己的值.这可能没有必要,但我使用它并且它可以工作,只是为了安全起见;)查找CFBundleURLTypes并将其编辑为如下所示,test是您的应用程序的URL方案,您已将其设置在您的Facebook应用程序之前.这样,您也可以通过输入从Safari打开您的应用程序test://.请注意CFBundleURLSchemes数组中的fb,这必须以您的facebook app id为前缀,与之前的所有其他字段不同.

<key>FacebookAppID</key>
<string>XXXXXXXXXXXXX</string>
<key>FacebookDisplayName</key>
<string>Your facebook app name</string>
<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleURLName</key>
        <string>test</string>
        <key>CFBundleURLSchemes</key>
        <array>
              <string>test</string>
              <string>fbXXXXXXXXXX</string>
        </array>
    </dict>
</array>

请注意:使用最新的SDK,这些设置也可以在tiapp.xml中设置,但由于我还没有完成,所以此示例使用Info.plist

5.使用facebook模块
我不经常使用标准的facebook按钮,因为它无法自定义.假设您有一个名为loginButton的登录按钮和一个名为logoutButton的logoutButton,我们将它们连接到我们的facebook模块:

// The module we have added to our project via tiapp.xml before
var facebookModule = require('facebook');
// We can read the facebook app id from tiapp.xml
var FACEBOOK_APP_ID = Ti.App.Properties.getString('ti.facebook.appid');
// Set the app id
facebookModule.appid = FACEBOOK_APP_ID;
// Do not force a facebook html popover but use the native dialog if possible
facebookModule.forceDialogAuth = false;
// Add an event listener to the facebook login event
facebookModule.addEventListener('login', facebookLoginHandler);
// Also add an event listener to the logout event
facebookModule.addEventListener('logout', facebookLogoutHandler);

// The event listener of our login button
loginButton.addEventListener('click', function() {
    facebookModule.authorize();
});

// The event listener of our logout button
logoutButton.addEventListener('click', function() {
    facebookModule.logout();
});

// The facebook login event handler
function facebookLoginHandler(e) {
    if (e.success) {
        // Success!
    } else if (e.error) {
        // Error!
    } else if (e.cancelled) {
        // cancelled by user
    }
}

// The facebook logout handler
function facebookLogoutHandler(e) {
    if (e.success) {
        // Success, clear the facebook browser cookies so someone else
        // can login later, if the browser fallback is used
        var client = Titanium.Network.createHTTPClient();
        client.clearCookies('https://login.facebook.com');
    } else if (e.error) {
        // Error!
    } 
}