无效范围：React Facebook 登录中的电子邮件

Question

我在 React 应用程序中使用 React-facebook-login 库来实现 Facebook 登录按钮。这是 FacebookSignInButton 组件的代码：

import React from "react";
import FacebookLogin from "react-facebook-login/dist/facebook-login-render-props";

const FacebookSignInButton=()=>{
  const responseFacebook=(response)=>{
    console.log(response);
  };

  return (
    <>
      <FacebookLogin
        appId="FACEBOOK_APP_ID"
        autoLoad
        callback={responseFacebook}
        scope="email"
        render={(renderProps) => (
          <div
            onClick={renderProps.onClick}
            className="w-14 h-14 text-center rounded-full bg-blue-500 text-white saturate-100 transition-all hover:bg-blue-600"
          >
            <button className="block mx-auto mt-4">
              <i className="fab fa-facebook-f fa-lg"></i>
            </button>
          </div>
        )}
      />
    </>
  );
};

export default FacebookSignInButton;

但是，当我尝试使用 Facebook 登录按钮时，收到一条错误消息：“无效范围：电子邮件。此消息仅向开发人员显示。如果存在这些权限，您的应用程序的用户将忽略这些权限。”

我已将范围属性设置为“电子邮件”，以在登录过程中请求用户的电子邮件。但范围似乎有问题。

我已经参考了有关有效权限的Facebook文档（https://developers.facebook.com/docs/facebook-login/permissions），但我无法弄清楚是什么导致了错误。

任何人都可以帮助我理解为什么会出现此错误以及如何修复它以在 Facebook 登录期间正确请求用户的电子邮件？

谢谢！

Answer 1

将

'email'

以数组形式发送到

scope

prop，如下所示。

<FacebookLogin
  appId="FACEBOOK_APP_ID"
  autoLoad
  callback={responseFacebook}
  scope={['email']}
 
/>

其余代码将保持不变。