使用@capacitor-community/facebook-login登录返回undefined问题求助

环境依赖 #

"@ionic/angular": "^8.0.0-rc.2",
"@capacitor/app": "^6.0.0",
"@capacitor/core": "^6.0.0",
"@capacitor/ios": "^6.0.0",
"@capacitor-community/facebook-login": "^6.0.0",
...

问题描述 #

已完成官方iOS配置步骤，但调用FacebookLogin.login()时返回结果为undefined：

FacebookLogin.login({ permissions: [] }).then((response) => {
      console.log('RESPONSE', JSON.stringify(response)); // 输出undefined
      let token = '';

      if (response.accessToken) {
        token = response.accessToken.token;
      }

      return FacebookAuthProvider.credential(token);
    });

再次尝试登录时，获取到的疑似刷新令牌会触发Firebase错误：

{"code": "auth/invalid-credential", "customData": {"appName": "[DEFAULT]"}, "name": "FirebaseError"}

已做排查 #

• 查看插件JS源码，确认即使Promise拒绝也应返回响应对象，不应出现undefined
• 已验证Facebook App ID在Firebase、info.plist中配置一致
• 已确认info.plist中的客户端令牌与Facebook后台匹配（非App Secret）
• 怀疑问题与Facebook Login SDK更新后的原生代码兼容性有关
• 发现Ionic论坛存在同类未解决问题

解决方案 #

1. 锁定Facebook iOS SDK版本 #

Capacitor 6.x与插件6.x要求SDK版本16.0+，手动指定稳定版本避免兼容性问题：
在iOS项目的Podfile中添加：

pod 'FBSDKCoreKit', '~> 16.2.0'
pod 'FBSDKLoginKit', '~> 16.2.0'

执行命令更新依赖：

cd ios
pod install --repo-update

2. 修复插件原生回调逻辑 #

检查插件iOS端FacebookLogin.swift的login方法，确保登录成功时正确传递响应对象：

• 确认在调用call.resolve()时，传入包含accessToken的LoginResult实例，而非空值
• 若插件版本存在bug，可临时修改该文件后重新编译

3. 优化令牌校验逻辑 #

避免使用无效令牌，添加校验并处理刷新令牌情况：

FacebookLogin.login({ permissions: ['public_profile', 'email'] })
  .then((response) => {
    if (!response?.accessToken?.token) {
      throw new Error('未获取到有效访问令牌');
    }
    // 排除刷新令牌
    if (response.accessToken.token.includes('refresh')) {
      return FacebookLogin.logout()
        .then(() => FacebookLogin.login({ permissions: ['public_profile', 'email'] }))
        .then(newRes => FacebookAuthProvider.credential(newRes.accessToken.token));
    }
    return FacebookAuthProvider.credential(response.accessToken.token);
  })
  .catch(err => console.error('登录流程错误:', err));

4. 完善info.plist配置 #

确保关键配置项齐全：

• 添加URL Scheme：格式为fb{你的Facebook App ID}（如fb123456789）
• 在LSApplicationQueriesSchemes中添加：fbapi、fb-messenger-share-api、fbauth2、fbshareextension

5. 更新插件至最新版本 #

执行命令更新插件并同步到iOS项目：

npm update @capacitor-community/facebook-login
npx cap sync ios

内容的提问来源于stack exchange，提问作者Wayne Kaskie