axios是基於Promise的HTTP客戶端,可以在瀏覽器和Node.js中使用。
GitHub地址:https://github.com/axios/axios
安裝
npm install axios
新建一個服務器並啟動,做為數據請求響應的例子。
const http = require('http'); const url = require("url"); const util = require('util'); const querystring = require('querystring'); const port = 3000; http.createServer((req, res) => { res.statusCode = 200, res.setHeader('Content-Type', 'text/plain;charset=utf-8'); if(req.method === 'GET') { toGet(req, res); }else if(req.method === 'POST') { toPost(req, res); } }).listen(port, () => { console.log(`Server listening on: http://localhost:${port}`); }); //獲取GET請求內容 function toGet(req, res){ let data = 'GET請求內容:\n' + util.inspect(url.parse(req.url)); res.end(data); console.log(data); } //獲取POST請求內容、cookie function toPost(req, res){ // 定義了一個data變量,用於暫存請求體的信息 let data = ''; // 通過req的data事件監聽函數,每當接受到請求體的數據,就累加到post變量中 req.on('data', function(chunk){ data += chunk; }); // 在end事件觸發后,通過querystring.parse將post解析為真正的POST請求格式,然后向客戶端返回。 req.on('end', function(){ //data = querystring.parse(data); //res.end('POST請求內容:\n' + util.inspect(data)); data = 'POST請求內容:\n' + data; res.end(data); console.log(data); console.log('cookie內容:\n' + req.headers.cookie); }); }
客戶端axios的請求用法
GET請求用法1,不帶參數。
const axios = require('axios'); axios.get('http://localhost:3000') .then(res => { console.log(res.data); }) .catch(error => { console.log(error); });
運行結果
GET請求內容: Url { protocol: null, slashes: null, auth: null, host: null, port: null, hostname: null, hash: null, search: null, query: null, pathname: '/', path: '/', href: '/' }
GET請求用法2,帶參數。
const axios = require('axios'); axios.get('http://localhost:3000',{ params:{ id: 123, name: 'aa' } }) .then(res => { console.log(res.data); }) .catch(error => { console.log(error); });
運行結果
GET請求內容: Url { protocol: null, slashes: null, auth: null, host: null, port: null, hostname: null, hash: null, search: '?id=123&name=aa', query: 'id=123&name=aa', pathname: '/', path: '/?id=123&name=aa', href: '/?id=123&name=aa' }
GET請求用法3,帶參數。運行結果同上。
const axios = require('axios'); axios({ method: 'get', url: 'http://localhost:3000', params:{ id: 123, name: 'aa' } }) .then(res => { console.log(res.data); }).catch(error => { console.log(error); });
POST請求用法1。
const axios = require('axios'); axios.post('http://localhost:3000',{ id: 123, name: 'aa' }) .then(res => { console.log(res.data); }) .catch(error => { console.log(error); });
POST請求用法2。運行結果同上。
const axios = require('axios'); axios({ method: 'post', url: 'http://localhost:3000', data: { id: '123', name: 'aa' }}) .then(res => { console.log(res.data); }) .catch(error => { console.log(error); });
設置默認請求的前綴地址
const axios = require('axios'); axios.defaults.baseURL = 'http://localhost:3000'; axios.get('/test?id=1') .then(res => { console.log(res.data); }) .catch(error => { console.log(error); });
設置請求頭信息
const axios = require('axios'); axios({ method: 'post', url: 'http://localhost:3000', data: { id: '123', name: 'aa' }, headers:{ 'Content-Type': 'application/json', 'Cookie': 'id=123;name=aa;' }}) .then(res => { console.log(res.data); }) .catch(error => { console.log(error); });