nodejs 如何实现自动化部署?

本文涉及的产品
函数计算FC,每月15万CU 3个月
简介: 什么是自动化部署 我接触到的自动化部署概念最早是在 Vercel 上提供的,Vercel 可以提供和 github 上的某个库建立‘链接’,当你 commit 到 github 远程库时就可以自动部署,Vercel 会帮你完成操作

什么是自动化部署

我接触到的自动化部署概念最早是在 Vercel 上提供的,Vercel 可以提供和 github 联动的功能,通过和你自己的 github 上的某个库建立‘链接’,当你 commitgithub 远程库时就可以自动部署,Vercel 会帮你完成以下操作(例子为一个 Webpack 项目,仅限 Web 前端,如有遗漏望补充)

  1. Webpack 打包(默认是项目 package.json 的打包命令)
  2. 打包文件迁移到 Vercel 的服务器上(dist 目录下的文件)
  3. 部署网站(Vercel 使用的 Nginx 还是 Apache 我就不知道了,应该是用的 Nginx

另一个自动化部署概念是在实习时接触的,公司称之为流水线,它的作用和 Vercel 差不多,不过会多了两个步骤

  1. ESLint 校验代码
  2. 重新安装依赖
  3. Webpack 打包(默认是项目 package.json 的打包命令)
  4. 打包文件迁移到 Vercel 的服务器上(dist 目录下的文件)
  5. 部署网站(Vercel 使用的 Nginx 还是 Apache 我就不知道了,应该是用的 Nginx

现在自动化部署的概念炒的火热,主要是它通常还可以和 Serverless 绑定在一起,Serverless 意思是无服务器,其实就是托管应用程序到 Serverless 服务提供商的服务器上,像一些小微公司可以直接托管网站、小程序,完全不用买服务器(为啥不买服务器,因为 Serverless 便宜呀)

Serverless、自动化部署和它们的可视化界面就不多介绍了,但我要说腾讯云在这方面做的很烂,相反 AzureVercel 做的就很好

普通部署

说完了自动化部署那么我们平常的普通部署是怎么做的呢?以一个 nodejs 的普通接口为例(基于 express-generator 生成的项目)

# npm v5.2.0 以上版本
npx express --no-view --git
git init
npm install

执行上面的命令后得到下面的目录结构

├── .git/
├── bin/
├── node_modules/
├── public/
├── routes/
├── .gitignore
├── app.js
├── package-lock.json
└── package.json
  1. 第一步,在宝塔安装 pm2 如果你没有的话(pm2 会自动安装 nodejsnpm

IMG

  1. 第二步,在服务器找到一个地方放你的文件,这里项目比较小,我就直接丢上去了(一般使用 zip 压缩文件,或者在服务器上重新执行 npm install

IMG

  1. 第三步,在你的 PM2 面板里面添加项目

IMG

IMG

  1. 第四步,提交查看效果,是否符合本地运行预期

IMG

后续重新更新部署怎么办?很简单,将更新的文件覆盖掉原文件,在 PM2 重启一下就行了

IMG

但是如果我想本地 git 提交代码到远程库的时候能够顺便部署行不行呢?看下面的操作

自动化部署

本篇文章实现的自动化部署是基于 githubWebhooks 和宝塔的 WebHook 实现

那如何将上面的普通部署改成这个自动化部署呢?

  1. 第一步,在 github 上创建对应的库(反正又不要钱,随便创)

库链接 - pandoralink/auto-deploy

IMG

  1. 第二步,在服务器拉取项目并在在 PM2 添加项目(同普通部署)并查看 id 信息
cd /www/temp
git clone git@github.com:pandoralink/auto-deploy.git
cd auto-deploy
npm install
# 查看 Linux 的 PM2 项目 id 信息
pm2 list

id 信息如下图

IMG

Linux 操作 git 添加公钥私钥到远程仓库(github/gitee)可以参考 服务器上的 Git - 生成 SSH 公钥远程仓库 - 远程仓库

  1. 第三步,安装宝塔 WebHook 插件

IMG

  1. 第四步,添加宝塔 WebHook 规则

IMG

  1. 第五步,获取宝塔 WebHook URL

IMG

  1. 第六步,配置 githubWebHooks

IMG

注意content-type 需要选择 application/json,否则 github 请求此 URL 时,宝塔会返回 403 错误

配置结果如图

IMG

测试修改一下 public/index.html 的内容,并 pushgithub 远程仓库

IMG

成功修改并部署成功,结果如下

IMG

总结

相比于 Vercel 还是我实习公司的流水线,文章中实现的自动化部署还是过于简陋,成熟的自动化部署拥有可视化界面,完善的日志,部署进度条,这些都是需要很多努力和经验去实现的,最后给出自动化部署的流程图

IMG

相关实践学习
【文生图】一键部署Stable Diffusion基于函数计算
本实验教你如何在函数计算FC上从零开始部署Stable Diffusion来进行AI绘画创作,开启AIGC盲盒。函数计算提供一定的免费额度供用户使用。本实验答疑钉钉群:29290019867
建立 Serverless 思维
本课程包括: Serverless 应用引擎的概念, 为开发者带来的实际价值, 以及让您了解常见的 Serverless 架构模式
相关文章
|
3月前
|
JavaScript 前端开发 Docker
前端的全栈之路Meteor篇(一):开发环境的搭建 -全局安装或使用容器镜像
本文介绍了如何搭建 Meteor 开发环境,包括全局安装 Meteor 工具和使用 Docker 镜像两种方法,以及创建和运行一个简单的 Meteor 项目的基本步骤。 Meteor 是一个全栈 JavaScript 框架,适用于构建实时 Web 应用程序。文章还提供了遇到问题时的解决建议和调试技巧。
162 3
|
4月前
|
JavaScript
Nodejs的模块化概述
详细解释Node.js的模块化概念,包括CommonJS规范、模块的引用、定义、标识,以及如何在Node.js中实现模块化,并通过示例代码展示了如何创建和使用模块,以及"module.exports"和"exports"的区别。
49 1
Nodejs的模块化概述
|
4月前
|
JavaScript 前端开发 Windows
NodeJS的环境部署
介绍如何在Windows操作系统上安装Node.js环境,包括下载长期支持版本的Node.js、安装程序、编写测试代码并执行,以及如何在WebStorm集成开发环境中配置和运行Node.js。
57 1
|
8月前
|
监控 前端开发 jenkins
Jenkins在前端项目持续部署中的应用,介绍了Jenkins作为自动化部署工具的基本概念和流程
【4月更文挑战第29天】本文探讨了Jenkins在前端项目持续部署中的应用,介绍了Jenkins作为自动化部署工具的基本概念和流程。前端持续部署涉及代码提交、构建、测试和部署四个步骤。实现过程中需配置代码仓库、构建、测试和部署任务,安装相关插件并确保环境一致性。注意事项包括代码质量控制、环境一致性、监控预警和安全管理。通过Jenkins,可提升前端开发效率和质量,但需不断学习以应对技术发展。
106 0
|
8月前
|
缓存 应用服务中间件 持续交付
自动化部署 - Laravel Deploy实战
自动化部署 - Laravel Deploy实战
98 0
|
jenkins Java Shell
使用 Jenkins 自动化部署实现原理| 学习笔记
快速学习使用 Jenkins 自动化部署实现原理。
使用 Jenkins 自动化部署实现原理| 学习笔记
|
存储 jenkins Java
搭建部署jenkins,服务器需要什么配置?底层原理是什么?
搭建部署jenkins,服务器需要什么配置?底层原理是什么?
1980 0
|
存储 Shell Go
如何搭建GO语言的本地开发运行环境?具体步骤是怎样的?
如何搭建GO语言的本地开发运行环境?具体步骤是怎样的?
572 0
|
前端开发 JavaScript Ubuntu
jenkins持续集成从0入门到实战【九】构建前端项目
在前后端分离的大背景下,前端团队的工程化非常重要,本篇我们来学习构建发布前端项目
278 0
jenkins持续集成从0入门到实战【九】构建前端项目
|
JavaScript 前端开发 Java
微服务项目:尚融宝(12)(前端平台:NPM包管理器)
2020年3月17日,Github宣布收购npm,GitHub现在已经保证npm将永远免费。
微服务项目:尚融宝(12)(前端平台:NPM包管理器)