this.$http.post can't execute

[wangxiaoyao]

follow is my code .

addImages: function(photo_name, photo_path, status){
      Vue.http.options.emulateJSON = true;
      console.log(photo_name,photo_path,status);
        this.$http.post(this.postImagesUrl,
          {
            pic_name : photo_name,
            pic_path : photo_path,
            status : status
          },
          {headers : {'Content-Type': 'application/x-www-form-urlencoded' }
          }).then((response)=>{
            this.listImages()
      })
   }

I want to add my images .there are three param : photo_name, photo_path ,status. follow is my post

but in my response and JSON .there is wrong

.

so i use ajax . follow is my code

$.ajax({
        url: this.postImagesUrl
        type:"POST",
        data:{
                pic_name : photo_name,
                pic_path : photo_path,
                status : status
        },
        success: function(){
            alert(1);
         }
       });

it is ok and success. but why vue-resource can't do it ?

[shepelevstas]

I have similar problem.
in 'vue-resource/docs/http.md' it is put like this:
post(url, [body], [options])
then goes a list of Options, which INCLUDES "url", "body", "headers", "params", "method", ...
these "Options" is [options] or is it not? If it is, then what the difference between [body] and "Option" body?
If I want to post some {data: value} with some "headers" what should i do?
.post('/url', {data:value}, {headers:{'some_header':'my_header'}}).then(...
or
.post('/url', {data:value, headers:{'some_header':'my_header'}}).then(...
or
.post('/url', {body:{data:value}, headers:{'some_header':'my_header'}}).then(...
or
.post('/url', {url:'/url', method:'POST', body:{data:value}, headers:{...
I can make many more guesses, I'm lost=)
So far I failed to post a data object along with headers.
No help in vue-resource/docs/recipes.md or vue-resource/docs/api.md.
Could you give an example?

[cool4zbl]

Same problem here. Cannot set post option.

[stangsdado]

Same issue here. Any luck on figuring out what we're doing wrong?

[shepelevstas]

Yeah. I've figured it out for myself: It is easier to use plain XMLHttpRequest.

[stangsdado]

So I’m not sure if this is a solution but after I ran into this problem with vue-resource, I tried axios. When the same issue arose with axios, I read up some more and found a solution.

It would seem that the POST data (body) needs to be submitted as a string. So where you would ordinarily do:

{var1: 47, var2: “foo”}

you would instead provide:

‘var1=47&var2=“foo”’

It may be worth a shot to try with vue-resource.

[hc000]

Figured it out, its the API that needs accept the headers in the cors header.