I already migrate from CRA to Vite.js for better developer experience.
After that, the proxy doesn’t work.
From the old one version (CRA) it working fine and correctly
const { createProxyMiddleware } = require("http-proxy-middleware");
module.exports = function (app) {
app.use(
"/api/sandbox",
createProxyMiddleware({
target: "https://my-sandbox-service.com",
pathRewrite: {
"/api/sandbox": "",
},
changeOrigin: true,
secure: false,
})
);
// So on other proxies ...
}
So, I convert it to vite.config.ts
like this
import { defineConfig } from "vitest/config";
import path from "path";
import react from "@vitejs/plugin-react";
import viteTsconfigPaths from "vite-tsconfig-paths";
import svgr from "vite-plugin-svgr";
export default defineConfig({
base: "/",
plugins: [react(), viteTsconfigPaths(), svgr()],
resolve: {
alias: {
"@assets": path.resolve(__dirname, "src/assets"),
},
},
build: {
outDir: "build",
},
server: {
proxy: {
"/api/sandbox": {
target: "https://my-sandbox-service.com",
rewrite: (path) => path.replace(/^/api/sandbox/, ""),
changeOrigin: true,
secure: false,
},
// So on other proxies ...
}
})
for the new one version, it work only when I run on local machine
But not working and I deployed on dev environment.
When I called a request from my website /api/sandbox/v2/auth/login
it should be proxy pass and rewrite to be https://my-sandbox-service.com/v2/auth/login
But it just send a request as https://my-website.com/api/sandbox/v2/auth/login
I don’t know why. I try everything.