Question

目前的情况

我正试图在我的控制器中定义的以下函数中从Angular发出$ http post请求：

$scope.sendUserData = function(){
    var userData = JSON.stringify({
        'firstName': $scope.firstName,
        'lastName': $scope.lastName,
        'email': $scope.email
    });
    console.log(userData); //this prints out the JSON I want
    var config = {
        headers: {
            'Content-Type': 'json'
        }
    };
    $http.post('/api/users', userData, config)
        .success(function(data){
            console.log(data);
        })
        .error(function(data){
            console.log('Error: ' + data)
        });

我有一个Express API，我希望通过下面定义的路由处理程序接收这个$ http post请求：

router.route('/users')
.post(function(req, res){
    var user = new User();
    user.firstName = req.body.firstName;
    user.lastName = req.body.lastName;
    user.email = req.body.email;
    user.save(function(error){ //add into mongodb
        if(error){
            res.send(error);
        }
        else{
            res.json({message: 'User created'});
        }
    });
})

我正在使用npm http-server运行前端，这样我就可以在Chrome中的http://127.0.0.1:8080访问我的index.html。我的快递应用程序使用以下行app.listen(8080, '127.0.0.1');

收听同一个端口

问题

当我尝试从前端http://127.0.0.1:8080发出http请求时，Angular函数将我想要的JSON数据记录到控制台，但是没有发出$ http请求，我收到以下错误： Chrome控制台：

POST http://127.0.0.1:8080/api/users 405 (Method Not Allowed)

我可以从Postman成功发出http post请求，我看到JSON添加到我的mongodb集合中。

我是否收到此错误，因为index.html /前端未连接到Express应用程序？从根本上说，我不明白这是如何运作的。 Express应用程序是否应该侦听index.html运行的同一端口？连接前端和后端的情况与应用程序在本地服务器上运行到应用程序在互联网上运行时的情况有何不同？

如果有人能向我解释前端应该如何连接到后端，或者我做错了什么，我会非常感激。

谢谢！

Answer 1

您尝试发布的不是JSON，而是发布字符串：

var userData = JSON.stringify({
    'firstName': $scope.firstName,
    'lastName': $scope.lastName,
    'email': $scope.email
});

发布JSON

var userData = {
    'firstName': $scope.firstName,
    'lastName': $scope.lastName,
    'email': $scope.email
};

对于您的信息，HTTP标头由$ http服务

自动设置

var config = {
    headers: {
        'Content-Type': 'json'
    }
};

如何从AngularJS向本地服务器上的应用程序发出$ http请求？

1 个答案: