docker自动化部署前端项目实战一 (2)

这里为了方便控制，使用nginx-proxy镜像来操作，如下操作docker会自动去镜像仓库拉取，建议服务器80端口给nginx使用，方便以后增加域名和访问端口监听。

docker run -d -p 80:80 -v /var/run/docker.sock:/tmp/docker.sock:ro jwilder/nginx-proxy

然后绑定域名到新建容器，这里使用我的二级域名。

docker run -e VIRTUAL_HOST=libotao.nofoo.cn docsify-image

这里创建容器省略了容器名，

-e：设置环境变量

这时，域名已经配置好了，访问可以看到效果。

前面每次提交内容到github，服务器都会重新拉取最新代码，新建image，销毁container，新建container，访问内容才会更新，为了实现自动化，需要改造一下上面的index.js脚本,

const http = require("http") const { execSync } = require("child_process") const fs = require("fs") const path = require("path") // 递归删除目录 function deleteFolderRecursive(path) { if (fs.existsSync(path)) { fs.readdirSync(path).forEach(function (file) { const curPath = path + "http://www.likecs.com/" + file; if (fs.statSync(curPath).isDirectory()) { // recurse deleteFolderRecursive(curPath); } else { // delete file fs.unlinkSync(curPath); } }); fs.rmdirSync(path); } } const resolvePost = req => new Promise(resolve => { let chunk = ""; req.on("data", data => { chunk += data; }); req.on("end", () => { resolve(JSON.parse(chunk)); }); }); http.createServer(async (req, res) => { console.log('receive request') console.log(req.url) if (req.method === 'POST' && req.url === 'http://www.likecs.com/') { const data = await resolvePost(req); // 项目放在服务器app目录下 const projectDir = path.resolve(`./app/${data.repository.name}`) deleteFolderRecursive(projectDir) // 拉取仓库最新代码 execSync(`git clone https://github.com/BKHole/${data.repository.name}.git ${projectDir}`, { stdio: 'inherit', }) // 创建 docker 镜像 execSync(`docker build . -t ${data.repository.name}-image:latest `, { stdio: 'inherit', }) // 销毁 docker 容器 execSync(`docker ps -a -f "name=^${data.repository.name}-container" --format="{{.Names}}" | xargs -r docker stop | xargs -r docker rm`, { stdio: 'inherit', }) // 创建 docker 容器 execSync(`docker run --name ${data.repository.name}-container -e VIRTUAL_HOST=libotao.nofoo.cn ${data.repository.name}-image:latest`, { stdio: 'inherit', }) console.log('deploy success') res.end('ok') } }).listen(3000, () => { console.log('server is ready') })

修改后覆盖之前存放的index.js，然后重启脚本。

pm2 restart index.js

配置完成后，以后每次提交github，都会自动更新，访问域名就会看到最新的内容。