Question

我想从我的angularjs应用程序向我的node.js服务器（使用express）发出POST请求。我发送正确的{key：value}有麻烦。尽管研究解决方案需要数小时，但我不知道如何正确编写params以使它们回到服务器端。我的结果是：＆＃39; {＆＃34; key＆＃34;：＆＃34; value＆＃34;}＆＃39;：＆＃39;＆＃39; 。我哪里错了？

感谢任何帮助，谢谢！

client.js

module.factory("Friends", function($resource) {
return $resource("https://myUrl/:id", {'id': '@id'} ,{
    mes: {method: 'POST', headers: {'content-Type': 'application/x-www-form-urlencoded'} , isArray : false }
});
});

module.controller('communityCtrl', ['$scope','$rootScope', 'Friends', function($scope,$rootScope, Friends) {
var value = "aValue";

$scope.getData = function()
{
    Friends.mes({id: 'jb'}, {key : 'value'} ).$promise.then(function(data){
    console.log(data);
    });
}
}]);

server.js

app.post('myUrl/jb', function(req, res) {
console.log("req.body : ", req.body);
res.json({code: 0, message: req.body.msg || ""}); 
});

输出

 req.body :  { '{"key":"value"}': '' }

Answer 1

你试过$ http吗？

工厂定义：

module
  .factory('friendsFactory', ['$http', function ($http) {
    return {
      post: function (id, data) {
        return $http.post('https://myUrl/' + id, data);
      },
      get: function () {
        return $http.get('https://myUrl/');
      }
    };
  }]);

在你的控制器内：

module
  .controller('friendsController', ['friendsFactory', function (friendsFactory) {
    friendsFactory.post(1, {id: 1})
      .then(function (res) {
        // success
        console.log(res.data);
      })
      .catch(function (err) {
        // there has been an error
        console.error(err.data);
      });
  }]);

在node.js API端点中，req.body将是一个字符串或一个对象。

注意：如果是字符串，请确保在express上使用正文解析器中间件。

在节点服务器上：

var express = require('express')
  , bodyParser = require('body-parser')
  app = express();

app.use(bodyParser.urlencoded({extended: true});

正文解析器中间件（以及其他东西）获取req.body中的有效负载，并将其替换为该数据的有效java对象表示。

Answer 2

TL; DR你的问题

您的代码中存在的问题可能如下：

Friends.mes({id: 'jb'}, {key : 'value'} ).$promise.then(function(data){

尝试将其更改为：

Friends.mes({id: 'jb', key: 'value'}).$promise.then(function(data){

完成此操作后，服务器路由上的req.body对象将包含以下{id: 'jb', key: 'value'}而不是{ '{"key":"value"}': '' }。

示例$资源申请：

我创建了一个使用$ resource进行GET和POST到API的小例子。

<强> ./公共/ index.html中

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>title</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular-resource.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body ng-app="app" ng-controller="friendController as vm">
    <div>
      {{vm.friend}}
    </div>
    <button ng-click="vm.getFriend()">Get User</button>
    <button ng-show="vm.friend" ng-click="vm.messageFriend(vm.friend)">Message Friend</button>
  </body>
</html>

<强> ./公共/的script.js

angular.module('app', ['ngResource'])

.factory('friendFactory', ['$resource', function ($resource) {
  return $resource(
    '/api/v1/friends/:id',
    {id: '@_id'},
    {
      mes: {
        method: 'POST',
        headers: {'content-Type': 'application/x-www-form-urlencoded'},
        isArray : false,
        params: { message: true }
      }
    }
  );
}])

.controller('friendController', ['friendFactory', function (friendFactory) {
  var vm = this;

  vm.friend = null;
  vm.getFriend = _getFriend;
  vm.messageFriend = _messageFriend;

  function _getFriend() {
    friendFactory.get({id: 1})
      .$promise
      .then(function (res) {
        console.log(res);
        vm.friend = res;
      });
  }

  function _messageFriend(friend) {

    /* method 1: call $mes on a friend object: */

    // vm.friend.$mes({message: 'A message'})
    //   .then(function (friend) {
    //     vm.friend = friend;
    //   });

    /* method 2: call mes on the resource: */

    friendFactory.mes({_id: 1, message: 'A message'})
      .$promise
      .then(function (friend) {
        vm.friend = friend;
      });
  }

}]);

index.js - 托管页面并公开简单api的node.js服务器

var express = require('express')
  , path = require('path')
  , app = express()
  , bodyParser = require('body-parser');

app.use(bodyParser.urlencoded({ extended: true, limit: '50mb' }));
app.use(express.static(path.join(__dirname, './public')));

var friends = [
  { _id: 0, name: 'A' },
  { _id: 1, name: 'B' },
  { _id: 2, name: 'C' },
  { _id: 3, name: 'D' }
];

app.get('/api/v1/friends', function (req, res) {
  return res.send(friends);
});

app.get('/api/v1/friends/:id', function (req, res) {
  for (var i = 0; i < friends.length; i++) {
    if (friends[i]._id == req.params.id) return res.send(friends[i]);
  }
  return res.status(404).send('Not found');
});

app.post('/api/v1/friends/:id', function (req, res) {
  for (var i = 0; i < friends.length; i++) {
    if (friends[i]._id == req.params.id) {
      friends[i].message = req.query.message;
      return res.send(friends[i]);
    }
  }
  return res.status(404).send('Not found');
});

app.listen(8080, function () {
  console.log('Server running');
});

此示例有一个简单的API，允许您

获取好友列表
找一个朋友
将消息发布给朋友（我假设这是你的 mes 代表什么？）。发布时 - message将作为查询字符串参数（req.query.message）或正文（req.body.message）提供。

在这个例子中，它简单地将“消息”附加到朋友并返回该对象。

注意事项（在friendController中）：默认情况下，在现有朋友对象上调用$mes会返回一个承诺，因此无需链接.$promise。

在资源本身上调用mes不会返回承诺，因此需要$promise。

angularjs使用ng-resource到node.js后端没有发送正确的POST请求

2 个答案: