Using Next.js rewrites as a reverse proxy

Created by Donald Ng, Modified on Wed, 21 Aug at 8:16 AM by Donald Ng

If you are using Next.js, you can take advantage of rewrites to behave like a reverse proxy. To do so, add a rewrites() function to your next.config.js file:

// next.config.js
const nextConfig = {
 async rewrites() {
 return [
 {
 source: "/mida/:path*",
 destination: "https://cdn.mida.so/:path*",
 },
 ];
 },
}
module.exports = nextConfig

Then configure the Mida.so client to send requests via your rewrite.

<script>
window.md_cdn = 'https://www.your-domain.com/mida'
</script>
<script src="https://www.your-domain.com/mida/js/optimize.js?key=XXXXXX" />

If this isn't working for you (returning 503 errors), it may be an issue with how your hosting service handles rewrites. You can write Next.js middleware to proxy requests instead.