The SvelteKit proxy was only stripping host + content-length; the rest of RFC 7230 §6.1 (connection, keep-alive, proxy-authenticate, proxy-authorization, te, trailer, transfer-encoding, upgrade) leaked through to axum. Axum doesn't emit them so the impact is theoretical, but the proxy should be RFC-conformant. Also adds an AbortController with a configurable 60s timeout (BACKEND_PROXY_TIMEOUT_MS) so a wedged backend can't hang the browser request indefinitely — failures surface as the standard 502 upstream_unavailable envelope. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
118 lines
4.6 KiB
TypeScript
118 lines
4.6 KiB
TypeScript
import type { Handle } from '@sveltejs/kit';
|
|
|
|
// Reverse-proxy `/api/*` requests through to the backend container.
|
|
//
|
|
// Mangalord's compose runs SvelteKit (this process) on :3000 and axum on
|
|
// :8080. The browser only ever talks to :3000, so cookies stay
|
|
// same-origin and `CORS_ALLOWED_ORIGINS` can stay empty in the default
|
|
// deploy. The backend hostname comes from `BACKEND_URL` (compose wires
|
|
// `http://backend:8080`); for `npm run dev` we fall back to the same
|
|
// localhost target the vite proxy uses, which keeps the dev story
|
|
// consistent even if someone bypasses the vite proxy.
|
|
|
|
const BACKEND_URL = process.env.BACKEND_URL ?? 'http://localhost:8080';
|
|
|
|
/**
|
|
* Hop-by-hop headers per RFC 7230 §6.1. These are scoped to a single
|
|
* transport-level connection and must not be forwarded by a proxy.
|
|
* Plus `host` and `content-length`: `host` would mislead the backend
|
|
* about its origin, and `content-length` is recomputed by the upstream
|
|
* fetch from the body stream.
|
|
*/
|
|
const HOP_BY_HOP_HEADERS = [
|
|
'host',
|
|
'content-length',
|
|
'connection',
|
|
'keep-alive',
|
|
'proxy-authenticate',
|
|
'proxy-authorization',
|
|
'te',
|
|
'trailer',
|
|
'transfer-encoding',
|
|
'upgrade'
|
|
];
|
|
|
|
/**
|
|
* Cap each proxied request at 5 minutes. The bound exists to surface
|
|
* a wedged backend (stuck on a slow DB query, deadlocked, etc.) as a
|
|
* 502 rather than letting the browser request hang indefinitely.
|
|
*
|
|
* The default leans toward the slow-upload end of the spectrum: at a
|
|
* 1 Mbps upstream, a 200 MiB chapter upload (the default
|
|
* `MAX_REQUEST_BYTES` cap) needs ~27 minutes; 300 s covers the more
|
|
* realistic 25 Mbps urban-broadband case (~64 s for the same upload)
|
|
* with comfortable headroom. Operators serving very slow clients
|
|
* should raise `BACKEND_PROXY_TIMEOUT_MS`; operators behind a
|
|
* tighter upstream proxy may want to lower it. A future improvement
|
|
* is an idle-based timeout (reset per chunk) instead of this
|
|
* wall-clock budget — that's a fair bit more code, deferred.
|
|
*/
|
|
const PROXY_TIMEOUT_MS = (() => {
|
|
const raw = process.env.BACKEND_PROXY_TIMEOUT_MS;
|
|
const n = raw ? Number(raw) : 300_000;
|
|
return Number.isFinite(n) && n > 0 ? n : 300_000;
|
|
})();
|
|
|
|
export const handle: Handle = async ({ event, resolve }) => {
|
|
if (event.url.pathname.startsWith('/api/')) {
|
|
const target = `${BACKEND_URL}${event.url.pathname}${event.url.search}`;
|
|
|
|
const headers = new Headers(event.request.headers);
|
|
for (const h of HOP_BY_HOP_HEADERS) headers.delete(h);
|
|
|
|
// AbortController times the upstream fetch out so a backend
|
|
// wedged on a slow DB query doesn't keep the browser request
|
|
// hanging forever. The `signal` is also wired into the
|
|
// RequestInit so the body stream is cancelled cleanly.
|
|
const ctrl = new AbortController();
|
|
const timeoutHandle = setTimeout(() => ctrl.abort(), PROXY_TIMEOUT_MS);
|
|
|
|
const init: RequestInit & { duplex?: 'half' } = {
|
|
method: event.request.method,
|
|
headers,
|
|
redirect: 'manual',
|
|
signal: ctrl.signal
|
|
};
|
|
if (event.request.method !== 'GET' && event.request.method !== 'HEAD') {
|
|
init.body = event.request.body;
|
|
// Node's fetch requires `duplex: 'half'` when streaming a
|
|
// request body; otherwise the stream is rejected.
|
|
init.duplex = 'half';
|
|
}
|
|
|
|
let upstream: Response;
|
|
try {
|
|
upstream = await fetch(target, init);
|
|
} catch (e) {
|
|
// Network-layer failure (DNS / connection refused / TLS
|
|
// handshake / abort by timeout) — most commonly "backend
|
|
// container restarting". SvelteKit's default 500 would be
|
|
// an HTML page that client.ts can't .json(), which masks
|
|
// the real cause. Emit the standard envelope with a
|
|
// dedicated code instead.
|
|
console.error('Proxy to backend failed:', e);
|
|
clearTimeout(timeoutHandle);
|
|
return new Response(
|
|
JSON.stringify({
|
|
error: {
|
|
code: 'upstream_unavailable',
|
|
message: 'backend unreachable'
|
|
}
|
|
}),
|
|
{
|
|
status: 502,
|
|
headers: { 'content-type': 'application/json' }
|
|
}
|
|
);
|
|
}
|
|
|
|
clearTimeout(timeoutHandle);
|
|
return new Response(upstream.body, {
|
|
status: upstream.status,
|
|
statusText: upstream.statusText,
|
|
headers: upstream.headers
|
|
});
|
|
}
|
|
return resolve(event);
|
|
};
|