I use Spring Data REST and AngularJs and have a problem with my http-request.
After a successfull request, my data doesn't includes the ID.
My request is below:
$scope.getAllHolidays = function(){
var URL = String('http://localhost:8080/holidays/');
$http({
url: URL,
method: 'GET',
contentType: 'application/json'
})
.then(useData);
};
For having access to a table-field, I'm using this code:
$scope.title = data.data._embedded.holidays[0].title;
But in data, the ID isn't included, so that this won't work:
$scope.id = data.data._embedded.holidays[0].holiday_id;
I noticed, that every get-request for a single table (like /users or /holidays above) won't give me the ID, but with a findBy-request I'll get it.
Please help me.
Related
I am using fuse template and accessing my web service by using $http, its working fine if i am using method: 'POST' without send any data but whenever i am adding some data with post like: data: {text:'test'} and send request to my web service its change the method type POST to OPTIONS.
My Code:
$scope.submit = function(){
$http({
method: 'POST',
url: 'http://www.example.com/api-link',
data: {test: 'hello'},
header: {
'Content-Type': 'application/x-www-form-urlencoded'
}
}).then(function(result){
console.log(result);
});
}
When i am checking in browser network its showing method type OPTIONS. Can anyone please tell what is wrong in my code?
Thanks
I am trying to post data to a web service but the data is missing.
Here is the code
var product = {
CategoryID: 'test'
};
$http({
url: URL,
method: "POST",
data: product,
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
.success(function(data,status,headers,config) {
console.log(data);
})
.error(function(data,status,headers,config) {
console.log(data);
});
The POST data on the server is empty.
I have set up Access-Control-Allow-Origin,Access-Control-Allow-MethodAccess-Control-Allow-Headerss and Access-Control-Allow-Headers on the server.
This API works fine when tested through Postman
For your issue try a look at this one How do I POST urlencoded form data with $http in AngularJS? - you probably need to transform your request in order to sent in via $http service with the required content type.
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 am creating an simple TODO app using AngularJS, i POST the data to server when response comes, that response i want to store it existing variable and refresh the view. i.e
// This stores on page load, its working fine
var todos = $scope.todos = sever_passed_data;
but when i do,
$scope.$watch('todos', function () {
var request = $http({
method: "post",
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
url: my_url,
data: $.param({todos_list: angular.toJson(todos)})
});
request.success(function(responce){
var todos = $scope.todos = responce;
});
}, true);
after this it gives me weird(it goes in infinite loop and posting data to server) output, i mean the responce doesn't stores in todos variable.
If you want to store the returned value of the HTTP POST in the $scope.todos variable, you should use response.data. response contains the entire HTTP response, including the response code, response headers, response body, etc.
Why are you declaring the local variable todos? It will go out of scope as soon as the function exits. just assign $scope.todos. Also, you might want to use then instead of success. Here's an example:
$http({
method: "POST",
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
url: my_url,
data: $.param({todos_list: angular.toJson(todos)})
}).then(function(response) {
$scope.todos = response.data;
});
$http({method: 'POST', url: 'http://localhost:5001/products', data: {token: $scope.product.token}}).success(
function () {
alert('success');
}
);
In the pyramid side, request.POST show that NOVars: Not a form request. Not an HTML form submission( Content-Type: application/json)
I am using cornice to provide my api(/products) and I thinks it is pyramid's problem.
Does anyone have a solution?
Angular sends the post body (data) as application/json while forms are normally sent as application/x-www-form-urlencoded. Pyramid parses the body and let you access it in request.POST when it's encoded as a normal form.
It is not be possible to represent every data encoded the Angular way (json) as a key/value pair like is provided by pyramid API.
[
1,
2,
3,
4
]
Solution on Pyramid side
It can be solved per view or globally
Per view
This is the pyramid way and the most flexible way to handle this.
#view_config(renderer='json')
def myview(request):
data = request.json_body
# deal with data.
return {
"success" : True
}
Globally
Pyramid can most likely be set to assume a body encoded as application/json is an object and its properties be put in request.POST.
Solution on Angular side
As with the pyramid side, it can be solved per request and globally.
Per request
You need to send the data the way forms are normally sent:
$http({
method: 'POST',
url: url,
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
transformRequest: function(obj) {
var str = [];
for(var p in obj) {
if (obj.hasOwnProperty(p)) {
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
}
}
return str.join("&");
},
data: xsrf
}).success(function () {});
Globally
To send posts as form by default, configure the $httpProvider to do so.
angular.module('httpPostAsForm', [])
.config(['$httpProvider', function ($httpProvider) {
$httpProvider.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
$httpProvider.defaults.transformRequest.unshift(function (obj) {
var str = [];
for(var p in obj) {
if (obj.hasOwnProperty(p)) {
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
}
}
return str.join("&");
});
}]);
Then include this module in your app:
angular.module("app", ["httpPostAsForm"]);
AngularJS $http.post is different from jquery's. The data you pass is not posted as a form but as json in the request body. So your pyramid view can not decode it as usual. You have to either:
directly access the request body and decode it in your pyramid view;
or modify your angularjs code to post your data as form content : see this other question in stackoverflow
the answer is angular $post do OPTIONS request first and then do the POST request, get data form the request.json_body
Use req.json_body if you post some json-decoded content. req.GET, req.POST, req.params only cope with from submissions. Btw, $http -> ngResource -> restangular ...
Try setting contenttype in $http, something like below.
$http(
{
url: url,
contentType: "application/json",
data: data,
method: method
})
.success(function (response) {
successcb(response);
}).error(function (data, status, headers, config) { errorcb(data); });
};
You can simply get the POST data this way:
query = json.loads(request.body)