CORS麻烦和的NodeJS AngularJS [英] CORS trouble with nodejs and AngularJS

问题描述

由于某种原因，每当我尝试了一些数据发布到我的API服务器我得到以下两个错误。

 选项的http：//本地主机：3000 / test2的请求头字段内容类型不被访问控制 - 允许 - 允许标题。 angular.min.js：99
XMLHtt prequest无法加载的http：//本地主机：3000 / TEST2。请求头字段内容类型不被访问控制 - 允许 - 允许标题。
 

下面是我的客户端的角度JS code试图发送一些简单的数据。这code目前位于 HTTP的nginx的服务器上运行：//本地主机：8080

 功能控制器（$范围，$ HTTP）{
    //范围是所有的HTML声明的控制器内的元素
    VAR URL =的http：//本地主机：3000 / TEST2';    $ scope.listVaules =功能（）{
        的console.log（关于发布用户ID）;
        的console.log（$ scope.user.userId）;
        的console.log（$ scope.user.name）;
        的console.log（$ scope.user.password）;
        的console.log（JSON.stringify（$ scope.user））;
        $ HTTP（{方法：邮报，网址：URL，数据：JSON.stringify（$ scope.user）}）。
            成功（功能（数据，状态，头，配置）{
                的console.log（数据）;
                的console.log（成功）;
            }）。
            错误（功能（数据，状态，头，配置）{
                的console.log（'错误'）;
            }）;
    };
    }
 

下面是我的节点JS code来处理处理的要求，以本地主机：3000 /测试2

  // CORS头securiy
app.all（'/ *'，函数（REQ，资源，下一个）{
  res.header（访问控制允许原产地，*）;
   res.header（访问控制允许的方法，GET，PUT，POST，DELETE'）;
  res.header（访问控制允许报头，X-要求，随着）;
  下一个（）;
}）;//应该张贴客户端JSON信息到服务器
app.post（网址+'/ test2的'功能（REQ，RES）{
    变量名称= req.body.name;
    VAR用户id = req.body.userId;
    VAR密码= req.body.password;    的console.log（名称+''+用户id +''+密码）;
    res.send（200）;
}）;
 

解决方案

随着错误消息状态，你必须承认你的回应preflight的Content-Type头。这可能是由非简单的Content-Type为您的要求（表面上是应用程序/ JSON）引起的。

所以，与其这样：

res.header（访问控制允许报头，X-要求，随着）;

...你需要这样的：

res.header（访问控制允许报头，X-请求-着，内容类型）;

For some reason whenever I try to post some data to my api server I get the following two errors.

OPTIONS http://localhost:3000/test2 Request header field Content-Type is not allowed by Access-Control-Allow-Headers. angular.min.js:99
XMLHttpRequest cannot load http://localhost:3000/test2. Request header field Content-Type is not allowed by Access-Control-Allow-Headers. 

Here is my client side angular JS code trying to send some simple data. This code is currently running on an nginx server located under http://localhost:8080

function Controller($scope, $http) {
    //scope is all of the elements within the controller declared on the html
    var url = 'http://localhost:3000/test2';

    $scope.listVaules = function () {
        console.log("about to post user id");
        console.log($scope.user.userId);
        console.log($scope.user.name);
        console.log($scope.user.password);
        console.log(JSON.stringify($scope.user));
        $http({ method: 'Post', url: url, data: JSON.stringify($scope.user) }).
            success(function (data, status, headers, config) {
                console.log(data);
                console.log('success');
            }).
            error(function (data, status, headers, config) {
                console.log('error');
            });
    };
    }

Here is my node JS code to handle that "handles" the request to localhost:3000/test2

// CORS header securiy
app.all('/*', function (req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
   res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
  res.header("Access-Control-Allow-Headers", "X-Requested-With");
  next();
});

//Should post client side json info to the server
app.post(url + '/test2', function(req, res) {
    var name = req.body.name;
    var userId = req.body.userId;
    var password = req.body.password;

    console.log(name + ' ' + userId + ' ' + password);
    res.send(200);
});

解决方案

As the error message states, you must acknowledge the Content-Type header in your response to the preflight. This is likely caused by a non-"simple" Content-Type for your request (ostensibly application/json).

So, instead of this:

res.header("Access-Control-Allow-Headers", "X-Requested-With");

...you need this:

res.header("Access-Control-Allow-Headers", "X-Requested-With, Content-Type");

这篇关于CORS麻烦和的NodeJS AngularJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！