RTK Query dynamicBaseQuery未拼接endpoint URL的问题求助

问题原因 #

你的dynamicBaseQuery实现中，直接用动态生成的adjustedUrl覆盖了endpoint定义的url参数，完全丢弃了endpoint里的业务路径和查询参数，导致最终请求URL只包含动态前缀，缺失了接口的核心路径部分。

解决办法 #

修改dynamicBaseQuery逻辑，将动态生成的路径前缀与endpoint的url拼接，而非直接替换。

修改后的代码 #

const rawBaseQuery = fetchBaseQuery({
  baseUrl: "http://my-base-url/",
})

const dynamicBaseQuery: BaseQueryFn<
  string | FetchArgs,
  unknown,
  FetchBaseQueryError
> = async (args, api, extraOptions) => {
  const projectId = getProjectId();
  const projectVersion = await getProjectVersion();
  // 生成动态路径前缀
  const pathPrefix = `${projectId}/api/${projectVersion}`;

  let adjustedArgs: string | FetchArgs;
  if (typeof args === 'string') {
    // 处理字符串类型的请求路径：前缀 + 原路径
    adjustedArgs = `${pathPrefix}/${args}`;
  } else {
    // 处理对象类型的请求配置：拼接前缀与原url，避免双斜杠
    const cleanedUrl = args.url ? args.url.replace(/^\/+/, '') : '';
    const combinedUrl = cleanedUrl ? `${pathPrefix}/${cleanedUrl}` : pathPrefix;
    adjustedArgs = { ...args, url: combinedUrl };
  }

  return rawBaseQuery(adjustedArgs, api, extraOptions);
}

export const baseApi = createApi({
  reducerPath: "base-api-reducer",
  baseQuery: dynamicBaseQuery,
  endpoints: () => ({}),
})

补充说明 #

• 代码中加入了replace(/^\/+/, '')来移除原url开头的斜杠，避免出现projectId123/api/v1//data这类双斜杠的无效路径。
• 如果你的endpoint url包含查询参数（比如data?any_other_query_param=true），拼接逻辑会完整保留这部分内容，最终生成符合预期的URL：http://my-base-url/projectId123/api/v1/data?any_other_query_param=true。

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