The problem of intercepting multiple pop-up windows with vue axios encapsulation request

1, now calling background API in the page needs to verify the validity of token, so use the following generation to encapsulate axios. When the token expires or expires, a pop-up window prompts the user to click re-login to return to the login interface. Some pages need to call multiple api when they are initially loaded, so there will be multiple pop-up prompts about how to make the subsequent api that only pops up once not to be called again. That is, if the first api called by the current page returns 500, the code calling the subsequent api will not be executed.

service.interceptors.response.use(
    response=>{
        const res=response.data;
        return response.data;
    },err=>{
        console.log(err);
        let errCode=err.response.data.errCode;
        let errMsg=err.response.data.errMsg;
        if(errCode===500&&errMsg=="Invalid token"){
            MessageBox.confirm("","",{
                confirmButtonText:"",
                cancelButtonText:"",
                type:"warning"
            }).then(()=>{
                store.dispatch("FedLogOut").then(()=>{
                    router.push("/login");
                    Message({
                        //message:err.response.data.errMsg,
                        message:"",
                        type:"error",
                        duration:5*1000
                    })
                })
            })
            
        }
        else if(errCode===500&&errMsg=="No authority"){
            router.push("/");
            Message({
                //message:err.response.data.errMsg,
                message:"!",
                type:"error",
                duration:5*1000
            })
        }
    }
)
Apr.24,2022

borrow cancel token from upstairs and post the specific implementation code


window.location.reload

if (retCode === '100014') {
        // Message.error({
        //   showClose: true,
        //   message: retDesc || '',
        // });
        // removeItemAll();
        // router.push({
        //   name: 'login',
        // });
        MessageBox.confirm(retDesc, '', {
          confirmButtonText: '',
          type: 'warning',
          showCancelButton: false,
          showClose: false,
          customClass: 'btn-center',
        }).then(() => {
          removeItemAll();
          window.location.reload();
        }).catch(() => {
          //
        });
      } else {
        // throw new Error(error);
      }
Menu