Vercel's Rewrite function doesn't work in React

[Aycom366]

Am building an app that requires me to use a proxy server to connect with my backend server which is working perfectly locally. But when I wanna deploy, I saw that I need to create a vercel.json file and inside it will be my rewrites functions.

{
  "rewrites": [
    {
      "source": "/api/:path*",
      "destination": "https://zeeh.herokuapp.com/:path*"
    }
  ]
}

I have written this code here expecting vercel to proxy into my destination server but instead, It didn't do anything but to the port of which the app was hosted on.....

https://zeeh.herokuapp.com/api/test => The resource that I wanna access


(async () => {
      try {
        const { data } = await axios.get('/api/test');
        console.log(data);
      } catch (error) {
        console.log(error);
      }
    })();

How it is being called

and I was expecting to see this called

https://zeeh.herokuapp.com/api/test

but this took over

https://el-menus.vercel.app/api/test

[seloner]

try { "source": "/api", "destination": "https://zeeh.herokuapp.com" },

[incognitoluke]

I have the same issue

[jkrmarmol]

bro @Aycom366 did you already solve this issue ?

[Aycom366]

I moved the deployment to netlify I was able to do that with netlify's redirect function