Multiple concurrent requests in vue when one request detects the need for login, cancel the other requests and restart after the login is completed
this project is based on Wechat"s silent login in Wechat, that is, there is no need for extra users to log in, just jump and reload the page to complete the login. Previously, the code that detected non-login with the interceptor was used to jump directly to automatically log in and return to the original page, but the request for the same page was initiated at the same time.
what I want to achieve now is
//5
axios1()//
axios2()
axios3()
axios4()
axios5()
do you have any good ideas or ways to implement it?
you can wait until a request is completed before deciding whether to initiate a subsequent request
is this all right?
axios1().then(res=>{
if(!res.login){
//go login
}else{
axios2()
axios3()
axios4()
axios5()
}
})
you can cancel get type requests through cancelToken, but other types of requests cannot be cancelled through cancelToken
you can use axios.all (),. Although other requests will not be canceled, as long as there is an exception, all APIs will not go to the normal callback function, which will not affect business operations
.
first wrap each promise to a resolve state even if it fails, then use Promise.race to make sure that one records the index or id, after completion, and then resend the other requests in the array.
The abort of
request does not know how compatible it is. In this method, all requests must be sent completely and will be sent twice except the successful one.
you can intercept when axios requests
if it is backend rendering. You can directly determine whether you have logged in or not.
put ajax into an event listener that executes user_login only once. If the
page does not log in and triggers the user_login event
page login, you can directly trigger the event
you can refer to my note. The idea is the same: put all requests in an array, and then there is a request to request login. After the request is completed, initiate other requests in the array
http://codeshelper.com/n/133.
first, you need to override the axios method (not recommended) or encapsulate an aspect yourself (recommended), and then:
- join the queue directly if you receive any request
- determine whether you are logged in. If so, send the request normally
- if not, jump to the login page to log in
- after logging in, check the queue and send
if there is a request.
http is a stateless request and the request cannot be cancelled. It is impossible to implement this function asynchronously, but you can cancel the execution of the callback function.
problem solved? A friend of mine gave me an idea to do event notification and release in request interception and response interception to determine whether the login has expired. If it expires, notify other requests to cancel the request! But I didn't make it!
