博客
关于我
Dcoker启动react+springboot项目
阅读量:97 次
发布时间:2019-02-26

本文共 2164 字,大约阅读时间需要 7 分钟。

使用Dockerfile一键启动项目:Spring Boot后端+React前端

一、安装CentOS(云环境下推荐)

对于云环境用户,本文直接跳过此步骤,云服务器一键安装即可。

二、安装Docker

请参考官方文档安装Docker环境。安装完成后,可通过命令直接使用。

三、安装Docker Compose

安装完成后,项目部署变得更加简便,可参考官方文档进行配置。

四、创建Spring Boot后端项目

1. 在IDEA中创建Spring Boot项目

创建完成后,添加测试接口/hello,并通过Maven打包项目。

2. 打包并上传JAR文件

运行以下命令:

mvn clean install

将生成的JAR文件复制到/projects/docker-demo目录下。

3. 创建Dockerfile

/projects/docker-demo目录下新建dockerfile文件,内容如下:

# 基础镜像FROM java:8# 维护者信息MAINTAINER rex# 匿名卷,确保临时文件不丢失VOLUME /tmp# 复制JAR文件ADD springboot-docker-demo-0.0.1-SNAPSHOT.jar /docker-demo.jar# 启动Spring Boot应用ENTRYPOINT ["java", "-Djava.security.egd=file:/dev/./urandom", "-jar", "/docker-demo.jar"]

4. 构建镜像并运行容器

在项目目录下执行以下命令:

docker build -t imagename .

启动容器:

docker run -d --network=host -p 8080:8080 --name springboot-container imagename

参数说明:

  • -d:容器运行在后台
  • --network=host:与主机共享网络
  • --name:容器名称
  • -p 8080:8080:映射宿主机8080端口到容器

5. 测试接口

通过浏览器访问http://localhost:8080/hello测试接口是否正常响应。

五、创建React前端项目

1. 初始化React项目

在终端执行以下命令:

yarn create react-app react-democd react-demoyarn add axios

修改App.js文件,添加axios调用接口功能。

2. 打包前端代码

运行以下命令:

yarn build

将生成的build文件夹复制到/projects/docker-demo目录下。

六、配置Docker Compose

在项目根目录下新建docker-compose.yml文件,内容如下:

version: '2'services:  - nginx    image: nginx:latest    ports:      - "80:80"    volumes:      - ./nginx.conf:/etc/nginx/conf.d/default.conf      - ./build:/usr/share/nginx/html    command: /bin/bash -c "nginx -g 'daemon off;'"  - springboot:    build: .    environment:      - JAVA_ENV=development    ports:      - "8080:8080"

七、配置Nginx(高级配置)

在项目根目录下新建nginx.conf文件,内容如下:

server {    listen       80;    server_name  localhost;        root   /usr/share/nginx/html;    index  index.html index.htm;        location /api/ {        proxy_pass http://springboot:8080;        proxy_set_header Host $host;        proxy_set_header X-Real-IP $remote_addr;        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;        proxy_set_header X-Forwarded-Proto $scheme;    }        error_page 404 /404.html;    error_page   500 502 503 504 /50x.html;        location = /50x.html {        root   /usr/share/nginx/html;    }}

八、项目部署完成

运行以下命令启动容器:

docker-compose up -b

访问http://localhost:80即可查看项目页面。

转载地址:http://nwfk.baihongyu.com/

你可能感兴趣的文章
mysql 修改默认字符集为utf8
查看>>
Mysql 共享锁
查看>>
mysql 写入慢优化
查看>>
mysql 创建表,不能包含关键字values 以及 表id自增问题
查看>>
mysql 判断表字段是否存在,然后修改
查看>>
MySQL 多表联合查询:UNION 和 JOIN 分析
查看>>
MySQL 大数据量快速插入方法和语句优化
查看>>
mysql 如何给SQL添加索引
查看>>
mysql 字段区分大小写
查看>>
mysql 字段类型类型
查看>>
MySQL 存储引擎
查看>>
mysql 更新子表_mysql 在update中实现子查询的方式
查看>>
mysql 自增id和UUID做主键性能分析,及最优方案
查看>>
Mysql 自定义函数
查看>>
mysql 行转列 列转行
查看>>
Mysql 表分区
查看>>
mysql 表的操作
查看>>
MySQL 触发器
查看>>
mysql 让所有IP访问数据库
查看>>
mysql 记录的增删改查
查看>>