Proxying API Requests in Development
If you’re not familiar with Gatsby’s lifecycle, see the overview Gatsby Lifecycle APIs.
People often serve the frontend React app from the same host and port as their backend implementation.
To tell the development server to proxy any unknown requests to your API server in development, add a
proxy field to your
gatsby-config.js, for example:
This way, when you
fetch('/api/todos') in development, the development server will recognize that it’s not a static asset, and will proxy your request to
http://dev-mysite.com/api/todos as a fallback.
Keep in mind that
proxy only has effect in development (with
gatsby develop), and it is up to you to ensure that URLs like
/api/todos point to the right place in production.
Sometimes you need more granular/flexible access to the development server. Gatsby exposes the Express.js development server to your site’s
gatsby-config.js where you can add Express middleware as needed.
Keep in mind that middleware only has effect in development (with
If you proxy to local APIs with self-signed certificates, set the option