Vue-resource: How to set headers?

[arthurkirkosa]

Vue.http.headers.common['Content-Type'] = this.file.type;
Vue.http.headers.common['Content-Range'] = `bytes 0-${file.size - 1}/${file.size}`;

this.$http
        .put(this.ticket.upload_link_secure, file)
        .then(this.uploadSuccess, this.uploadFail);

Doing this will set the headers globally and I need to delete some on another request

[nblackburn]

Vue.http.put('foo/bar', {foo: 'bar'}, {
    headers: {
        Authorization: 'Basic dXNlcjpwYXNzd29yZA=='
    }
});

The http methods take a third argument that allows you to specify headers to send along with the request, i hope this helps.

[arthurkirkosa]

If I do that the response for the PUT is 200, but the failed promise fires.

[arthurkirkosa]

@steffans indeed help wanted :) ... where's the help?

[ezeev]

I'm seeing the promise fail here as well. help wanted.

[adelriosantiago]

I don't see the 'Authorization' header being appended. I'm using this structure:

this.$http.get('URL', {}, {
          headers: {
            'Authorization': 'Basic a3Rt...MzQ='
          }
        }).then(response => {
          console.log('response', response)
        })

What I'm doing wrong?

[adelriosantiago]

Ohh never mind about the last question. Silly error, I was sending the header in the wrong parameter.

The correct call should be:

this.$http.get('URL', {
          headers: {
            'Authorization': 'Basic a3Rt...MzQ='
          }
        }).then(response => {
          console.log('response', response)
        })

Thx.

[jhonifaber]

What is the difference between setting the header within the get request:

this.$http.get('URL', {
          headers: {
            'x-access-token': 'XYX'
          }
        }).then(response => {
          console.log('response', response)
        })

and setting the header using interceptors

Vue.http.interceptors.push((request, next) => {
  var accessToken = "XYX"
  request.headers.set('x-access-token', accessToken)
  next()
})