为什么要返回Undefined?

时间:2015-06-18 02:42:23

标签: javascript angularjs node.js hapijs

我正在开发一个应用程序,我正在使用带有AngularJS的Hapijs / Nodejs

这里是Nodejs部分

server.route({
  method: 'POST',
  path: '/login',
  handler: function(request, reply) {
    USER: request.payload.user,
    PWD: request.payload.password,
    PLANTA: request.payload.planta,
    PLANGROUP: request.payload.plantgroup,
    START_DATE: request.payload.startDate
  }
});

现在是Angular部分

  .factory('LoginService', function($http, $q) {

    var defer = $q.defer();

    return {
      login: function() {
        $http.post('http://localhost:8000/login', {
          user: 'USRCP_HW',
          password: 'usrcp2012',
          planta: '6000',
          plantroup: 'E10',
          startDate: '2014-11-26'
        }).success(function(data) {
          console.log(data);
          return data;
        }).error(function(data, status){
          console.log(data, status);
          defer.reject(data);
        });
        return defer.promise;
      }
    }

  });

和登录控制器

  .controller('LoginCtrl', function($rootScope, $scope, $stateParams, LoginService) {

    $scope.login = function(data) {
      console.log(data);
    };

  });

我需要的只是记录数据,但我得到了未定义。

如果在控制器中我做了

$scope.login = function(data) {
  console.log(data);
  LoginService.login(data).then(function() {
    console.log(data);
  })
};

我在浏览器控制台中得到了这个

  

选项http://localhost:8000/login

     

XMLHttpRequest无法加载http://localhost:8000/login。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此,不允许原点“http://127.0.0.1:8000”访问。响应的HTTP状态代码为501。

4 个答案:

答案 0 :(得分:1)

错误是因为相同的原始策略约束,我认为您可以使用登录URL的相对路径。

您无法从像

这样的异步方法返回
.factory('LoginService', function ($http, $q) {

    var defer = $q.defer();

    return {
        login: function () {
            $http.post('/login', {
                user: 'USRCP_HW',
                password: 'usrcp2012',
                planta: '6000',
                plantroup: 'E10',
                startDate: '2014-11-26'
            }).success(function (data) {
                console.log(data);
                defer.resolve(data); //resolve the promise
                //you can't return from here as it is executed asynchronosly
            }).error(function (data, status) {
                console.log(data, status);
                defer.reject(data);
            });
            return defer.promise;
        }
    }

});

然后

.controller('LoginCtrl', function ($rootScope, $scope, $stateParams, LoginService) {

    $scope.login = function (data) {
        console.log(data);
    };

    LoginService.login().then($scope.login)

});

此外,无需创建自定义承诺,因为$ http也会返回一个

.factory('LoginService', function ($http, $q) {

    return {
        login: function () {
            return $http.post('http://localhost:8000/login', {
                user: 'USRCP_HW',
                password: 'usrcp2012',
                planta: '6000',
                plantroup: 'E10',
                startDate: '2014-11-26'
            }).success(function (data) {
                console.log(data);
                //you can't return from here as it is executed asynchronosly
            }).error(function (data, status) {
                console.log(data, status);
            });
        }
    }

});

然后

.controller('LoginCtrl', function ($rootScope, $scope, $stateParams, LoginService) {

    $scope.login = function (data) {
        console.log(data);
    };

    LoginService.login().success($scope.login)

});

答案 1 :(得分:1)

回到关于CORS的原始问题......在Hapi中,您可以逐个路径或全局配置此功能。

var server = new Hapi.Server();

server.connection({
    port: process.env.PORT || 3333, 
    routes: { 
        cors: true 
    } 
});

您可以在此处找到更多信息:http://hapijs.com/api#route-options

或者,您可以根据Karanvir Kang建议的同一域提供客户端和api

答案 2 :(得分:0)

您遇到了跨源资源问题。如果您从http://127.0.0.1打开网站,那么您的脚本必须在登录功能中加载/发布资源到127.0.0.1而不是localhost

此外,如果您使用的是Apache Web服务器,则可以将其添加到.htaccess文件中:

Header set Access-Control-Allow-Origin "*"

更多阅读:

答案 3 :(得分:0)

如果运行此脚本的网站也托管在http://localhost:8000/login上,请将http://localhost:8000替换为/ login。

否则,您必须在NodeJs服务器上添加跨源策略:

app.all('*', function(req, res, next) {
       res.header("Access-Control-Allow-Origin", "*");
       next();
});

P.S:根据您的Web服务器风格,允许CORS的说明可能会有所不同。