[英]Angularjs $HTTP POST JSON data to server issue
I'm trying to send JSON data from a front-end form (angularJS) to the server (express/nodejs) then to MongoDB.我正在尝试将 JSON 数据从前端表单 (angularJS) 发送到服务器 (express/nodejs),然后发送到 MongoDB。 However, I can't seem to send the data, when I log the data at the server end it gives me an empty data field (see pic below).但是,我似乎无法发送数据,当我在服务器端记录数据时,它给了我一个空的数据字段(见下图)。
Client Front-end HTTP POST code客户端前端 HTTP POST 代码
$http(
{
method: 'POST',
url: 'http://localhost:3456/todo',//Server URL
headers: {
'Content-Type': 'application/json',
'Accept':'application/json'
},
data: {item:'From Angular'}
}).then(function successCallback(response) {
console.log('Congrats, sent to Server');
console.log(response);
}, function errorCallback(response) {
console.log('Not sent to Server');
console.log(response);
});
Server end (POST request handler)服务器端(POST请求处理程序)
app.post('/todo',jsonParser,function(req,res){
var newTodo = Todo(req.body).save(function(err,data){
console.log(data);
console.log(req.body);
if(err) throw err;
res.json(data);
});
});
Client-end POST request (from angularjs)客户端 POST 请求(来自 angularjs)
How it should be应该如何
The problem is I can't seem to send the "data" to the server.问题是我似乎无法将“数据”发送到服务器。 On the server-side, it shows up empty as shown in Image 1 .在服务器端,它显示为空,如图1所示。 All the data ends up inside config -> data(as shown in 1 ) whereas the data field is empty.所有数据最终都在 config -> data(如1所示)中,而 data 字段为空。
Please find below the working code that I used, hope it would be helpful:请在下面找到我使用的工作代码,希望它会有所帮助:
JSON (idList.json): JSON (idList.json):
[
{
"id": "G01032014",
"password": "1234"
},
{
"id": "G01032015",
"password": "12345"
},
{
"id": "G01032016",
"password": "123456"
}
] ]
server.js :服务器.js:
app.post('/authenticate', function(req, res) {
console.log(req.url);
var id = (req.body.id);
var pass = (req.body.pass);
console.log(id);
console.log(pass);
var sendData = {
"status":false,
"user":id
};
var readId = require('./idList.json');
for(var i=0;i<readId.length;i++) {
if(id == readId[i].id && pass == readId[i].password) {
console.log('matched');
sendData.status = true;
i=readId.length;
}
}
res.end(JSON.stringify(sendData));
});
AngularJs Controller: AngularJs 控制器:
$scope.auth = function() {
if($scope.id == "" || $scope.pass == null){
alert('please fill details');
} else {
var subData = {
"id":$scope.id,
"pass":$scope.pass
};
$http.post('/authenticate', subData).success(function(data) {
$scope.reponse = data;
console.log($scope.reponse.status);
if ($scope.reponse.status) {
$scope.activate = false;
} else {
alert('incorrect id or password');
}
});
}
$scope.id = '';
$scope.pass = '';
};
HTML : HTML :
<div>
<span>Login</span><hr>
User id :<input type="text" ng-model="id" value="id" placeholder="user id" />
Password: <input type="password" ng-model="pass" value="pass"
placeholder="password" />
<input type="submit" value="Login" ng-click="auth()" />
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.