如何将RTK Query自动生成的requestId作为x-request-id请求头发送？

你当前的思路是对的，RTK Query会自动为每个请求生成requestId，且可以在prepareHeaders中直接获取并设置到请求头里。不过你的代码有个小疏漏——prepareHeaders函数必须返回修改后的headers，否则设置不会生效。

修正后的代码 #

export const api = createApi({
    reducerPath: 'api',
    baseQuery: fetchBaseQuery({
        baseUrl: 'http://localhost:9000',
        prepareHeaders: (headers, { requestId }) => {
            headers.set('x-request-id', requestId);
            // 务必返回修改后的headers对象
            return headers;
        },
    }),
    endpoints: (builder) => ({
        getPage: builder.query<PageResponse, PageRequest>({
            query: (pageRequest) => {
                return {
                    url: '/api/4/page/fetch',
                    body: pageRequest,
                    method: 'POST',
                };
            },
        }),
    })
});

额外：在组件中获取requestId #

如果需要在组件层面拿到这个requestId（比如用于日志、后续关联请求等），可以直接从useGetPageQuery的返回值中获取：

const { data, error, requestId } = useGetPageQuery(你的请求参数);

内容的提问来源于stack exchange，提问作者Anurag Anand