This is my code:
$scope.doLogin = function() {
$http({
method: "POST",
url: "http://localhost:8000/api/v1/user/user_signin",
data: { username: $scope.user.username, password: $scope.user.password },
headers: { 'Content-Type': 'application/json' },
responseType:'json'
}).success(function (data) {
console.log('data success');
console.log(JSON.stringify(data));
})
.error(function(data, status, headers,config){
console.log('data error');
});
};
Consol says:
data success
null
What I do wrong?
P.S.: API request is correct - I checked it in postman.
You set responseType to 'json' make sure that your server side is also sending the response compatible to your format 'json'.
Or simply remove the response type check if it works
Related
I'm trying to post data from my form to an API on another domain. Request body comes back empty.
When I go to devtools, payload shows as [object Object]
I tried setting different headers like 'Content-Type' : 'application/json' or undefined but had no luck
CODE
$scope.form
{
"name":"Test",
"email":"test#test.com",
"companyName":"company",
"companySize":"6 - 10 employees",
"manageTimeOff":true
}
submit function
$scope.submitForm = function () {
$scope.success = false;
$scope.loading = true;
$http({
url: url,
method: 'POST',
data: $scope.form,
withCredentials: false,
headers: { "Content-Type": "application/x-www-form-urlencoded" },
transformRequest: angular.identity
}).then(function (response) {
console.log(response);
$scope.loading = false;
if (response.data.Error) {
$scope.success = false;
swal("Something's gone wrong ☹", response.data.Error, "error")
} else {
$scope.success = true;
swal({
title: "Form Submitted",
text: "We look forward to speaking with you soon!",
icon: "success"
});
$scope.resetForm();
}
});
}
Content type x-www-form-urlencoded is obsolete. Design backends to use content type application/json which the AngularJS framework supports by default.
$http({
url: url,
method: 'POST',
data: $scope.form,
withCredentials: false,
̶h̶e̶a̶d̶e̶r̶s̶:̶ ̶{̶ ̶"̶C̶o̶n̶t̶e̶n̶t̶-̶T̶y̶p̶e̶"̶:̶ ̶"̶a̶p̶p̶l̶i̶c̶a̶t̶i̶o̶n̶/̶x̶-̶w̶w̶w̶-̶f̶o̶r̶m̶-̶u̶r̶l̶e̶n̶c̶o̶d̶e̶d̶"̶ ̶}̶,̶
̶t̶r̶a̶n̶s̶f̶o̶r̶m̶R̶e̶q̶u̶e̶s̶t̶:̶ ̶a̶n̶g̶u̶l̶a̶r̶.̶i̶d̶e̶n̶t̶i̶t̶y̶
}).then(function (response) {
//...
});
This works for me
// default post header
$http.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
// send login data
$http({
method: 'POST',
url: 'abc.php',
data: $.param({
email: "abc#gmail.com",
password: "password"
}),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).then(function (data, status, headers, config) {
// handle success things
}).catch(function (data, status, headers, config) {
// handle error things
});
This does not
$http.post('abc.php', {email: "abc#gmail.com",
password: "password"})
.then(function(res){
$scope.response = res.data;
})
Hi could you please elobrate why first implementation is working second doesn't. I'm very confused with short cut and long cut angular method
Thanks in advance
Fundamentally, the problem lies with your server language of choice being unable to understand AngularJS’s transmission natively.
$http.post is transmitting your data as Content-Type: application/json
Change the header to URL Encoded as below :-
$http.post("abc.php", requestData, {
headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
transformRequest: transform
}).success(function(responseData) {
//do stuff with response
});
The second snippet should like this
$http.post('abc.php', {email: "abc#gmail.com",
password: "password"})
}).then(function(res){
$scope.response = res.data;
});
I am trying to send the registration form data to an api that registers the user and provides the success response. I am getting the following error while try to send the data through $http
/ringleader/www/#!/register:1 XMLHttpRequest cannot load
http://72.5.146.113/portal-app/API/addRingLeader/?0=f&1=i&10=s&100=c&101=i&…
87=d&88=g&89=%26&9=%3D&90=p&91=r&92=o&93=d&94=u&95=c&96=t&97=%3D&98=S&99=o.
Response for preflight has invalid HTTP status code 404
Here is my controller
.controller('loginController',function($scope,authService){
$scope.login = function(data){
authService.login(data).then(function(response){
console.log(response.status + " ------ "+JSON.stringify(response));
},function(err){
if (err) {
console.log(err);
}
})
}
})
.controller('registerController',function($scope,authService){
$scope.register = function(data){
authService.register(data).then(function(response){
console.log(response.status + " ------ "+JSON.stringify(response));
},function(err){
if (err) {
console.log(err);
}
})
}
})
and this is my service
.factory('authService',function($http){
return{
register : function(data){
return $http({
url: 'http://72.5.146.113/portal-app/API/addRingLeader/',
method: 'POST',
params: $.param({
firstname : data.firstname,
lastname : data.lastname,
email : data.email,
mobile : data.mobile,
password : data.password,
product : "Social"
}),
dataType: "jsonp",
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
})
},
login : function(data){
return $http({
url: 'http://72.5.146.113/portal-app/API/signIn/',
method: 'POST',
params: $.param(data),
dataType: "jsonp",
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
})
}
}
})
and this is how the response should look like.
I am trying to send array subjectAverage to nodejs route. I am using express route, its showing unidentified when trying to print on console.
var app = angular.module("myapp", [])
app.controller("ListController2", ['$scope','getAverage','$http',function($scope, getAverage,$http) {
$scope.subjectAverages = [{
'subjectName': '',
'yearSem': '',
'studentsAppeared': '',
'studentsPassed':'',
'percentage':'',
'average':'',
'facultyComment':''
}];
$scope.save=function(){
var data =angular.toJson($scope.subjectAverages)
var objectToSerialize={'object':data};
$http({
url: 'app',
method: "POST",
data: $.param(objectToSerialize),
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
}
}).success(function(data){
alert("done");
});
}
router.post('/app',function(res,req){
console.log(req.body);
});
Please guide.
Try this :
$scope.save=function(){
var data = {object : $scope.subjectAverages};
$http({
url: '/app',
method: "POST",
data: data,
headers: {
'Content-Type': 'application/json'
}
}).then(function(data){ //.success is deprecated,so use .then
alert("done");
})
.catch(function(err){//using .catch instead of .error as it is deprecated
console.log("Error in request =>", err)
});
I have created a basic angular $http.post request to receive some data. In order to receive the data I need to provide a key in the header.
The server is responding that the key is missing even though I've explicitly sent it.
100% it's not the server because I used an online curl tool which provided the required response.
$http.post(url, {
data:{username: username,password: password},
headers:{'Content-Type': 'application/x-www-form-urlencoded','key': key},
})
.then(function(response){
console.log(response)
})
It would be appreciated if someone could spot what I'm doing wrong here. Thanks.
You have a trailing comma after the headers key, perhaps this is throwing things off?
$http.post(url, {
data:{username: username,password: password},
headers:{'Content-Type': 'application/x-www-form-urlencoded','key': key}, // Remove this comma
})
.then(function(response){
console.log(response)
});
According to docs should be:
Shortcut method
$http.post('http://localhost:9191/api/signin', {
username: 'some username',
password: 'some password'
}, {
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
'key': '123'
}
})
.then(function(response) {
console.log(response)
});
Long version
$http({
method: 'POST',
url: 'http://localhost:9191/api/signin',
data: {
username: 'some username',
password: 'some password'
},
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
'key': '123'
}
}).then(function(response) {
console.log(response)
});
Tested and is working fine.