Vue-resource: Won't decode JSON

[Jigsaw5279]

On my production server, vue-resource won't unwrap a json response, despite having the correct Content-Type headers.

The issue only appears in chrome and is reproducible:

On my Testserver, the very same line produces the following output (compare data attribute):

I tried removing the custom X- headers and other things, but I just can't get it to run properly..

[Jigsaw5279]

I think I've found the error. the body interceptor explicity looks for Content-Type in uppercase letters.

I'm using SPDY with my nginx server and it requires headers to be lowercase.
Therefor the content-type header is not found and thy body is not converted into an object.

[Jigsaw5279]

Yup.
Solved the Issue by using a custom interceptor:

Vue.http.interceptors.unshift(function(request, next) {
    next(function(response) {
        if(typeof response.headers['content-type'] != 'undefined') {
            response.headers['Content-Type'] = response.headers['content-type'];
        }
    });
});

[hyiso]

got the same problem, thx for your solution👍

[citti]

just an FYI - outdated versions of PHP cause this issue as well. need to be >5.4 i believe.

[jeiman]

Hey guys, curious to know and it's my first time playing around with Vue, where do I go about applying that solution?

Do I patch it in my main.js - where all my vue components are being instantiated from? or do I use it when I make a HTTP request ?

I am facing the same issue with my v-for inconsistency with my local and production server.