The problem is that I have a separately containerized frontend and backend for my full stack web app (vue3, node, express, vite, axios). When running locally without a container, I can connect the front end with the back end using the vite.config.js file. For example, on the front end I would have something like this:

 try {
      axios
      .post("/addItem", { title : currList.value, text : newData.value, done : false })
      .then((response) => {
        this.result = response.data.result;
      }, (error) => {
        throw error || new Error(`Request failed`);
      })
    } catch(error:any) {
      console.error(error);
      alert(error.message);
    }

then in the vite.config.js file, I have this:

import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

export default defineConfig({
  plugins: [
    vue(),
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  server: {
        proxy: {
            '/addItem': {
                target: 'http://localhost:3000',
                changeOrigin: true,
                secure: false,
                ws: true,
            },
        },
    } 
})

And in the backend server.js file I have this:

//add items to the todo list
  app.post('/addItem', (req, res) => {
  //do stuff here
  res.status(200).json({ result: req.body.text });
})

This works fine when running locally, non-containerized

So when I tried containerizing everything, It all seems to work other than input from the front end doesn’t get to the backend. I believe it is an nginx problem. Here is what my file looks like:

server {
    listen 80;

    server_name localhost;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;
    }

    location /addItem {
        proxy_pass http://server:3000;
    }
}

I’ve tried changing my vite.config.js file from localhost to server, but that doesn’t seem to fix the issue. Anyone worked on a project like this? I can’t find any examples online of someone with frontend and backend on separate ports (and separate containers) trying to send data between them when they are in docker containers