Open AndersCV opened 6 months ago
As a workaround: Using $fetch
to get the data, then transform + return should still work fine with SWR/caching rules
@manniL Could you provide some additional information on your workaround? We'd also like to implement caching for proxy calls.
We're currently using Nuxt with a custom server route that functions as a proxy for an useFetch requests. Within the custom server route, we return a cachedEventHandler that calls the API.
We'd like to change that to use routeRules with a proxy handler and caching options.
@dennisadriaans
I came up with this catch-all route to proxy all my requests to external backend:
// server/api/[...].ts
import { joinURL } from 'ufo'
export default defineEventHandler(async (event) => {
const proxyUrl = useRuntimeConfig().proxyUrl
const secretKey = useRuntimeConfig().apiToken
const authHeaderName = useRuntimeConfig().public.AUTH_HEADER_NAME
const path = event.path.replace(/^\/api\//, '')
const target = joinURL(proxyUrl, path)
const method = event.method
const authHeader = getHeader(event, authHeaderName)
// readBody inside a GET request returns 405 so we have to check request method
const body = method !== 'GET' ? await readBody(event) : null
try {
return await $fetch(target, {
method: method,
body: body,
headers: {
'X-TBOOK-TOKEN': secretKey,
...(authHeader && { [authHeaderName]: authHeader }),
},
})
} catch (error) {
throw createError(error as Error)
}
})
Environment
Build Modules: -
Reproduction
https://stackblitz.com/edit/nuxt-starter-51fgbr
Describe the bug
When proxying api requests through Nitro that have caching enabled from routeRules the response object is malformed. In the reproduction i linked I'm using a catch-all endpoint to proxy requests from Nitro to an external backend. With caching enabled the response returned from this endpoint is malformed.
Happens when using the h3 proxyRequest method. Switching to $fetch resolves the issue.
Additional context
No response
Logs
No response