分離されたアイテムのVUE + SpringBootドッカー実際の前端と後端

分離のVue + SpringBootの終了前後の戦闘チュートリアル（XI）の展開プロジェクトにドッカーエントリ

その後、正式な戦闘を来て、我々は以下の3点から来ドッキングウィンドウVueの独立したフロントとプロジェクトの後端を展開する方法を見てみましょう：

Vueのプロジェクトパッケージ
ドッカーがミラーバックエンドプロジェクト
nginxの設定

A. Vueのプロジェクトパッケージ

I nginxのサーバーサービス自体、ここに述べた、私は、Vueのプロジェクトをパッケージ化し、サーバーにアップロードする缶にnginxのアクセスを必要とするので、ドッカーを構築するために使用していませんでした

1.1コマンド・梱包

プロジェクトのルートディレクトリにしてから、コマンドパッケージを実行

cd 项目根目录npm run build:prod

ファイル

成功したパッケージ後のディレクトリを生成します。dist

ファイル

コンパイラ1.2でパッケージ化

フロントエンドコンパイラIの使用はWebstromあるソフトウェアから直接、より便利に

同じディレクトリを生成します。dist

1.3は、サーバーにアップロード

クラウドサーバーにこのフォルダをコピーするには

私がアップロードするここにいる/usr/local/src/preで

ファイル

そして、パスのフロントエンドをする/usr/local/src/pre/distためにホームページにアクセスindex.html

二つ。ドッカーは、バックエンドのプロジェクトをミラーリング

ステップと同様のステップで構築

Dockerfileファイル

#  基础镜像FROM java:openjdk-8-jre-alpine# 维护者信息MAINTAINER [email protected]#Default to UTF-8 file.encodingENV LANG C.UTF-8#设置alpine时区ENV TIMEZONE Asia/Shanghai#alpine自带的包含dl-cdn的域名非常慢，需要修改后才能下载数据。RUN sed -i 's/dl-cdn.alpinelinux.org/mirrors.ustc.edu.cn/g' /etc/apk/repositories && apk add -U tzdata && ln -snf /usr/share/zoneinfo/${TIMEZONE} /etc/localtime && echo "${TIMEZONE}" > /etc/timezoneRUN apk add -U tzdata && ln -snf /usr/share/zoneinfo/${TIMEZONE} /etc/localtime && echo "${TIMEZONE}" > /etc/timezone#解决验证码问题RUN apk update && apk add fontconfig && apk add --update ttf-dejavu && fc-cache --force#添加应用ADD pre-system-1.4.jar pre-system-1.4.jar#参数#ENV PARAMS=""#执行操作 默认启动线上环境ENTRYPOINT [ "sh", "-c", "java -Xmx50m -Djava.security.egd=file:/dev/./urandom -jar pre-system-1.4.jar --spring.profiles.active=prod" ]

ここで私はより迅速に設定、ダウンロードを修正しました

RUN sed -i 's/dl-cdn.alpinelinux.org/mirrors.ustc.edu.cn/g' /etc/apk/repositories

その後、我々は構築して起動することができます

サーバー構築の方法は、最初にパッケージされたことにより、私はここにいるjarとDockerfile、サーバーにアップロードファイルを

ファイル

ビルドコマンド

docker build -t pre:1.4 .

スタートコマンド

docker run --name pre -p 8081:8081 -d -v /Users/lihaodong/Desktop/log:/Users/lihaodong/Desktop/log pre:1.4

nginxの設定

構成例およびHTTPS用にnginxのように設定する前に

3.1の変更は、default.conf

server {        listen    443 ssl;        server_name pre.52lhd.com; #填写绑定证书的域名                ssl_certificate  /usr/local/src/nginx/cert/2381015_pre.52lhd.com_nginx/2381015_pre.52lhd.com.pem;        ssl_certificate_key  /usr/local/src/nginx/cert/2381015_pre.52lhd.com_nginx/2381015_pre.52lhd.com.key;        ssl_session_timeout 5m;        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;        ssl_prefer_server_ciphers on;
           location / {   	root /usr/local/src/pre/dist;	index index.html;        try_files $uri $uri/ /index.html;        }    location /pre/ {	proxy_set_header  Host             $host;    	proxy_set_header  X-Real-IP        $remote_addr;     	proxy_set_header  X-Forwarded-For  $proxy_add_x_forwarded_for;	rewrite  ^.+pre/?(.*)$ /$1 break;        proxy_pass http://xxx:8081;	}
    error_page 404 /404.html;        location = /40x.html {    }
    error_page 500 502 503 504 /50x.html;        location = /50x.html {    }}