MEAN应用程序中的Angular API调用失败

时间:2015-10-08 10:08:20

标签: angularjs node.js express mongoose

在MEAN应用程序中,我试图允许授权用户(电子邮件和密码登录)更改其用户名。 我可以成功使用Postman将新用户名设为http://localhost:3000/api/users/xxxxxxxxxxxxxxxx。 但角度代码失败了。 以下是编辑页面的相关部分:

<form ng-submit="user.saveUser()">

            <div class="form-group">
                <label> New Username</label>
                <input type="text" class="form-control" ng-model="user.userData.name">
            </div>

这是控制器:

.controller('userEditController', function($routeParams, User) {
  var vm = this;
  vm.type = 'edit';


  User.get($routeParams.user_id)
    .success(function(data) {
      vm.userData = data;
    });

  // function to save the user
  vm.saveUser = function() {
    vm.processing = true;
    vm.message = '';

    // call the userService function to update 
    User.update($routeParams.user_id, vm.userData)
      .success(function(data) {
        vm.processing = false;

        // clear the form
        vm.userData = {};

        // bind the message from our API to vm.message
        vm.message = data.message;
      });
  };


});

这是服务:

// update a user
    userFactory.update = function(id, userData) {
        return $http.put('/api/users/' + id, userData);
    };

此时userData包含 name:“Fred”或输入到表单的任何内容

这是api.js

apiRouter.route('/users/:user_id')

        // get the user with that id
        .get(function(req, res) {
            User.findByIdAndUpdate(req.params.user_id, function(err, user) {
                if (err)  return res.send(err);

                // return that user
                res.json(user);
            });
        })

        // update the user with this id
        .put(function(req, res) {
                console.error(req.params.user_id);
            User.findById(req.params.user_id, function(err, user) {

                if (err) return res.send(err);

                // set the new user information if it exists in the request
                if (req.body.name) user.name = req.body.name;

                // save the user
                user.save(function(err) {
                    if (err) return res.send(err);

                    // return a message
                    res.json({ message: 'User updated!' });
                });

            });
        });

(由于CastError,我不得不使用findByIdAndUpdate而不是findById。)

虽然控制台说明:

XHR完成加载:PUT http:/ localhost / 3000 / api / users / user_id

req.params.user_id的值只是 user_id

终端显示:

PUT / api / users / user_id 200 4.040 ms - 2273

GET / api / users / user_id - - ms - -

GET / api / users / user_id - - ms - -

GET / api / users / user_id - - ms - -

就像我说Postman可以与API通信并且可以毫无问题地更新。我很难过,希望有人会让我摆脱苦难

1 个答案:

答案 0 :(得分:0)

我不得不改变这一点。在Postman中手动输入的user_id工作的事实应该告诉我Angular代码提供的u​​ser_id不正确。所以我确保JWT包含了user_id:

var token = jwt.sign({
                name: user.name,
                email: user.email,
                user_id: user._id

然后添加了api端点以获取用户信息:

apiRouter.get('/me', function(req, res) {
        res.send(req.decoded);
    });

然后连接服务:

userFactory.get = function() {
        return $http.get('/api/me/');
    };

然后在控制器中我可以调用get:

User.get()
  .success(function(result) {
    $scope.user_id = result.user_id;
    });

$ scope.user_id现在具有正确的user_id,我可以将其传递给更新方法:

User.update($scope.user_id, vm.userData)
      .success(function(data) 

所以现在它按预期工作。