国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

vue axios請求攔截實例代碼

2019-11-19 14:05:30
字體:
來源:轉載
供稿:網友

axios 簡介

axios 是一個基于Promise 用于瀏覽器和 nodejs 的 HTTP 客戶端,它本身具有以下特征:

從瀏覽器中創(chuàng)建 XMLHttpRequest
從 node.js 發(fā)出 http 請求
支持 Promise API
攔截請求和響應
轉換請求和響應數(shù)據(jù)
取消請求
自動轉換JSON數(shù)據(jù)
客戶端支持防止 CSRF/XSRF

下面代碼給大家介紹vue axios 請求攔截,具體代碼如下所示:

import axios from 'axios';//引入axios依賴import { Message } from 'element-ui';import Cookies from 'js-cookie'; //引入cookie操作依賴import router from '@/router/index'//引入路由對象axios.defaults.timeout = 5000;axios.defaults.baseURL ='';//http request 封裝請求頭攔截器axios.interceptors.request.use(  config => {    var token = ''    if(typeof Cookies.get('user') === 'undefined'){      //此時為空    }else {      token = JSON.parse(Cookies.get('user')).token    }//注意使用的時候需要引入cookie方法,推薦js-cookie    config.data = JSON.stringify(config.data);    config.headers = {      'Content-Type':'application/json'    }    if(token != ''){     config.headers.token = token;    }    return config;  },  error => {    return Promise.reject(err);  });//http response 封裝后臺返回攔截器axios.interceptors.response.use(  response => {    //當返回信息為未登錄或者登錄失效的時候重定向為登錄頁面    if(response.data.code == 'W_100004' || response.data.message == '用戶未登錄或登錄超時,請登錄!'){      router.push({        path:"/",        querry:{redirect:router.currentRoute.fullPath}//從哪個頁面跳轉      })    }    return response;  },  error => {    return Promise.reject(error)  })/** * 封裝get方法 * @param url * @param data * @returns {Promise} */export function fetch(url,params={}){  return new Promise((resolve,reject) => {    axios.get(url,{      params:params    })      .then(response => {        resolve(response.data);      })      .catch(err => {        reject(err)      })  })}/** * 封裝post請求 * @param url * @param data * @returns {Promise} */export function post(url,data = {}){  return new Promise((resolve,reject) => {    axios.post(url,data)      .then(response => {        resolve(response.data);      },err => {        reject(err)      })  })}/** * 封裝導出Excal文件請求 * @param url * @param data * @returns {Promise} */export function exportExcel(url,data = {}){  return new Promise((resolve,reject) => {    axios({      method: 'post',      url: url, // 請求地址      data: data, // 參數(shù)      responseType: 'blob' // 表明返回服務器返回的數(shù)據(jù)類型    })    .then(response => {      resolve(response.data);      let blob = new Blob([response.data], {type: "application/vnd.ms-excel"});      let fileName = "訂單列表_"+Date.parse(new Date())+".xls" ;      if (window.navigator.msSaveOrOpenBlob) {        navigator.msSaveBlob(blob, fileName);      } else {        var link = document.createElement('a');        link.href = window.URL.createObjectURL(blob);        link.download = fileName;        link.click();        window.URL.revokeObjectURL(link.href);      }    },err => {      reject(err)    })  })}/** * 封裝patch請求 * @param url * @param data * @returns {Promise} */export function patch(url,data = {}){  return new Promise((resolve,reject) => {    axios.patch(url,data)      .then(response => {        resolve(response.data);      },err => {        reject(err)      })  })}/** * 封裝put請求 * @param url * @param data * @returns {Promise} */export function put(url,data = {}){  return new Promise((resolve,reject) => {    axios.put(url,data)      .then(response => {        resolve(response.data);      },err => {        reject(err)      })  })}

總結

以上所述是小編給大家介紹的vue axios請求攔截,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持!

發(fā)表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發(fā)表
主站蜘蛛池模板: 行唐县| 庆阳市| 北安市| 旌德县| 定边县| 微山县| 山东省| 竹溪县| 黑水县| 兰坪| 二连浩特市| 英超| 兴义市| 新乡县| 财经| 伊宁市| 苗栗县| 遵义市| 台北市| 眉山市| 宜春市| 容城县| 渝北区| 南宫市| 高要市| 囊谦县| 开鲁县| 乐清市| 庆元县| 民权县| 新乡市| 汝城县| 普格县| 乐业县| 自贡市| 桐庐县| 濮阳县| 七台河市| 罗山县| 平远县| 稷山县|