Docker部署vue+node服务+mysql+redis（非docker-compose版）

背景

俗话说得好，一个不想做好后端的前端不是好运维。作为一名前端，仅仅把前端服务能够顺利的通过容器部署到服务器上，感觉不够好玩。希望能部署一整套服务到服务器上玩玩。所以就萌生了做这么一个简单demo的想法。

简单介绍

前端写后端的首选语言肯定是node，数据库就选择最popular的mysql，也加上了中间件redis，正好趁机也了解一下。实现后大概是：

• vue写一个登录页（用户名密码数据库事先插入好）
• 登录完成后，可以写句话勉励当下的自己或者写下梦想或者女（男）朋友的名字
• 可以查看失效的勉励或者逝去的梦想或者前女（男）友的名字
• 没有删除和编辑

整个过程只涉及简单的调用，以部署整套服务为第一要务。所以优化自然是没有的（我不会）。需要一点基本的docker操作。算是对自己摸索的过程做一个简单记录。

具体实现

部署mysql容器

用docker命令创建一个网络

docker network create bullshit-app
复制代码

拉取mysql5.7 image之后，创建一个mysql容器

 docker run -d \
     --network bullshit-app --network-alias mysql \
     --name bullshit-mysql \
     -v bullshit-mysql-data:/var/lib/mysql \
     -e MYSQL_ROOT_PASSWORD=simple \
     -e MYSQL_DATABASE=bullshit \
     mysql:5.7
复制代码

此时，mysql容器已经创建好并且顺利在服务器上面跑起来了

可以进入容器看一看具体的样子,密码就是创建容器变量MYSQL_ROOT_PASSWORD传入的值simple

docker exec -it bullshit-mysql mysql -u root -psimple
复制代码

创建完mysql容器之后会因为MYSQL_DATABASE变量传入的bullshit而创建一个bullshit的数据库，此时库里面还没有表。可以将写好的sql文件通过docker命令来创建表格。

docker exec -i bullshit-mysql sh -c 'exec mysql -uroot -p"$MYSQL_ROOT_PASSWORD"' < /app/bullshit/bullshit.sql
复制代码

bullshit.sql 文件从本地上传到服务器

use `bullshit`;
SET NAMES utf8mb4;
SET FOREIGN_KEY_CHECKS = 0;

DROP TABLE IF EXISTS `dream`;
CREATE TABLE `dream` (
  `id` int NOT NULL AUTO_INCREMENT,
  `content` longtext NOT NULL,
  `createtime` bigint NOT NULL,
  `author` varchar(20) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb3;

DROP TABLE IF EXISTS `users`;
CREATE TABLE `users` (
  `id` int NOT NULL AUTO_INCREMENT,
  `username` varchar(20) NOT NULL,
  `password` varchar(20) DEFAULT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb3;
INSERT INTO `users` (username, password) values('admin', '123');

SET FOREIGN_KEY_CHECKS = 1;
~

复制代码

创建好了mysql容器，查看一下mysql容器的ip。172.20.0.2

docker network inspect bullshit-app
复制代码

部署redis

创建一个redis容器，暂时不进行持久化

docker run --name bullship-redis --network bullshit-app -d redis
# 查看redis网络ip  172.20.0.3
docker network inspect bullshit-app
复制代码

部署node服务

node服务的代码地址：github.com/jiaoruogu/b…
将后端代码上传到服务器后,构建镜像创建容器

docker build . -t bullshit-server
docker run --name bullshit-server --network bullshit-app -e NODE_ENV=production  -d bullshit-server
复制代码

创建镜像成功之后查看下容器ip为172.20.0.4

检查一下服务是否正确的启动

curl http://172.20.0.4:3000/api/search
复制代码

node服务已经启动成功！，现在服务的ip也已经知道了。下面就是配置前端的nginx代理服务。

前端（Vue实现）

前端的代码地址：github.com/jiaoruogu/b…

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;
  server {
    listen       80;
    server_name  localhost;
    location / {
      root   /app;
      index  index.html;
      try_files $uri $uri/ /index.html;
    }
    location /api {
      proxy_pass http://172.20.0.4:3000;
    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
      root   /usr/share/nginx/html;
    }
  }
}
复制代码

# 构建web镜像
docker build . -t bullshit-web

创建web容器
docker run --name bullshit-web --network bullshit-app -dp 9010:80 bullshit-web
复制代码

web容器部署完毕！

成果

www.jiaoruogu.top:9010/

补充

如果嫌弃命令行操作繁琐，有一个可视化的docker管理工具 Portainer

轻松管理容器镜像

总结

这只是使用docker容器部署整套服务的一个粗略实践，距离生产有着很大很大的一段距离，每一点都有着很多很多可以改进的空间。不过学习嘛，总归是一个从简单到复杂的过程。通过这次实践体会了一下整个从开发到上线的完整流程，还是蛮有意思的。