::: UPDATE :::
It seems to be a SSL issue. I changed the nginx.conf to port 80 and it works.
I am trying to solve the problem of the 404 errors in React when a user clicks refresh.
The application runs in Docker in Kubernetes on Azure.
I have tried changing the nginx.conf file and pulling it into the container.
Even though the Docker builds, it seems like the container is still running the default nginx.conf.
nginx.conf
server {
listen 443 ssl;
location / {
root /var/www;
index index.html index.htm;
try_files $uri $uri/ /index.html?$args;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /var/www;
}
}
Docker file
FROM node:13.12.0-alpine as build
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
COPY package.json ./
COPY package-lock.json ./
RUN npm install
RUN npm install react-scripts@3.4.1 -g
COPY . ./
RUN npm run build
# production environment
FROM nginx:alpine
# copy the build folder from react to the root of nginx (www)
COPY --from=build /app/build /var/www
# --------- only for those using react router ----------
# if you are using react router
# you need to overwrite the default nginx configurations
# remove default nginx configuration file
RUN rm /etc/nginx/conf.d/default.conf
# replace with custom one
COPY /nginx/nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 443
CMD ["nginx", "-g", "daemon off;"]
Project Structure