Angular HTTP Post 请求，有效载荷嵌套在 JSON 对象中

Question

我正在学习 Angular 和 Node，我正在尝试弄清楚如何让我的 Angular 应用程序运行一个单独的应用程序托管休息 API。

请求正文显示为 { '{"name":"test"}': '' } 我希望它显示为 { "name" : "test"}

这是发送post请求的前端应用。

$http({
  method: 'POST',
  url: 'http://localhost:8080/api/test',
  data: {
    "name": 'test'
  },
  dataType: "json",
  headers: {'Content-Type': 'application/x-www-form-urlencoded'}
});

它正在到达定义为

的路线

app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json());
app.all('/', function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
 });
router.post('/test', function(req, res) {
    var name = req.body.name;
    console.log(req.body);
});

我预计问题出在 application/x-www-form-urlencoded 的内容类型上，但我不知道如何使用 application/json.

允许 cors

Answer 1

JSONP 可用于执行 CORS 请求（更多关于 json/jsonp 此处 What are the differences between JSON and JSONP?), and in AngularJS documentation - jsonp using $http

Angular HTTP Post 请求，有效载荷嵌套在 JSON 对象中

Angular HTTP Post Request, Payload is nested in JSON Object

json

angularjs

node.js

http

cors