Flask API: How can I pass a param to url in angularjs $resource PUT method correctly?

Question

I have the follow code, a factory that consumes an API rest:

angular.module('teachers')
.factory("TeachersService",
    function($resource) {

     var restPath = 'http://localhost:8001/entities/teacher/';

     return $resource(restPath + ':id', { id: "@teacherId" }, {

         'getSubjects': {
             method: 'GET',
             url: restPath + ':id' + '/subject',
             isArray: true
         },

         'update': { method: 'PUT'},

         'getClasses': {
             method: 'GET',
             url: restPath + ':id' + '/class',
             isArray: true
         }

     });


    });

In a controller I use the factory:

        vm.teacher = TeachersService.get({id: vm.teacherId}, function() {
            console.log(vm.teacher)
        }, function() {
            console.log('Teacher not found')
            vm.teacher = null;
        })

And the data is retrieved fine, but now I need update the data of this entity, and I want to use update method that the factory has:

            vm.teacher.$update(function() {
                console.log('success')
            }, function(error){
                console.log('error')
                console.log(error)
            });

But I don't know why it always give me a fail (the methods works with curl and with another programs like postman).

This is an example of header of fail:

Object { data: null, status: -1, headers: fd/<(), config: Object, statusText: "" }

I don't understand what's happens, I think that the problem is in the way that I pass the id. I'm sure that the entity vm.teacher has a teacherId value with an integer but I don't know why this is not passed. Also, I see the network console of Firefox (in my case) and I see that the call to server isn't exists but when I change the definition to id, like this for example :

{ id: "@_teacherId" }

The call is done but with error because the url haven't the entity identifier at end, and the server in PUT method need it.

An example of a fake user is (after to get it):

Object { createdBy: 1, phone: "+34740 51 73 72", createdAt: "Tue Oct 25 12:58:30 2016", name: "Alvaro", address: "Callejón Lourdes Pozuelo 11 Apt. 54…", teacherId: 4, $promise: Object, $resolved: true }

Any idea? I'm blocked too many times.

Thanks!

EDIT

If I change the code and set GET method the call it does:

         'update': {
             method: 'GET',
             url: restPath + ':id'
         }

but not when the method is PUT:

         'update': {
             method: 'PUT',
             url: restPath + ':id'
         }

What happens with this `TeachersService.update({ id:vm.teacherId}, vm.teacher);` ? — Searching, Nov 02 '16 at 22:26
@Searching this way give me the same error: `Object { data: null, status: -1, headers: fd/<(), config: Object, statusText: "" }` — Juan Antonio, Nov 03 '16 at 09:44
@KScandrett I don't know why but this solution doesn't work for me. — Juan Antonio, Nov 03 '16 at 09:55
Status of -1 indicates AngularJS internal error such as timeout or Same Origin Policy/CORS problem. — georgeawg, Nov 03 '16 at 18:02
It's not well documented: " -1 usually means the request was aborted" from [AngularJS http.js line#483](https://github.com/angular/angular.js/blob/master/src/ng/http.js#L438) Also [docs($http): add better explanation for error status codes](https://github.com/angular/angular.js/commit/0727bfc141db6e60bce2fb1e09ad4f53963dec5d) — georgeawg, Nov 03 '16 at 18:37

Juan Antonio · Accepted Answer · 2016-11-03T18:08:46.863

Finally,the problem was in the Flask API, where I needed enable Cross-Origin Resource Sharing (CORS) mechanism. Because of this I tried again and again the examples without success, the problem wasn't in the $resource code at end.

Status of -1 indicates AngularJS internal error such as timeout or Same Origin Policy/CORS problem. Thanks to @georgeawg .

In service the code was fine:

'update': {method: 'PUT'},

In controller it was fine also:

 vm.teacher.$update()

In my flask api I've needed add this:

from flask.ext.cors import CORS, cross_origin
...
app = Flask(__name__)
CORS(app)

More info about flask-core in doc: flask-cors.

Flask API: How can I pass a param to url in angularjs $resource PUT method correctly?

1 Answers1