Having difficulty with a temporary work around but the intent was to add to a http put request a header with string value, 'username' : 'flastname'. Within the service that invokes the put call, just before the $http.put call, the username header is to be set.
$http.defaults.headers.post.username = 'flastname';
$http.put('http://localhost:8080/xxxxx-integration/api/claims',claim);
Server side, retrieving a http header 'username' always results in null and in the even stranger behavior than expected category is random numbers of http put calls are generated. Thought I followed the documentation at:
https://docs.angularjs.org/api/ng/service/$http
but maybe read it wrong.
Have you tried the shortcut method? According to the docs, you should be able to do it like so:
put(url, data, [config]);
$http.put('http://localhost:8080/xxxxx-integration/api/claims',claim , {
headers: {'username': 'flastname'}
});
var req = {
method: 'PUT',
url: 'http://localhost:8080/xxxxx-integration/api/claims',
headers: {
'username': 'flastname'
},
data: { test: 'test' } // json for data
}
now just put the req varaible inside $http :)
$http(req).then(function()...)
Related
Preface: I am using AngularJS 1.5.9.
When writing my service, this code works when posting to the server:
var request = {
url: '/connect/token',
method: 'POST',
data: $httpParamSerializer(params),
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
};
$http(request).then(function(response) {});
However, it seems counterintuitive to use data when $http has the usage argument params, with the following definition as per AngularJS's documentation:
params – {Object.} – Map of strings or objects which
will be serialized with the paramSerializer and appended as GET
parameters.
As you can see, the documentation specifies that this argument is meant to be used only for GET requests. I confirmed as much when I attempted to use the params argument with my POST request:
var request = {
url: '/connect/token',
method: 'POST',
params: params,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
};
$http(request).then(function(response) {});
When you submit the POST request in this way, you get the following response from the server:
{
"error":"invalid_request",
"error_description":"A malformed token request has been received: the mandatory 'Content-Type' header was missing from the POST request."
}
In other words, if I don't use the data argument and invoke the param serializer service on the params I want to pass in, my custom service won't set the Content-Type header on my request, I've confirmed this in the network tab of the web inspector.
TLDR; Why do I have to use the data argument and serialize the params instead of just using the params argument directly? And why is the content type I specify ignored when I do use the params argument?
Use params option for GET requests.
With params option you can set URL query string parameters like baseurl.com?myParam=something
My REST backend [ based on NodeJS/express/mongojs] is complaining 404 (not found) when Params are attached as part of URL. Backend rest interface is coded as below;
var express = require('express');
var router = express.Router();
router.get('/login', auth.signin); //auth.signin is code to verify user
Above REST service is consumed by AngularJS based frontend through $resource as below;
Definition:
angular.module('myapp').factory('signinmgr', function($resource) {
return $resource("http://localhost:3000/login", {}, {
'get': {
method: 'GET',
headers: {
'Content-Type': 'application/json'
}
}});
Usage:
signinmgr.get({'username':'myname', 'password':'mypass'}, function(data){
//success
}, function(x){
//failed
});
Problem:
Frontend code above produces a URL to consume REST service where parameters are part of URL i.e. http://localhost:port/login?username=myname&password=mypass [if I use GET method, POST is OK]. I wanted my front end to keep URL as http://localhost:port/login and post any parameters through body as backend is using req.body.paramName to read those. [Actual Solution]
If (1) cannot be done, and my frontend is sending params as part of URL, I needed help as to know how to equip my backend to allow this URL with parameters so that backend doesnt return 404 as the base URL http://localhost:port/login is already there.
PS: for (1), I tried this thread with data:{username:'',password:''} but of no use. Please help if I am missing something very obvious or some concept.
Try the $http service instead:
angular.module('myapp').factor('signinmgr', function($http) {
return {
login: function (username, password) {
$http.post("http://localhost:3000/login", {
username: username,
password: password
}
}
};
});
signinmgr.login('myname', 'mypass').then(function(data){
//success
}, function(x){
//failed
});
Each request that my nodejs/expressjs backend receives has three places for passed attributes;
params{}
query{}
body{}
My problem (1) cannot be fixed in case I want to use GET method since with GET request parameters are visible as part of URL i.e. http://localhost:port/login?username=myname&password=mypass. To send my username/password I had to use POST that sends parameters as part of body{}.
My problem (2) was that I was using GET and mistakenly looking for parameters in body{} of request. Instead, parameters passed as part of URL in GET request are added to query{} of the request.
i'm trying to sending request to third party service. for that i need to delete default header 'x-access-token'. For that did like below
$http({
url: 'http://ip-api.com/json',
method: 'GET',
transformRequest: function(data, headersGetter) {
var headers = headersGetter();
delete headers['x-access-token'];
return headers;
}
}).then(function(res){
console.log(res);
},function(error){
console.log(error);
});
By following this link .
But i'm getting this error
TypeError: Cannot convert object to primitive value
at angular.js:10514
at sendReq (angular.js:10333)
at $get.serverRequest (angular.js:10045)
at processQueue (angular.js:14567)
at angular.js:14583
at Scope.$get.Scope.$eval (angular.js:15846)
at Scope.$get.Scope.$digest (angular.js:15657)
at Scope.$get.Scope.$apply (angular.js:15951)
at done (angular.js:10364)
at completeRequest (angular.js:10536)
"transformRequest" does not work the same way to remove headers for individual requests past angularjs 1.4 release .From the documentation its clear that we should be using "headers" instead
eg:
$http({method: 'GET',
url: "url",
headers: {
'header-name': undefined
}
}).success(function(data){console.log(data)});
The $http service config object allows you to override the http header send for a specific request. See config property headers.
To explicitly remove a header automatically added via $httpProvider.defaults.headers on a per request basis, Use the headers property, setting the desired header to undefined.
NOTE: Set the desire header/headers to undefined like this, then it will not affect the global settings.
See example:
var req = {
method: 'POST',
url: 'http://example.com',
headers: {
'Content-Type': undefined
},
data: { test: 'test' }
}
$http(req).then(function(){...}, function(){...});
See more documentation.
This can take a list of headers or a function that return a list of headers. So for the non auth header request make a copy of the default headers remove the header you don't require and then make the request.
Hope this help well.
I'm a beginner. I've written a test application made of an AngularJs GUI on the client side and a PHP API on the server side.
This is the angular service handling the requests
myApp.factory('Book', ['$resource', 'API_URL', function($resource, API_URL){
return $resource(API_URL + '/books/:bookId', {bookId: '#bookId'}, {
get: { method: 'GET', isArray:true },
update: { method: 'PUT'},
save: { method: 'POST'},
delete: {method:'DELETE'},
});
}]);
When I submit a book from the Angular app I can catch the POST in Slim by using
$post_a = json_decode($app->request->getBody());
//$post_b = $app->request->post(); //this would be empty
When I use Postman and I perform a POST I can catch the POST in Slim by using
//$post_a = json_decode($app->request->getBody()); // this would be empty
$post_b = $app->request->post();
I don't get why there is this difference. Could you please explain?
Am I not meant to catch the post just with $app->request->post(); in both the cases? Why the post coming from Angular can be caught only with $app->request->getBody()?
The $app->request->post() method retrieves key/value data submitted in a application/x-www-form-urlencoded request. If the request uses a different content-type (e.g. application/json), you can retrieve the raw request body with the $app->request->getBody() method and decode it as necessary. Let me know if you have further questions.
You could still use
$post_b = $app->request->post()
in Slim.
As long as you call this REST service from html form (AngularJS) by passing the data as form value formatted instead of as JSON.
If in AngularJS you have the data in JSON format, you have to translate it first into form. Below is the example how to invoke this REST service:
Object.toparams = function ObjecttoParams(obj) {
var p = [];
for (var key in obj) {
p.push(key + '=' + encodeURIComponent(obj[key]));
}
return p.join('&');
};
$http({
method: 'POST',
url: url,
data: Object.toparams(myobject),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
myobject is the data in JSON format that is going to be created
Thanks Josh..Your answers works for me.
Steps to follow:
1.You need to send request in json format under raw tab like this:
{"username":"admin","password":"admin"}
2.You need to set Content-Type to application/json in the headers.
That's it and it will work.
I'm using angular and angular-resource version 1.1.5 and I'm using a $resource to make a request to a REST service. But it seems like the custom headers is not appended to the request. My definition is as below. Is there anything I did wrong?
myApp.factory('User', function($resource) {
var User = $resource('http://localhost\\:7017/mydomain/users/jack', { }, {
get: {
method: 'GET',
isArray: false,
headers: {'X-Requested-By':'abc'}
}
});
return User;
});
Read this to see how to configure default headers in one place: http://docs.angularjs.org/api/ng.$http
EDIT:
Your header must be included in Access-Control-Allow-Headers header in response to the OPTIONS request, which is sent automatically prior to your GET request.
You can modify the default headers inside the $httpProvider.
the headers are an object and separated intocommon, patch, post and put
so if you want to change the default for all your requests, just do a
$httpProvider.defaults.headers.put['Content-Type'] = 'application/json';
You have to call get method by using its name, i.e User.get(callback)
It seems that custom headers do not get sent when get method is called with User.query(callback)