How to fix NextJs proxying with rewrites?

Viewed 13

I need to proxy api requests to another host from next dev server. I'm using rewrites in my next config, however proxying not working.

My next.config.js:

const withReactSvg = require('next-react-svg')
const path = require('path')

module.exports = () => {
  const rewrites = () => {
    return [
      {
        source: '/api/v1/:path*',
        destination: 'api_host/api/v1/:path*' // Proxy to Backend
      }
    ]
  }
  return {
    rewrites,
    include: path.resolve(__dirname, 'src/assets/svg'),
    webpack(config, options) {
      config.module.rules.push({
        test: /\.svg$/,
        use: ["@svgr/webpack"]
      });
      return config
    },
  }
}

const nextConfig = {
  reactStrictMode: true,
}

module.exports = nextConfig

When trying to request api with axios("/api/v1/getUser"), I get the following error: Request failed with status code 404, because proxying not working and the request goes to localhost:3000/api/v1/getUser

0 Answers
Related