I was dealing with this issue a couples of days and really need your help.
I have a project in ViteJS that accesses a public endpoint on Apigee (GCP). I implemented a proxy in the development environment to eliminate CORS issues and it works perfectly.
// Vite.config
import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
export default defineConfig({
plugins: [react()],
build: { chunkSizeWarningLimit: 1600 },
server: {
proxy: {
"/api/v1": {
target: "https://apigee.test-svc-232/api/v1",
changeOrigin: true,
},
},
},
});
// Test.js
const fetchData = async () => {
let data = qs.stringify({
grant_type: "client_credentials",
});
let config = {
method: "post",
maxBodyLength: Infinity,
url: "/api/v1",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
Authorization:
"Basic ...",
},
data: data,
};
The problem occurs when testing it in production on an IIS server. My web.config file is as follows:
//Web.config
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Reverse Proxy to api" stopProcessing="true">
<match url="^api/v1$" />
<action type="Rewrite" url="https://apigee.test-svc-232/api/v1" />
</rule>
<rule name="React Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
</system.webServer>
After deploying to IIS, I got 404 Not Found with the API call.
What is the correct configuration that my Web.config should have, or what other considerations should I take to resolve my problem? Do I need to change anything in the React code? Should I check the IIS configuration or include any certificates, etc.?
I checked this post and tried that solution but still not working: React: 404 Not Found with Proxy after deploying to IIS
Thanks in advance!
Emprende LAB is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.