When using CodeSpaces as my dev environment (not sure if that is an important difference), and I have a Vite React app and an Azure Functions API app, the proxy in the config file doesn't seem to work as I thought it would.
If I add a proxy with the https URL for the Functions app, the React axios call responses with a SELF-SIGNED error.
// vite config
...other configs above ...
server: {
proxy: {
// Add your proxy configurations here
'/api': {
target: 'https://core-dev-out-redesigned-xylophone-7g69445gg6pfx7v-7071.preview.app.github.dev'
},
},
},
// console.log
Error getting sas token: Request failed with status code 500 AxiosError: Request failed with status code 500 at settle (https://core-dev-out-redesigned-xylophone-7g69445gg6pfx7v-5173.preview.app.github.dev/node_modules/.vite/deps/axios.js?v=234ab080:1189:12) at XMLHttpRequest.onloadend (https://core-dev-out-redesigned-xylophone-7g69445gg6pfx7v-5173.preview.app.github.dev/node_modules/.vite/deps/axios.js?v=234ab080:1417:7)
If I remove the proxy from the Vite config file, and instead use an environment variable for the https URL to the functions app, then add that to the axios client, the call works.
// .env
VITE_API_SERVER=https://core-dev-out-redesigned-xylophone-...-7071.preview.app.github.dev
// App.tsx
const API_SERVER = import.meta.env.VITE_API_SERVER as string;
console.log(import.meta.env)
console.log(API_SERVER)
const request = axios.create({
baseURL: API_SERVER,
headers: {
'Content-type': 'application/json'
}
});
Why can't I get my proxy working? What am I missing?
When I run the same project on local machine, outside of containers, using the config file proxy, it works.
