title: Cross-Origin Request Blocked on Vuejs with axios
body: <p>I'm using Vuejs and axios to make web requests, so far i'm able to GET, POST and PUT but i have now to upload media on server and the server requires to request (2 steps) to be sent in order to upload the image.</p>
  
  <p>On first steps I'm able to get the upload url link from server inside my promise send the required headers. On step 2 i just need to PUT that url i get from step 1 and PUT the image file, along with the same headers i sent on step 1.</p>
  
  <p>I get the Cross-Origin Request Blocked request and I don't know what is causing my problem.</p>
  
  <p>Here is my code:</p>
  
  <pre><code> onPickFile() {
          var accessToken
          var self = this;
  
          firebase.auth().currentUser.getIdToken( /* forceRefresh */ true).then(function(idToken) {
              accessToken = idToken
              console.log("Id: " + self.id)
              console.log("Token : " + accessToken)
              var config = {
                  headers: {
                      'Authorization': 'Bearer ' + accessToken,
                      'Content-Type': self.image.type,
                      'Media-Type': 'profile_image',
                      'x-goog-meta-media-type': 'profile_image',
                      'x-goog-meta-uid': self.id,
                  }
              }
              console.log(config)
  
              axios.post('apilink', { // Step 1 - this is ok i can get the returned url
                  content_type: self.image.type
                  }, config). //here is first step
              then(response =&gt; {
                  console.log("Response URL is: " + response.data.upload_url)
                  self.uploadUrlLink = response.data.upload_url
  
                  console.log("Id: " + self.id)
                  var config_2 = {
                      headers: {
                          'Authorization': 'Bearer ' + accessToken,
                          'Content-Type': self.image.type,
                          'Media-Type': 'profile_image',
                          'x-goog-meta-media-type': 'profile_image',
                          'x-goog-meta-uid': self.id,
                      }
                  }
                  console.log(config_2)
                  axios.put(self.uploadUrlLink, self.image , config_2) // Step 2 - Headers are not showing on "request headers"
                  .then(response =&gt; { 
                      console.log("Response on PUT Image OK: " + response)
                  })
                  .catch(e =&gt; {
                      console.log("Error on PUT image: " + e)
                  });
  
              })
              .catch(e =&gt; {
                  console.log("Error on response on POST Image first step: " + e)
              });
          }).catch(function(error) {
              console.log("Error on getting token: " + error)
          });
  
      },
  </code></pre>
  
  <p>I can't see my headers on <code>request headers</code>:
  <a href="https://i.stack.imgur.com/OvEPr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/OvEPr.png" alt="enter image description here"></a></p>