封裝axios用於網路操作,實現get ,post,表單檔案上傳功能。axios的GitHub地址:https://github.com/axios/axios。
axios特點(官網翻譯)從瀏覽器中建立 XMLHttpRequests從 node.js 建立 http 請求支援 Promise API攔截請求和響應轉換請求資料和響應資料取消請求自動轉換 JSON 資料客戶端支援防禦 XSRF安裝npm安裝方式:npm install axios
基礎類封裝
import axios from 'axios'; // 引入axiosconst service = axios.create({ baseURL: '', withCredentials: true, // 允許攜帶cookie timeout: 30000,})service.interceptors.request.use( config => { return config }, error => { return Promise.reject(error) })service.interceptors.response.use( response => { const res = response if (res.status !== 200) { return Promise.reject(res) } return res }, error => { return Promise.reject(error) })export default service
業務請求封裝get方法,引數直接塞進去
export function editMailExtHTML(MailExtID, HTML) { return http({ url: '', method: 'get', params: { MailExtID, HTML } })}
post方法,引數傳遞是透過 let params = new URLSearchParams();的append
export function getSign(params) { return http({ url: '', method: 'post', data: params })}
檔案上傳,引數傳遞let params = new FormData(); 專案中是vant的上傳控制元件返回的base64的字串,params.append("file", file);
export function uploadFileXls(param) { let config = { headers: { 'Content-Type': 'multipart/form-data' } }; return http.post('', param, config)}
暫時做簡單的封裝夠用了,至於攔截,異常處理可以根據在此基礎上新增
最新評論