docker nginx 설정docker - compose 배치 Vue + SpringBoot 전후 단 분리 항목
본 고 는 docker - compose 를 통 해 전단 Vue 프로젝트 를 Nginx 에 배치 하고 백 엔 드 SpringBoot 프로젝트 를 실행 할 것 입 니 다.
서버 기본 환경:
2. docker - compose 배치 Vue + SpringBoot 전후 단 분리 프로젝트
전체 프로젝트 구성 구 조 는 원래 프로젝트 의 구조 에 영향 을 주지 않 기 때문에 모든 프로필 을 docker 폴 더 에 저장 합 니 다. 단, docker - compose 파일 은 프로젝트 의 전체 루트 디 렉 터 리 에 넣 어야 합 니 다!
1. 백 엔 드 추가 에 필요 한 프로필 api - Dockerfile
# FROM maven:3.5.4-jdk-8# MAINTAINER zhengqing "[email protected]"RUN echo "-------------------- api --------------------"# 9101 EXPOSE 9101# UTF-8ENV LANG C.UTF-8# - , #ENTRYPOINT ["java", "-jar", "app.jar","--spring.profiles.active=dev"] 2. 전단 Vue 추가 에 필요 한 설정 파일 웹 - dockerfile, nginx. conf,. dockerignore
웹 - dockerfile: 설치 의존, 패키지 생 성 실행 에 필요 한 자원 파일 을 만 들 고 nginx 의 html 디 렉 터 리 에 저장 하여 실행 합 니 다.
# node FROM node:latest as build-stage# MAINTAINER zhengqing "[email protected]"RUN echo "-------------------- web --------------------"# /app - cd WORKDIR /app# app COPY ./code-web .# npm RUN npm install -g cnpm --registry=https://registry.npm.taobao.org# RUN cnpm install# - : nginx RUN cnpm run build:prod# #CMD ["npm","run","start"]# ======================== :npm :nginx ========================# nginx FROM nginx:1.15.3-alpine as production-stage# MAINTAINER zhengqing "[email protected]"# nginx default.conf 、nginx RUN rm /etc/nginx/conf.d/default.confRUN rm /etc/nginx/nginx.conf# nginx.conf nginx /etc/nginx COPY ./docker/web/nginx.conf /etc/nginx/# vue nginx COPY --from=build-stage /app/dist /usr/share/nginx/html# 8101 EXPOSE 8101# :CMD RUN,CMD , RUN 。# RUN , 。 , --no-cache , :docker build --no-cache# daemon off nginx CMD ["nginx", "-g", "daemon off;"] nginx.conf
user nginx;worker_processes 1;error_log /var/log/nginx/error.log warn;pid /var/run/nginx.pid;events { worker_connections 1024;}http { include /etc/nginx/mime.types; default_type application/octet-stream; log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_bytes_sent "$http_referer" ' '"$http_user_agent" "$http_x_forwarded_for"'; access_log /var/log/nginx/access.log main; sendfile on; keepalive_timeout 65; # include /etc/nginx/conf.d/*.conf; server { listen 8101; charset utf-8; server_name www.zhengqing520.com;# # start --------------------------------------------------------------------------------------------- location / { root /usr/share/nginx/html; try_files $uri $uri/ /index.html; } # end --------------------------------------------------------------------------------------------- error_page 500 502 503 504 /50x.html; location = /50x.html { root /usr/share/nginx/html; } }} . dockerignore 역할: docker 엔진 에 전달 할 때 불필요 한 파일 이나 폴 더 를 무시 합 니 다.
/code-web/node_modules 3. docker - compose. yml 역할: 용기 실행 순 서 를 편성 하여 하나의 docker run 방식 으로 프로젝트 를 실행 하 는 것 보다 편리 합 니 다.
version: '3'services: api: # springboot container_name: xiao-xiao-su-api # 'xiao-xiao-su-api' restart: always # : build: context: ./ # , Dockerfile dockerfile: ./docker/api-Dockerfile working_dir: /app # app environment: TZ: Asia/Shanghai volumes: # - ./code-api:/app # code-api (java ) app - ./logs/:/app/log # logs ports: # - "9101:9101" command: mvn clean spring-boot:run -Dspring-boot.run.profiles=dev '-Dmaven.test.skip=true' # springboot web: # node ( nginx Vue ) container_name: xiao-xiao-su-web # 'xiao-xiao-su-web' restart: always # : build: context: ./ # , Dockerfile dockerfile: docker/web/web-Dockerfile environment: TZ: Asia/Shanghai ports: - "8101:8101" # depends_on: # api , web - api 3. 서버 실행
서버 에 항목 을 버 리 고 프로젝트 루트 디 렉 터 리 에 들 어가 다음 명령 을 순서대로 실행 하면 됩 니 다.
# 1. docker-compose build# 2. docker-compose up -d 따뜻 한 팁: 처음 구축 할 때 느 려 요. 앉 아서 차 가운 차 한잔 하 세 요 ~
4. 방문 테스트
전단 페이지:http://www.zhengqing520.com:8101/xiao-xiao-su/dashboard
)
총화
사례 데모 소스 코드
https://github.com/zhengqingya/xiao-xiao-su