Pyramid does not work with angular $ http post

Question

$http({method: 'POST', url: 'http://localhost:5001/products', data: {token: $scope.product.token}}).success( function () { alert('success'); } ); 

On the pyramid side, request.POST shows that NOVars: Not a form request. Not HTML form submission (Content-Type: application / json)

I use cornice to provide my api (/ products) and I think this is a pyramid problem.

Anyone have a solution?

Answer 1

Angular sends the body of the message (data) as application/json , while forms usually send as application/x-www-form-urlencoded . Pyramid parses the body and allows you to access it in request.POST when it is encoded as normal form.

It is not possible to represent all data encoded in the Angular (json) way as a key / value pair, as provided by the pyramid API.

 [ 1, 2, 3, 4 ] 

Pyramid side decision

It can be allowed to view or globally

In view

This is a pyramidal way and the most flexible way to handle it.

 @view_config(renderer='json') def myview(request): data = request.json_body # deal with data. return { "success" : True } 

Worldwide

The pyramid will most likely be installed on the assumption that the body encoded as application/json is an object and its properties will be placed in the request. POST

Angular side solution

As for the side of the pyramid, it can be solved on request and around the world.

Per request

You need to send data, as forms are usually 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 () {}); 

Worldwide

To send messages by default form, configure $ httpProvider for this.

 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 application:

 angular.module("app", ["httpPostAsForm"]); 

Answer 2

AngularJS $ http.post is different than jQuery. The data you submit is not sent as a form, but as json in the request body. Thus, your idea of ​​the pyramid cannot decode it, as usual. You must either:

• directly access the request body and decode it in the form of a pyramid;
• or change your angularjs code to post your data as form content: see fooobar.com/questions/14277 / ...

Answer 3

angular $ post response makes an OPTIONS request first, and then performs a POST request, gets data from request.json_body

Answer 4

Use req.json_body if you post some json-decoded content. req.GET , req.POST , req.params handle req.params only. Btw, $ http → ngResource → restangular ...

Answer 5

Try setting the contenttype to $ 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); }); }; 

Answer 6

You can simply get the POST data this way:

 query = json.loads(request.body)