I am facing a problem while trying to implement a Reverse Proxy in my API Gateway for it to display my apidocs.
My usecase is a little bit strange, but it is that way because I want to keep my stack as free as possible. I’m using a Cloudflare Worker (JavaScript) as an API Gateway, everything is working fine there under a api.<domain>.com subdomain (you can access our different services using subdirectories like /accounts. The thing is that for every service, I would like to set up another subdirectory for its apidocs (api.<domain>.com/<service/docs.
When publishing a documentation site on Apidog, I selected the Reverse Proxy option along with the ‘Use subdirectory’ checkbox. My custom domain looks like this: https:// api.<domain>.com / accounts/docs.
On my API Gateway code, I implemented a Reverse Proxy that allows me to access to the apidocs on that custom domain, but some 404 errors get thrown through the console, and my endpoints doesn’t show any details, it just says “Page Not Found” and a button to reload.
I know this is not exactly related to Apidog, but to how to develop a correct Reverse Proxy on JavaScript for this to work properly.
Here, I provide my Reverse Proxy approach:
if(request.url.endsWith(`${env.ACCOUNTS_PATH}/docs/`)) {
return reverseProxyForService(request, env.ACCOUNTS_PATH, env.ACCOUNTS_APIDOCS_ID);
}
// In a different file.
module.exports = async function reverseProxyForService(request, servicePath, apiDocsID) {
const apidogUrl = new URL(request.url)
apidogUrl.hostname = `${apiDocsID}.apidog.io`
apidogUrl.pathname = apidogUrl.pathname.replace(`${servicePath}/docs/`, '')
const apidogRequest = new Request(apidogUrl, {
method: request.method,
headers: request.headers,
body: request.body
})
apidogRequest.headers.set('X-Apidog-Docs-Site-ID', apiDocsID)
apidogRequest.headers.set('Host', `api.<domain>.com/${servicePath}/docs/`)
return fetch(apidogRequest)
}
