从弹出窗口获取JSON结果。Angular.JS

Question

我有一个弹出窗口，调用RESTful后端进行Oauth认证，但返回结果时，它会在弹出窗口中显示JSON而不是关闭弹出窗口并将JSON存储在模型中。我该如何解决？

this.socialLogin = function(provider) {
  var url = urlBase + '/' + provider,
      width = 1000,
      height = 650,
      top = (window.outerHeight - height) / 2,
      left = (window.outerWidth - width) / 2,
      socialPopup = null;

  $window.open(url, 'Social Login', 'width=' + width + ',height=' + height + ',scrollbars=0,top=' + top + ',left=' + left);
};

- Knoland

---

你为什么需要第一个额外的窗口呢？如果它在你的域上，你可以使用postMessage API将数据传递回主窗口。 - charlietfl

当我尝试那样做时，什么都没有发生。 - Knoland

这是一个REST API，所以它返回的只是JSON格式的数据。回调函数进入护照(passport)，并返回用户数据的JSON格式。窗口永远不会关闭，而是显示原始的JSON数据。 - Knoland

你解决了这个问题吗？我也遇到了同样的问题。 - lostintranslation

问题可能出在后端。看起来它返回的是JSON数据而不是HTML。你在Angular中使用$http进行任何HTTP请求吗？这应该是唯一的用例，服务器会返回JSON。 - alcfeoh

Answer 1

描述的情况可能不是在Angular中解决问题的最佳方式。我假设这是在控制器内编写的。如果是这样，调用后端服务最好使用$http服务。为此，

controller.js

angular.module('example')
  .controller(['$scope', '$http', '$window', function($scope, $http, $window) {

  $scope.socialLogin = function(urlEnd) {
    $http.get(urlBase + '/' + urlEnd) // Should probably be posting here...
      .then(function(res) { // Your JSON response here
        $scope.doSomethingWithTheResponse(res.data);
      }, function(err) { // Handle your error
        $window.alert("We got us an error!\n" + JSON.stringify(err));
      });
    }
  }])

- Kris Molinari