I'm trying to do the https://devopswithdocker.com/ course, but I am not too familiar with node.js and react. I clone the repository here and make a Dockerfile in example-backend and example-front end. My Dockerfiles look like this:
example-frontend/Dockerfile
FROM node:14
WORKDIR /usr/src/app
COPY . .
ENV REACT_APP_BACKEND_URL=http://127.0.0.1:8080/
RUN npm install
RUN npm run build
RUN npm install -g serve
CMD serve -s -l 5000 build
example-backend/Dockerfile
FROM golang:1.16
WORKDIR /usr/src/app
COPY . .
ENV REQUEST_ORIGIN=http://127.0.0.1:5000/
RUN go build
CMD ./server
Then I simply run:
docker build . -t frontend
docker build . -t backend
and then:
docker run -p 5000:5000 frontend
docker run -p 8080:8080 backend
When I go to test the connection on the frontend I get the website with a button to test the ping route on the backend, but when I test it I see 403 and Referrer Policy: strict-origin-when-cross-origin in the network tab. The odd thing is that I can get to the ping route on the back end from my browser, but not the frontend container. I have tried mapping the internal Docker ports to other ports with no success. I have tried changing the http://127.0.0.1:5000/ in the back end container http://localhost:5000/, '*', http://127.0.0.1/, explicitly exposing the ports in the Dockerfile, etc. Been grinding on this one for two days. Everything I google about this issue comes up with changing the node and react code which we shouldn't have to do manually.
