Docker打包前后端项目的实现示例
作者:冰冰很社恐
目前我们大多数服务应该会使用Docker来进行部署,本文主要介绍了Docker打包前后端项目的实现示例,具有一定的参考价值,感兴趣的可以了解一下
1.打包应用
mvn clean package -DskipTests

2.新建dockerfile
FROM openjdk:8 #设置工作目录 WORKDIR /workspace #COPY wms-app-0.0.1-SNAPSHOT.jar /workspace/app.jar ADD wms-app-0.0.1-SNAPSHOT.jar app.jar #配置容器暴漏的端口 EXPOSE 8080 #查看是否已经copy进去 #RUN ls #java App ENTRYPOINT ["java","-jar","app.jar"]

3.打包镜像
docker build -t mall:v1 .
4.测试运行
--rm 代表退出之后,容器移动删除
docker run -it --rm beimao:v1


5.使用阿里云免费私仓
Vue前端项目打包
编译打包
npm run build

前端项目 nginx的配置文件default.conf 和 dockerfile

default.conf
upstream wms-app {
server 192.168.14.3:3666 ;
server 192.168.14.3:3777 ;
}
server {
listen 80;
listen [::]:80;
server_name localhost;
access_log /var/log/nginx/host.access.log main;
location / {
root /usr/share/nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html; #解决单页面找不到路径问题 404
}
location /api/ {
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow-Methods' 'POST,GET,OPTIONS';
add_header 'Access-Control-Allow-Headers' 'Authorization'; #跨域设置
proxy_pass http://wms-app ; #可以配置多个下游服务,具有负载功能
#proxy_pass http://192.168.14.3:3666; #仅配置一个下游服务,不具有负载均衡能力
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}1.root:设置静态根目录为 /usr/share/nginx/html
2. index:设置目录的默认文件为 index.html 、index.htm、index.php
3. try_files:设置文件查找规则为 $uri $uri/ /index.html。即3个规则,先从 $uri 查找,再从 u r i / 目录中查找,最后查找 / i n d e x . h t m l 。
dockerfile
FROM nginx COPY html /usr/share/nginx/html RUN rm -f /etc/nginx/conf.d/default.conf ADD default.conf /etc/nginx/conf.d/default.conf
构建镜像
docker build -t web:v1 .
运行
docker run -it -p 8086:80 web:v1
到此这篇关于Docker打包前后端项目的实现示例的文章就介绍到这了,更多相关Docker打包前后端项目内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
