我不能做一個需要用axios設置標頭的請求

Question

我正在嘗試從外部API（來自Mashape）獲取一些數據，這些數據需要特定的標頭來設置API密鑰。

使用jQuery一切都很好：

 $.ajax({ url: 'https://omgvamp-hearthstone-v1.p.mashape.com/cardbacks', type: 'GET', data: {}, dataType: 'json', success: function(data) { console.dir((data.source)); }, error: function(err) { alert(err); }, beforeSend: function(xhr) { xhr.setRequestHeader("X-Mashape-Authorization", "MY_API_KEY"); } }); 

但是，當我嘗試使用axios為反應應用程序執行相同的請求時，我遇到404錯誤：

 axios.get({ url: 'https://omgvamp-hearthstone-v1.p.mashape.com/cardbacks', headers: { "X-Mashape-Authorization": "MY_API_KEY" } }) 

有什么我想念的嗎？ 謝謝。

Answer 1

我終於明白了。

我們需要在請求之前使用axios.defaults.headers.common['header_name'] = "API_KEY";設置標題axios.defaults.headers.common['header_name'] = "API_KEY"; ：

axios.defaults.baseURL = 'https://omgvamp-hearthstone-v1.p.mashape.com';
axios.defaults.headers.common['X-Mashape-Key'] = "API_KEY";
axios.get('/cardbacks')
    .then((resp) => {
        console.dir(resp);
    });

Answer 2

嘗試這樣做而不設置默認值：

axios.get('https://omgvamp-hearthstone-v1.p.mashape.com/cardbacks', {
      headers: { "X-Mashape-Key": "MY_API_KEY" }
    })
      .then((resp) => {
        console.dir(resp);

      })
      .catch(err => {
        console.log(err);
      });
  }

它應該工作。

PS我還觀察到您使用了不同的標題鍵（X-Mashape-Authorization）和答案（X-Mashape-Key）。 也許這也與404錯誤有某種關系？

Answer 3

我有更好的方法來解決這個問題。

您只需要從axios添加參數格式，如下所示：

 axios({ method: <method>, url: <url>, data: <params>, headers: { common: <headers> }, }) .then(response => { if (!cb) return { error: 'No callback' }; return cb(response); }) .catch((err) => cb(err.response));