使用 Axios 獲取 HTTP 響應正文
當你 await
在 Axios 請求上,您會收到 Axios 響應。 Axios 響應是具有多個屬性的 POJO,包括 data
,其中包含已解析的響應正文。
const axios = require('axios');
const res = await axios.get('https://httpbin.org/get', { params: { answer: 42 } });
res.constructor.name; // 'Object', means `res` is a POJO
// `res.data` contains the parsed response body
res.data; // { args: { answer: 42 }, ... }
res.data instanceof Object; // true
Axios 響應包含其他幾個屬性,例如 status
,其中包含 HTTP 響應狀態碼(如 200
或 404
)。但是大多數時候你並不關心請求成功後的響應代碼,所以你會經常看到直接使用 Promise 鍊式獲取響應體的代碼。
const data = await axios.get(url).then(res => res.data);
您還可以使用解構賦值獲取響應正文。
// Equivalent to `const data = await axios.get(url).then(res => res.data)`
const { data } = await axios.get(url);
自動解析
axios 根據 HTTP 響應的 Content-Type
解析響應 標題。當響應的內容類型為 application/json
, axios 會自動嘗試將響應解析成 JavaScript 對象。
const axios = require('axios');
const res = await axios.get('https://httpbin.org/get', { params: { answer: 42 } });
res.headers['content-type']; // 'application/json'
請記住,響應標頭是由服務器發送的。因此,如果服務器發回不同的內容類型,您可能需要自己處理響應。
對於其他內容類型,例如 text/html
, res.data
屬性將是一個字符串。
const axios = require('axios');
const res = await axios.get('https://httpbin.org/html');
res.headers['content-type']; // 'text/html; charset=utf-8'
typeof res.data; // 'string'
res.data; // '... <h1>Herman Melville - Moby-Dick</h1> ...'
流媒體
你可以配置data
的類型 使用 Axios 的 responseType
的屬性 目的。默認情況下,responseType
設置為 'json'
,這意味著 Axios 會嘗試將響應解析為 JSON。
但是,如果您想使用 Axios 下載圖像,那麼這是不正確的。您可以設置 responseType
到 'arraybuffer'
以 ArrayBuffer 形式獲取響應:
const axios = require('axios');
const res = await axios.get('https://images.unsplash.com/photo-1506812574058-fc75fa93fead', {
responseType: 'arraybuffer'
});
const fs = require('fs');
fs.writeFileSync('./south-beach.jpg', res.data);
你也可以設置responseType
到 'stream'
以 Node.js 流的形式獲取響應:
const axios = require('axios');
const res = await axios.get('https://images.unsplash.com/photo-1506812574058-fc75fa93fead', {
responseType: 'stream'
});
const fs = require('fs');
res.data.pipe(fs.createWriteStream('./south-beach.jpg'));
下一篇
使用 Axios 獲取請求