Redux-Toolkit 查询拦截器

如何解决Redux-Toolkit 查询拦截器

我正在尝试为访问令牌因 RTK 查询而无效的情况构建拦截器。我已经通过文档中的示例构建了它，因此如下所示：

const baseQuery = fetchBaseQuery({
    baseUrl: BASE_URL,prepareHeaders: (headers,{ getState }) => {
        const {
            auth: {
                user: { accesstoken },},} = getState() as RootState;
        if (accesstoken) {
            headers.set('authorization',`Bearer ${accesstoken}`);
        }
        return headers;
    },});

const baseQueryWithReauth: BaseQueryFn<string | FetchArgs,unkNown,FetchBaseQueryError> = async (
    args,api,extraOptions
) => {
    let result = await baseQuery(args,extraOptions);

    if (result.error && result.error.status === 401) {
        const refreshResult = await baseQuery('token/refresh/',extraOptions);

        if (refreshResult.data) {
            api.dispatch(tokenUpdated({ accesstoken: refreshResult.data as string }));

            // retry the initial query
            result = await baseQuery(args,extraOptions);
        } else {
            api.dispatch(logout());
        }
    }
    return result;
};

export const baseApi = createApi({
    reducerPath: 'baseApi',baseQuery: baseQueryWithReauth,endpoints: () => ({}),});

问题是 token/refresh/ 需要一个 POST 请求，其主体带有刷新令牌，我不知道如何重建此行 const refreshResult = await baseQuery('token/refresh/',extraOptions); 以使其接受参数和发出 POST 请求。

解决方法

除了 baseQuery('token/refresh/',api,extraOptions); 你也可以这样做

baseQuery({
  url: 'token/refresh/',method: 'POST'
},extraOptions);

fetchBaseQuery 的第一个参数正是您将从端点定义中的 query 函数返回的参数。

至于您的另一个问题，我不知道您所说的“公共”和“私有”端点究竟是什么意思。调用这些查询的是您的代码，所以您应该知道何时调用哪些查询？