axios API interception and simple configuration (element)

In some cases, sometimes at the request of the API interface is required to get there is the browser COOKIE, call mode can be:

// 获取浏览器Cookie
function getCookie(cname) {
  var name = cname + "=";
  var decodedCookie = decodeURIComponent(document.cookie);
  var ca = decodedCookie.split(';');
  for(var i = 0; i <ca.length; i++) {
      var c = ca[i];
      while (c.charAt(0) == ' ') {
          c = c.substring(1);
       }
       if (c.indexOf(name) == 0) {
          return c.substring(name.length, c.length);
       }
   }
  return "";
}

In axios request, the need for a simple and disposed to intercept the transmission before the transmission:

// Add a response blocker 
Axios.interceptors.request.use ((config) => {
    let account =  sessionStorage.account;
  let token = sessionStorage.token;
  // if(config.url == Axios.bullRanking){
  //   // config.headers['Authorization'] = 'Bearer';
  //   }else{
  //     config.headers['Authorization'] = 'Bearer ' + token;
  //   }
    config.headers['Authorization'] = 'Bearer ' + token
    // config.headers['Accept'] = 'application/json'
    // config.headers['account'] = account;
  //determine whether the login
      //do something before sending the request 
  // let cur_id = "cur_id",
      //       sign = "sign";
   //  if (!cur_id||!sign) {
   //    localStorage.clear();
   //    window.location.href = "index.html";
   //  };
   
  //   to add an interface phone code MCode
     // IF (config.url == Axios.send_sms) {
     //    IF (sessionStorage.mcode) {
     //      var = MCode sessionStorage.mcode
     @      config.data.mcode = MCode
     / /    }
     // }

    if(config.url)
    if(config.method  === 'post'){
        config.data = qs.stringify(config.data);
        config.data = config.data+"&account=" + account;
        config.headers['locale'] =  getCookie('language')=='Chinese'?'zh-CN':'en';
        config.headers['from'] =  'pc';
    }
    if(config.method  === 'get'){
        config.headers['locale'] =  getCookie('language')=='Chinese'?'zh-CN':'en';
        config.headers['from'] =  'pc';
    }
    return config;
},(error) =>{
     _.toast ( " error mass participation " , ' Fail ' );
     return Promise.reject (error);
});

// 添加返回信息验证
Axios.interceptors.response.use(function (response) {
    if(response.data.status =='505' || response.data.status =='404'){
        if(!sessionStorage.account){
            return false;
        }
      sessionStorage.clear();
      if (process.env.NODE_ENV === 'production') {
        window.location.href = "/wap/#/login";
      } else {
        window.location.href = "/#/login";
      }
        
    }
    //  console.log(sessionStorage.account)
    if(response.data.status =='401' || response.data.code =='401'){
      Vue.prototype.resetSetItem('watchStorage', 'false');
      // sessionStorage.setItem("watchStorage", 'false');
      
      // console.log(123)
      if(window.location.hash !='#/home'&&window.location.hash !='#/XXXX'){
        Message({
          showClose: true,
          message: response.data.msg,
          type: "error"
        });
        window.location.href = "#/Login";
         
        return
      }
      
    }
    return response;
  }, function (error) {
    return Promise.reject(error);
  });
  

one of them

Vue.prototype.resetSetItem ( 'watchStorage', 'to false' );

is to monitor changes in the global sessionStorage encapsulated.

 

Guess you like

Origin www.cnblogs.com/wy120/p/11775393.html