Jamstack Static Site API Calls Work Locally but Fail CORS in Production

A Jamstack static site fetches a backend API from the browser. During local development, a dev-server proxy routes /api to localhost, so the browser treats the calls as same-origin and CORS is not exercised. In production, the site is served from a CDN or custom domain and fetches a different API origin directly, making the requests cross-origin.

The goal is to call the API from the production origin without CORS failures while keeping the target changeable without redeploying. Build-time environment variables are embedded in the deployed JavaScript, so changing the target requires a new build and exposes embedded keys. Runtime configuration or edge rewriting could avoid that, but the API must allow the exact production scheme, host, and port in Access-Control-Allow-Origin. Wildcard origins are not honored with credentials.

It is unresolved whether the API base URL should be resolved at build time or runtime, and which production origins should be permitted before deployment.

Should the API base URL be injected at build time or resolved at runtime in the browser?

Which exact production origins must the API allow in Access-Control-Allow-Origin?

Does the API need to handle OPTIONS preflight requests for the production origin, methods, and headers?