In my route page, I need fetch some API data from my backend server. For security I must set UserAgent and RequestId to backend. But I found that external API cache only work on refresh, which means I fetch data with totally same headers. When I changed my UserAgent, cache missed. How can I control cache Key exclude some headers?
'use server';
import ky, { type Options } from 'ky';
import { cookies, headers } from 'next/headers';
import 'server-only';
import checkApiVersion from '../check-api-version';
const original = ky.create({
credentials: 'omit',
fetch: (...args) => fetch(...args),
hooks: {
beforeRequest: [
async request => {
const cookieStore = cookies();
const header = headers();
const accessToken =
process.env.NEXT_PUBLIC_DEV_TOKEN ||
cookieStore.get('access_token')?.value;
const mixpanelDistinctId = cookieStore.get('mp_distinct_id')?.value;
const swimlanes = header.get('swimlanes') || '';
const userAgent = header.get('user-agent') || '';
const requestId = header.get('X-Request-Id') || '';
if (accessToken) {
request.headers.set('Authorization', `Bearer ${accessToken}`);
}
if (mixpanelDistinctId) {
request.headers.set('X-WB-User-ID', mixpanelDistinctId);
}
if (userAgent) {
request.headers.set('user-agent', userAgent);
}
if (swimlanes) {
request.headers.set('swimlanes', swimlanes);
}
if (requestId) {
request.headers.set('X-Request-Id', requestId);
}
},
],
},
});
const Get = <T = unknown>(url: string, options?: Options): Promise<T> => {
return original.get(checkApiVersion(url), options).json<T>();
};
const Post = <T = unknown>(url: string, options?: Options): Promise<T> => {
return original.post(checkApiVersion(url), options).json<T>();
};
const Put = <T = unknown>(url: string, options?: Options): Promise<T> => {
return original.put(checkApiVersion(url), options).json<T>();
};
const Delete = <T = unknown>(url: string, options?: Options): Promise<T> => {
return original.delete(checkApiVersion(url), options).json<T>();
};
export { Delete, Get, Post, Put };
