1.安裝axios
npm install axios
# 或
yarn add axios
2.創(chuàng)建request.js + api.js
// request.js
import axios from "axios";
let instance = axios.create({
baseURL: "url",
timeout: 5000
});
// http request 攔截器
instance.interceptors.request.use(
(config) => {
// 修改請求頭
if (config.url === "/wechatUsers/PCLogin") {
config.headers["Content-Type"] = "application/x-www-form-urlencoded";
}
const token = sessionStorage.getItem("token");
if (token) {
// 判斷是否存在token知牌,如果存在的話,則每個http header都加上token
config.headers["x-auth-token"] = token; //請求頭加上token
}
return config;
},
(err) => {
return Promise.reject(err);
}
);
// http response 攔截器
instance.interceptors.response.use(
(response) => {
return response.data;
},
//接口錯誤狀態(tài)處理萌庆,也就是說無響應(yīng)時的處理
(error) => {
return Promise.reject(error.response.status); // 返回接口返回的錯誤信息
}
);
export default instance
api.js
import request from './request'
import qs from 'qs'
// 首頁精品推薦數(shù)據(jù)請求
export const JingpinApi = () => request.get('/products/recommend')
// 微信登錄(這個接口必須用qs對數(shù)據(jù)進(jìn)行格式化)
export const WeixinLoginApi = (params) => request.post(`/wechatUsers/PCLogin`, qs.stringify(params))