415 (Unsupported Media Type) in $http.post method

Question

I'm quite new to REST and AngularJS, but after several hours of googling I couldn't find any answer to my question:

I'm trying to do a POST request from my angularjs frontend to my backend implemented in java (using JPA).

When I'm trying to create a json-object and to do a POST I always get the 415 (Unsupported Media Type) error.

(Actually I don't even get "into" the scope of the service (i.E. "IN SERVICE" doesn't get printed to the console).. If I add postData.toJSON(), it actually gets "POSTed", but arrives null ...

how do I have to format my 'postData' in Order to succesfully get POSTed?

(I also tried to write the Date-properties without ' " ' - no luck...)

Thank you for your help!

---

FrontEnd:

app.controller('WorkController', function($scope, $http) {

$scope.saveWork = function () {

    var postData = {
    "status" : "OPEN",
    "startDate": "1338364250000",
    "endDate": "1336364253400",
    "WorkText" : "Test"
    };


    $http.post("http://localhost:8080/service/v1/saveWork", postData)
        .success(function(data, status, headers, config){
            console.log("IN SAVE WORK - SUCCESS");
            console.log(status);
        })
        .error(function(){
            console.log("ERROR IN SAVE WORK!");
        })
}

});

Service:

@POST
@Consumes(MediaType.APPLICATION_JSON)
public Response save(WorkDto wo){
            System.out.println("IN SERVICE");
    if(ass == null){
        System.out.println("Could nor persist work- null");
        return Response.noContent().build();
    } else{
        Work workDao = WorkTransformator.transform(wo);
        workDao.persist();
        return Response.ok().build();
    }
}

Answer 1

Instead of building and sending a parsed JSON object, create a javascript object and send that in your post body. You can reuse your postData object, but try removing the "" surrounding properties names.

Try this:

    var postData = {
        status : "OPEN",
        startDate: "1338364250000",
        endDate: "1336364253400",
        workText : "Test"
};

UPDATE

Looks like the above doesn't work by itself. I thought that the Content-Type would be infered.

Can you try to do the post request this way :

    $http({
       method: 'POST',
       url: 'http://localhost:8080/service/v1/saveWork',
       data: postData,
        headers: {
            'Content-Type': 'application/json'
   }}); // complete with your success and error handlers...
        // the purpose is to try to do the post request explicitly
        // declaring the Content-Type you want to send.

UPDATE 2

If this didn't work, compose a post request using Fiddler, and check what's the response. Here's some pointers:

• Download Fiddler2 if you dont already have it
• Compose a request like in the screenshot below

You can then check on the pane on the left for what was the server response code. Double click that line (Ignore the error code on the screenshot...you should be getting a 415)

After double-clicking the response line, you can check and browse for more details on the right pane:

If you can successfuly post with a «manufactured» JSON object then the problem resides on your Angular code. If not, it's certainly something wrong with your Rest Service configuration.

You can also inspect the details of your POSTS made with the Angular app in Fiddler2. That should give you a good insight of what's going on.

If you're into it, you can then update your question with some screenshots of your Angular app requests. That will certainly help us to help you :)