Docker+nginx部署Springboot+vue前后端分離項目


Docker+nginx部署Springboot+vue前后端分離項目

環境

  1. ubuntu
  2. docker
  3. docker-compose

前置知識

什么是docker?

借助 Docker,您可將容器當做輕巧、模塊化的虛擬機使用。同時,您還將獲得高度的靈活性,從而實現對容器的高效創建、部署及復制,並能將其從一個環境順利遷移至另一個環境。我理解的高度靈活性是指不同的項目需要的運行環境可能不同,比如mysql,redis的版本或者是兩個軟件端口沖突等所以使用容器部署可以把所有運行環境分割開來,這樣更加方便。

詳細介紹參考這個網址

通俗易懂的解釋:

Docker的思想來自於集裝箱,集裝箱解決了什么問題?在一艘大船上,可以把貨物規整的擺放起來。並且各種各樣的貨物被集裝箱標准化了,集裝箱和集裝箱之間不會互相影響。那么我就不需要專門運送水果的船和專門運送化學品的船了。只要這些貨物在集裝箱里封裝的好好的,那我就可以用一艘大船把他們都運走。

docker就是類似的理念。現在都流行雲計算了,雲計算就好比大貨輪。docker就是集裝箱。

1.不同的應用程序可能會有不同的應用環境,比如.net開發的網站和php開發的網站依賴的軟件就不一樣,如果把他們依賴的軟件都安裝在一個服務器上就要調試很久,而且很麻煩,還會造成一些沖突。比如IIS和Apache訪問端口沖突。這個時候你就要隔離.net開發的網站和php開發的網站。常規來講,我們可以在服務器上創建不同的虛擬機在不同的虛擬機上放置不同的應用,但是虛擬機開銷比較高。docker可以實現虛擬機隔離應用環境的功能,並且開銷比虛擬機小,小就意味着省錢了。

2.你開發軟件的時候用的是Ubuntu,但是運維管理的都是centos,運維在把你的軟件從開發環境轉移到生產環境的時候就會遇到一些Ubuntu轉centos的問題,比如:有個特殊版本的數據庫,只有Ubuntu支持,centos不支持,在轉移的過程當中運維就得想辦法解決這樣的問題。這時候要是有docker你就可以把開發環境直接封裝轉移給運維,運維直接部署你給他的docker就可以了。而且部署速度快。

3.在服務器負載方面,如果你單獨開一個虛擬機,那么虛擬機會占用空閑內存的,docker部署的話,這些內存就會利用起來。

總之docker就是集裝箱原理。

什么是docker-compose?

是為了簡化部署docker的,比如我這個項目是前后端分離的,那么前端需要一個容器,后端也需要一個容器,那么我需要部署兩次docker,大型的項目就需要更多的容器。使用docker-compose通過文本的方式,把要處理的容器按照順序執行,如果是多容器也就是通過一條命令就搞定了。

preview

docker-compose教程

部署項目

安裝docker

#安裝
yum install docker
#檢驗安裝是否成功
[root@localhost opt]# docker --version
Docker version 1.13.1, build 7f2769b/1.13.1
#啟動
systemctl start docker

安裝docker-compose

sudo curl -L "https://github.com/docker/compose/releases/download/1.27.4/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
#
sudo chmod +x /usr/local/bin/docker-compose
# 檢查是否安裝成功
docker-compose --version

編寫Dockerfile文件

因為我們的項目需要成為docker的鏡像,所以我們必須先編寫Dockerfile文件構建我們的項目鏡像然后進行編排,Dockerfile文件可以幫我們進行構建。

FROM java:8
EXPOSE 8101
ENTRYPOINT ["java", "-jar", "/data/exam-api.jar"]
  1. 首先依賴jdk8環境
  2. 對外暴露8101端口
  3. 最后是執行命令 java -jar /data/exam-api.jar

編寫docker-compose.yml文件

我們需要用到的軟件與服務分別有nginx、springboot項目,所以編寫如下:

version: "3"
services:
  nginx: # 服務名稱,用戶自定義
    image: nginx:latest  # 鏡像版本
    ports:
      - 9527:9527  # 暴露端口
    volumes: # 掛載
      - /home/pro/workspace/nginx/html:/usr/share/nginx/html
      - /home/pro/workspace/nginx/nginx.conf:/etc/nginx/nginx.conf
    privileged: true # 這個必須要,解決nginx的文件調用的權限問題
  exam-api:
    image: exam-api:latest
    build: . # 表示以當前目錄下的Dockerfile開始構建鏡像
    ports:
      - 8101:8101
    volumes: # 掛載
      - /home/pro/workspace:/data
    privileged: true

NOTE:

  1. 我沒把mysql也不部署到docker中,而是把mysql放到linux下的,所以不需要修改配置文件中的mysql url代碼
  2. 這邊我把前端項目和后端項目打包之后的文件和文件夾都進行了掛載,所以之后如果需要更新項目只需要更新掛載的文件即可

准備好nginx的掛載目錄和配置

  1. 宿主機的掛載目錄: /home/pro/workspace/nginx/html
  2. 配置文件的掛載位置:/home/pro/workspace/nginx/nginx.conf

所以我們在/home/pro/workspace目錄下新建nginx目錄,並進入nginx目錄下新建html目錄和一個nginx.conf配置文件。

image-20210507095525715

然后對nginx.conf進行編寫,具體配置如下:

#user  root;
worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    server {
        listen       9527;
        server_name  localhost;
        location / {
            root   /usr/share/nginx/html;
			try_files $uri $uri/ /index.html last; # 別忘了這個哈
            index  index.html index.htm;
        }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

上傳前端

在webstorm里面把前端項目打包

image-20210507095737670

那把這個文件夾下的所有文件復制到剛剛的 /home/pro/workspace/nginx/html這個目錄下面

image-20210507095833399

部署后端

在IDEA里面使用 mvn clean package 把后端項目打成exam-api.jar包

把docker,docker-compose和jar包一起放在/home/pro/workspace目錄下

image-20210507100059745

執行一下編排命令:

docker-compose up -d

最后就能看到部署的結果

image-20210507100204504

更新項目

如果項目更新了,之前說了只需要更新宿主機上的文件夾下的內容即可,一個是jar包,一個是前端打包的文件

再重啟后端和前端的容器即可

docker restart 容器ID


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM