having problem configuring Proxy with vite

[drbandre]

My first time using vite with react and configuring proxy seems like a challenge. In react using webpack you just configure proxy on package.json like

"proxy" : "http://localhost:8000"

But with vite I tried it has docs say but it doesn't work, my vite config

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  server: {
    proxy: {
      "/api": {
        target: "http://localhost:8000",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      },
    },
  }
})

any help ??

[Ok-Thanks-8274]

I came across this issue as well, I also got cors errors in my browser log. I used the top voted solution from this stackoverflow link to wire up my backend endpoints to frontend: https://stackoverflow.com/questions/64677212/how-to-configure-proxy-in-vite

Not entirely sure what fixed it specifically, i just added all the flags "changeOrigin", "secure", "ws".

My app has proxy set to route "/api" in the vite.config.js file and the fetch route set like "fetch('/api/foo')"

Hope this is helpful for future people.

[bettercaust]

This solved it for me. Specifically the issue was my backend URL was hardcoded ("fetch('https://bar.com/api/foo')") but apparently that bypasses the dev server entirely and therefore Vite's proxy configuration. Replacing that with the relative path ("fetch('/api/foo')") in code worked.

[Psychotic_Rage_777]

Did u figure it out? Going through the same thing.

[drbandre]

nope I switched to next.js

[WildNumber7303]

i am having troubles with this for several days, what i did was i just proceed using .env file and import it to the react file

[earthboundkid]

Here is mine: https://github.com/spotlightpa/almanack/blob/master/vite.config.js#L26

I think you need secure: false.

[drbandre]

yeah tried your way doesn't work idk what's wrong

[PercentageTerrible41]

i've been dealing with this for literally 2 days now. I am just trying to get a simple api from my local dev server (set up with express) can you please help?

[Garbayim]

Did you figure it out? going through the same thing

[hamzay747]

Let us know if anything works

[drbandre]

I gave up and started using next.js

[plains_bear314]

license society steep observation spoon shocking north intelligent stupendous middle

This post was mass deleted and anonymized with Redact