Question

问题

我正在处理角度，并通过Satellizer实现了facebook登录。它在桌面上运行良好，但在移动设备上访问时，它有时会起作用，有时候也不会。登录弹出窗口在它不工作时永远不会关闭，它会在登录弹出窗口中打开主页，而请求登录的主屏幕仍在等待弹出窗口关闭。有什么建议可能会出错吗？

示例代码

这就是我从facebook验证的方式

   var commonConfig = {
    popupOptions: {
     location: 'no',
     toolbar: 'yes',
     width: window.screen.width,
     height: window.screen.height
   }
};

var permissions = ["public_profile","email"];
$authProvider.facebook(angular.extend({}, commonConfig, {
  clientId: FacebookAppId,
  url: ApiUrl+'api/v1/facebook/auth',
  scope:permissions,
  scopeDelimiter:','
}));

使用facebook＆＃34;连接时调用此代码。按下

    $scope.loginSocial = function () {
    $scope.disableSubmitBtn = true;
    $scope.showSpinner = true;

    $auth.authenticate('facebook')
      .then(function (result) {
        result = angular.fromJson(result.data.code)
        return AuthServerProvider.loginFb(result.facebookCode);
      },function (error) {
        $scope.status = 'facebook-error';
        $scope.disableSubmitBtn = false;
        $scope.showSpinner = false;
      })
      .then(function(){
        $scope.disableSubmitBtn = true;
        $scope.showSpinner = true;
      })

此代码适用于桌面版网络浏览器，但通过手机浏览器访问＆＃34; $ auth.authenticate（＆＃39; facebook＆＃39;）＆＃34;大部分时间都失败了。

Answer 1

我们在实施Satellizer方面遇到了类似的问题。事实证明，问题在于处理angular ui.router中的redirectUri。如果你回到图书馆文档，你会注意到这个qoute：

为避免潜在的404错误，请为每个redirectUri＆gt;创建服务器路由。返回200 OK的URL。或者，您可以使用加载微调器渲染自定义模板。目前，弹出窗口不会停留很长时间＆gt;足以看到该自定义模板，由于20ms间隔轮询，但在＆gt;未来我可能会增加对覆盖此轮询间隔值的支持。

在上面提到的代码中，您没有指定redirectUri，因此默认为＆＃39; /＆＃39;。如果您已经以不同的方式处理此路由，则有时可能会被角度路由捕获并在Satellizer可以获取之前重定向。为了解决这个问题，只需指定一个redirectUri并通过角度路径处理它。

有关详细信息，请read this post。

Facebook登录无法使用手机Angular Satellizer

1 个答案: