在vite中配置代理并修改cookie内容

22 阅读1分钟

场景:后端为老项目,无法修改cookie内容,由于浏览器同源策略,导致cookie无法被保留下来,通过配置代理并且重新设置请求头属性即可解决

  server: {
    proxy: {
      "/h5api": {
        target: "http://192.168.0.1:8080", // 实际代理后端地址
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/h5api/, ""),
        configure: (proxy, options) => {
          proxy.on("proxyRes", (proxyRes, req, res) => {
            const setCookie = proxyRes.headers["set-cookie"];
            if (setCookie) {
              proxyRes.headers["set-cookie"] = setCookie.map((cookie) => {
				cookie = cookie.replace(/;\s*Path=[^;]*/gi, "");
                // 确保cookie包含SameSite=None和Secure属性
                if (!cookie.includes("SameSite=")) {
                  cookie += "; SameSite=None";
                }
                if (!cookie.includes("Secure")) {
                  cookie += "; Secure";
                }
                return cookie;
              });
			  proxyRes.headers["Access-Control-Allow-Origin"] = "localhost:5173";
			  proxyRes.headers["Access-Control-Allow-Credentials"] = "true";
            }
          });
        },
      },
    },
  },

后端cookie仅设置了JSESSIONID和path,通过配置代理解决跨域使用cookie问题