码迷,mamicode.com
首页 > 移动开发 > 详细

vue中axios 配置请求拦截功能 及请求方式如何封装

时间:2018-05-13 00:37:33      阅读:304      评论:0      收藏:0      [点我收藏+]

标签:cas   信息   his   sign   超时   ack   封装   push   页面   

main.js 中:

import axios from ................/axios

axios.js 中:

//axios.js
import Vue from vue
import axios from axios
Vue.prototype.$http = axios

//http request 封装请求头拦截器
axios.interceptors.request.use(config => {
  // console.log("request")
  // console.log(config)

  //请求方式
  let method = config.method.toLowerCase();
  if (method === get || method === delete) {
    Object.assign(config.params, {
      "test": "testVAl"
    });
  }
  return config;
}, error => {
  return Promise.reject(err);
});

//http response 封装后台返回拦截器
axios.interceptors.response.use(response => {
  // console.log(response)
//当返回信息为未登录或者登录失效的时候重定向为登录页面
  //   if (response.data.code == ‘W_100004‘ || response.data.message == ‘用户未登录或登录超时,请登录!‘) {
  //     router.push({
  //       path: "/",
  //       querry: {
  //         redirect: router.currentRoute.fullPath
  //       } //从哪个页面跳转
  //     })
  //   }
  if (typeof response.data === string) {
    return JSON.parse(response.data);
  } else {
    return response;
  }
}, error => {
  return Promise.reject(error)
});

 

使用:

this.$http.get(/api/......, {params:{}}).then(res => {
                console.log(res)
            }, res => {
                // error callback
            });

 

vue中axios 配置请求拦截功能 及请求方式如何封装

标签:cas   信息   his   sign   超时   ack   封装   push   页面   

原文地址:https://www.cnblogs.com/xiangsj/p/9030623.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!