所以我想有一個單一的 Nginx Web 服務器為 Docker 提供前端和后端服務。這是我的碼頭工人撰寫：
version: "3.8"
services:
db: #mysqldb
image: mysql:5.7
container_name: ${DB_SERVICE_NAME}
restart: unless-stopped
environment:
MYSQL_DATABASE: ${DB_DATABASE}
MYSQL_ROOT_PASSWORD: ${DB_PASSWORD}
MYSQL_PASSWORD: ${DB_PASSWORD}
MYSQL_USER: ${DB_USERNAME}
SERVICE_TAGS: dev
SERVICE_NAME: mysql
ports:
- $MYSQLDB_LOCAL_PORT:$MYSQLDB_DOCKER_PORT
volumes:
- ./docker-compose/mysql:/docker-entrypoint-initdb.d
networks:
- backend
mrmfrontend:
build:
context: ./mrmfrontend
args:
- REACT_APP_API_BASE_URL=$CLIENT_API_BASE_URL
- REACT_APP_BACKEND_ENDPOINT=$REACT_APP_BACKEND_ENDPOINT
- REACT_APP_FRONTEND_ENDPOINT=$REACT_APP_FRONTEND_ENDPOINT
- REACT_APP_FRONTEND_ENDPOINT_ERROR=$REACT_APP_FRONTEND_ENDPOINT_ERROR
- REACT_APP_CUSTOMER=$REACT_APP_CUSTOMER
- REACT_APP_NAME=$REACT_APP_NAME
- REACT_APP_OWNER=""
ports:
- $REACT_LOCAL_PORT:$REACT_DOCKER_PORT
networks:
- frontend
nginx:
image: nginx:alpine
container_name: backend-nginx
restart: unless-stopped
ports:
- 8000:80
volumes:
- ./MRMBackend:/var/www
- ./docker-compose/nginx/backend:/etc/nginx/conf.d/
networks:
- backend
- frontend
app:
build:
args:
user: admin
uid: 1000
context: ./MRMBackend
dockerfile: Dockerfile
image: backend
container_name: backend-app
restart: unless-stopped
working_dir: /var/www/
volumes:
- ./MRMBackend:/var/www
networks:
- backend
volumes:
db:
networks:
frontend:
driver: bridge
backend:
driver: bridge
這是前端的 Dockerfile：
FROM node:16.13.0 as build-stage
WORKDIR /app
COPY package.json ./
COPY package-lock.json ./
COPY ./ ./
RUN npm i
ARG REACT_APP_API_BASE_URL
ARG REACT_APP_BACKEND_ENDPOINT
ARG REACT_APP_FRONTEND_ENDPOINT
ARG REACT_APP_FRONTEND_ENDPOINT_ERROR
ARG REACT_APP_CUSTOMER
ARG REACT_APP_NAME
ENV REACT_APP_API_BASE_URL=$REACT_APP_API_BASE_URL
ENV REACT_APP_BACKEND_ENDPOINT=$REACT_APP_BACKEND_ENDPOINT
ENV REACT_APP_FRONTEND_ENDPOINT = $REACT_APP_FRONTEND_ENDPOINT
ENV REACT_APP_FRONTEND_ENDPOINT_ERROR = $REACT_APP_FRONTEND_ENDPOINT_ERROR
ENV REACT_APP_CUSTOMER=$REACT_APP_CUSTOMER
ENV REACT_APP_NAME=$REACT_APP_NAME
ENV GENERATE_SOURCEMAP=false
RUN npm run build
問題是前端容器似乎無法啟動。它總是在啟動時退出。
根據我的理解，我應該將 build-stage 的構建內容復制到 nginx 檔案夾“/usr/share/nginx/html”中，但是如何從 docker-compose 檔案中執行此操作？
僅使用卷是行不通的。我在 docker-compose 中需要 nginx，因為它也為后端服務。
請注意，后端作業正常。
更新
我的第一種方法是在前端使用 Dockerfile，我將構建的內容直接復制到 Nginx 映像中
# Stage 1
FROM node:16.13.0 as build-stage
WORKDIR /app
COPY package.json ./
COPY package-lock.json ./
COPY ./ ./
RUN npm i
ARG REACT_APP_API_BASE_URL
ARG REACT_APP_BACKEND_ENDPOINT
ARG REACT_APP_FRONTEND_ENDPOINT
ARG REACT_APP_FRONTEND_ENDPOINT_ERROR
ARG REACT_APP_CUSTOMER
ARG REACT_APP_NAME
ENV REACT_APP_API_BASE_URL=$REACT_APP_API_BASE_URL
ENV REACT_APP_BACKEND_ENDPOINT=$REACT_APP_BACKEND_ENDPOINT
ENV REACT_APP_FRONTEND_ENDPOINT = $REACT_APP_FRONTEND_ENDPOINT
ENV REACT_APP_FRONTEND_ENDPOINT_ERROR = $REACT_APP_FRONTEND_ENDPOINT_ERROR
ENV REACT_APP_CUSTOMER=$REACT_APP_CUSTOMER
ENV REACT_APP_NAME=$REACT_APP_NAME
#avoid javascript out of memory
ENV GENERATE_SOURCEMAP=false
RUN npm run build
# Stage 2
FROM nginx:1.17.0-alpine
COPY --from=build-stage /app/build /usr/share/nginx/html
EXPOSE $REACT_DOCKER_PORT
CMD nginx -g 'daemon off;'
但是通過這種方式我認為我正在部署兩個 Nginx。一個在 Dockerfile 中，一個在 Docker-compose 中。我對嗎？
uj5u.com熱心網友回復：
@federico-arona
正如我的評論中所述：如果您想擁有 1 個 nginx，則需要從構建應用程式的容器中共享或復制檔案。
根據您的要求和您想要完成的任務。最好的解決方案是命名卷，因為它們可以跨容器共享。
它們是持久化 Docker 容器生成和使用的資料的首選機制。此外，您還可以使用 Docker CLI 命令和 Docker API 管理卷。官方檔案顯示了其他好處和有關如何使用它們的附加資訊。
uj5u.com熱心網友回復：
我主要使用 Docker 多構建來配置我的 FE 應用程式。希望這可以幫助你！
FROM node:16.13.0 as build-stage
WORKDIR /app
COPY package.json ./
COPY package-lock.json ./
COPY ./ ./
RUN npm install
RUN npm run dev
#Build Files
FROM nginx:1.19.10-alpine
COPY nginx-conf /etc/nginx/conf.d/default.conf
COPY --from=build /app /home/ubuntu/app/dist
您可以使用默認的 nginx 配置。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/420972.html
標籤：