请求中间件
请求中间件是一个异步函数,它提供了强大的,几乎能控制一个请求的所有行为的能力。如果你只是使用 alova,那你应该很可能不需要使用请求中间件,因为它主要用于完成自定义的请求策略,无论简单还是复杂的请求策略,可能你都会用上它,接下来我们看下它到底有什么神通。
中间件函数
请求中间件是一个异步函数,你可以在useRequest
、useWatcher
、useFetcher
中定义请求中间件。以下是一个简单的请求中间件,它在请求前和请求后分别打印了一些信息,没有改变任何请求行为。
useRequest(todoList, {
async middleware(_, next) {
console.log('before request');
await next();
console.log('after requeste');
}
});
这里有几点你需要知道的,有关next
函数调用的问题,这个函数也是一个异步函数,调用它可以继续发送请求,此时将会把 loading 状态设置为 true,然后发送请求。next 的返回值是带有响应数据的 Promise 实例,你可以在中间件函数中操纵返回值。
控制响应数据
中间件函数的返回值将作为本次请求的响应数据参与后续的处理,如果中间件没有返回任何数据但调用了 next
,则会将本次请求的响应数据参与后续处理。
// 将会以修改后的result作为响应数据
useRequest(todoList, {
async middleware(_, next) {
const result = await next();
result.code = 500;
return result;
}
});
// 将会以本次请求的响应数据参与后续处理
useRequest(todoList, {
async middleware(_, next) {
await next();
}
});
// 将会以字符串abc作为响应数据
useRequest(todoList, {
async middleware(_, next) {
await next();
return 'abc';
}
});
这里还有一个特例,当既没有调用 next
,又没有返回值时,将不再执行后续的处理,这表示onSuccess、onError、onComplete响应事件不会被触发。
useRequest(todoList, {
async middleware() {}
});
更改请求
有时候你想要更改请求,此时可以在 next
中指定另一个 method 实例,在发送请求时就会将这个 method 中的信息进行请求,同时你还可以通过 next
设置是否强制请求来穿透缓存,这也很简单。
useRequest(todoList, {
async middleware(_, next) {
await next({
// 更改请求的method实例
method: newMethodInstance,
// 本次是否强制请求
force: true
});
}
});