首页 > 解决方案 > 即使应用程序处于开发模式,Facebook 登录 api 仍然会给出 https required 的错误

问题描述

我在 facebook 上创建了一个测试应用程序,并将域和站点 url 分别设置为 localhost 和http://localhost:4200

该应用程序处于开发模式,如文档所述“您仍然可以使用带有“localhost”地址的 HTTP,但只有在您的应用程序仍处于开发模式时”,但我收到错误“FB.login 方法将从 http 页面调用时很快就会停止工作。请更新您的站点以使用 https 进行 Facebook 登录。” 当我调用 FB.login() api 时。

有时不显示用于登录用户的 facebook 窗口,有时会打开窗口并显示错误“登录错误:登录此应用程序时出错。请稍后再试。” 内。

更新

我在语言环境中使用 https 并且相关错误消失了。这是“用 Facebook 登录”按钮调用的函数

loginWithFacebook() {
    this.btnLoaderFB = true;
    this.auth.facebookInitializer()
      .then(() => {
        this.auth.facebookInitialized = true;
        return this.auth.facebookLoginStatus();
      })
      .then((loginStatusResponse) => {
        console.log(loginStatusResponse);
        if (loginStatusResponse.status !== 'connected') {
          return this.auth.facebookLogin();
        } else {
          return this.auth.getFacebookProfileInfo();
        }
      })
      .then((profileInfo) => {
        console.log(profileInfo);
        this.auth.loginWithFacebookRemote(profileInfo)
          .subscribe(
            res => {
              this.btnLoaderFB = false;
            }
          );
      })
      .catch(err => {
        console.log(err);
        this.translate.get('t.validation.error_fb_login').pipe(takeUntil(this.unsubscribe)).subscribe(
          t => {
            this.error = t;
            this.btnLoaderFB = false;
          });
      });

第一次调用此函数时,我收到来自facebookLoginStatus() 登录控制台的响应

在此处输入图像描述

我输入了 fb 凭据并收到此错误

在此处输入图像描述

如果我尝试再次单击按钮,我会收到与facebookLoginStatus()第一张图片中显示的相同的响应,并且 facebook 弹出窗口在上一张图片中显示相同的错误消息。如果我重新加载页面,则facebookLoginStatus()响应是我对 facebook 上登录用户的期望,并且登录过程结束时没有错误

在此处输入图像描述

标签: facebook-javascript-sdkfacebook-login

解决方案


我甚至可以推荐在 localhost 上使用 https,尤其是因为您将拥有一个更类似于实时环境的测试系统。这一劳永逸地解决了 Facebook https 问题。

对于 Node.js,使用此工具非常简单:https ://github.com/davewasmer/devcert

对于 PHP,您可能想看看这个线程:如何在 localhost 上允许 HTTPS 用于 Apache?

对于 Angular CLI:Get angular-cli to ng serve over HTTPS


推荐阅读