Question

我正在教自己MEAN堆栈，正在研究简单的Todo应用程序。

但是我得到了这个json错误：

POST /api/todos 400 20.659 ms - 612
Error: invalid json
at parse (/Users/Angular_To_Do/node_modules/body-parser/lib/types/json.js:60:15)
at /Users/Angular_To_Do/node_modules/body-parser/lib/read.js:96:18
at IncomingMessage.onEnd (/Users/Angular_To_Do/node_modules/body-parser/node_modules/raw-body/index.js:136:7)
at IncomingMessage.g (events.js:199:16)
at IncomingMessage.emit (events.js:129:20)
at _stream_readable.js:908:16
at process._tickCallback (node.js:355:11)

我是菜鸟，并检查了我的代码是否有错误，但我不太清楚这里出了什么问题。我想发送一个json对象，并设置app.use（bodyParser.json（）），但它仍然无法正常工作。请让我知道为什么这不起作用....

//Server.js

app.use(express.static(__dirname + '/public'));
app.use(morgan('dev'));
app.use(bodyParser.urlencoded({'extended':'true'}));
app.use(bodyParser.json());
app.use(bodyParser.json({ type: 'application/vnd.api+json' }));
app.use(methodOverride('X-HTTP-Method-Override'));


var Todo = mongoose.model('Todo', {
text : String
});

app.get('/api/todos', function(req, res){
Todo.find(function(err, todos){
    if(err){
        res.send(err)
    }

    res.json(todos)
      });
});

app.post('/api/todos', function(req, res){
    Todo.create({
    text: req.body.text,
    done: false
}, function(err, todo){
    if(err){
        res.send(err);
    }

    Todo.find(function(err,todos){
        if(err){
            res.send(err)
        }
        res.json(todos);
       });
    });
});

这是Controller文件：

var myTodo = angular.module('myTodo',[ ])

myTodo.controller('taskController',function($scope, $http){

  $http.get('/api/todos')
     .success(function(data){
        $scope.todos = data;
        console.log(data);
     })
     .error(function(data){
        console.log('Error: ' + data);
    });

  $scope.addListItem = function(){
     $http.post('/api/todos', $scope.formData)
       .success(function(data){
        $scope.formData = "";
        $scope.todos = data;
        console.log(data);
     })
     .error(function(data){
        console.log('Error: ' + data);

     });
  };

请在此处查看html：

 <div ng-controller = "taskController">
  <form>
    <input type="text" class="" placeholder="" ng-model="formData">
    <button style = "margin-top:50px"
     type = "submit"
     ng-click = "addListItem()">
     ADD SOME TASKS
    </button>
  </form>
</div>

我使用的是Express 4.7，角度为1.3.15。我不明白为什么会出现这种错误并且无法通过它。谢谢

Answer 1

如果要POST，然后对对象执行GET，则必须在服务器控制器内异步执行。最好只在成功发布后在前端推送JSON对象。

所以你可以这样做：

app.post('/api/todos', function(req, res) {
  var newTodo = new Todo();

  newTodo.text = req.body.text 

  newTodo.save(function(err, todo) {
    if(err) {
      res.send('error ' + err);
    }
    res.json(todo);
  });

然后在前面：

      $scope.todos.splice(0, 0, data);

那是对的。因此，每当我发出POST请求时，我总是将其定义为将要提交的变量然后传递。因此，不要将$ scope.formData作为第二个变量传递，我会说

$scope.addListItem = function(){
var formData = { text: $scope.formData.text };

$http.post(url, formData)
   .success(...)

此外，您的解决方案有效，因为您传递了连接到$ scope.formData的所有数据。

错误：json，ExpressJS和Angular无效

1 个答案: