Home > Web Front-end > JS Tutorial > How to use Vue to implement interceptors and what are the token processing methods?

How to use Vue to implement interceptors and what are the token processing methods?

亚连
Release: 2018-06-09 18:13:54
Original
2765 people have browsed it

Below I will share with you an article about how the Vue interceptor handles token expiration, which has a good reference value. I hope it will be helpful to everyone.

A project I am working on recently requires adding a token to every http request, which undoubtedly increases the workload. The vue interceptor interceptors can exactly solve our needs.

Vue.http.interceptors.push(function (request, next) {//拦截器设置请求token

 // sessionStorage.getItem("tokenUrl");
 request.headers.set('token', sessionStorage.getItem("tokenVal"));
 if (request.url.indexOf(url) === -1) {
 request.url = url + request.url;
 }
 // continue to next interceptor
 next(function (response) {
 // ..if(response.body.code=="失败码")
{
parent.location.href="登录页面路径" rel="external nofollow" ;
}.
 // 请求发送后的处理逻辑
 // ...
 // 根据请求的状态,response参数会返回给successCallback或errorCallback
 return response
 });
});
Copy after login

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Related articles:

How to solve the practical problem of easyui date time box ie compatibility (detailed tutorial)

How to do it in vue Implement the function of cropping images and uploading them to the server

What is the difference between mutations and actions in Vuex? (detailed tutorial)

How to use cropperjs in vue (detailed tutorial)

In cropper, js is uploaded through vue image cropping How to implement the function

How to implement data transfer, modification and update of parent-child components in Vue (detailed tutorial)

In JavaScript How to determine the date and time difference

How to implement all re-rendering when dynamically modifying data under a single component in vue

How to implement it in vue Encapsulating reusable components

How to use slots to implement slot distribution content in Vue

The above is the detailed content of How to use Vue to implement interceptors and what are the token processing methods?. For more information, please follow other related articles on the PHP Chinese website!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template