跳到主要内容

谈谈部署

  • 自动化部署
  • 静态资源如何处理
  • OSS+CDN方案，配置gzip

部署方案​

  • Jenkins

  • nginx

  • docker

  • 第三方平台

    • 阿里云云效
    • 腾讯的coding

谈谈项目中如何部署​

前端项目部署主要是将打包后的静态资源文件放到一个web服务器，通常是放在nginx的静态资源服务中

  • 如果是手动部署的话，要在本地打包，打包好的文件，上传到nginx的服务器中

  • 自动化部署cicd：提高发版的效率，避免了手动发版，手动发版效率低，也繁琐，把时间成本专注与业务上

    • 当提交代码到特定的分支后，会触发cicd （发布系统、Jenkins 、GitLab CI）

    • cicd会触发相关脚本，执行构建流程，自动把构建好的文件，上传到服务器

    • 发布成功之后，会有一个通知 （飞书群）

  • 通过自动化部署，把开发重心更多放在项目业务上，而不是重复发版操作上

静态资源部署到OSS + CDN​

  • 静态资源上传至 OSS，并对 OSS 提供 CDN 服务 【OSS 是做存储的，CDN 是做内容加速的 】
  • OSS + CDN一般二者是配合使用的，对象存储oss里面存的就是一些图片、视频、文件等等，都是静态数据，可以给用CDN做加速
  • 把静态资源上传到源站对象存储之后，源站会进行CDN的内容分发，分发到每个地区中，提高用户访问资源的响应速度
  • 只使用CDN也是可以的，不一定使用OSS搭配

COS/OSS：对象存储（源站)、CDN是内容分发网络

  • COS (Cloud Object Storage) 对应腾讯云
  • OSS (Object Storage Service) 对应阿里云

OSS配置​

  • 1、在OSS中配置CDN服务

  • 2、配置oss压缩

CDN配置​

  • 缓存

    • 设置合适的缓存时间，使静态资源能够被客户端长时间缓存，减少请求次数

    CDN的缓存不会自动刷新, 需要手动刷新. 假如你更新某个文件的资源, 但是文件的名字没有改变, 那么需要手动刷新CDN, 不然客户端是访问不到更新的资源的

  • 压缩

自动化部署遇到过什么问题吗​

  • 构建缓存问题，有时候发现部署之后没有效果

    • 需要手动清除一下构建的缓存

  • node版本需要升级，云服务平台里面的node版本与当前版本不符合，可能会出现构建失败

如何推进自动化部署？​

在每次提交代码的时候，都会自动更新部署新的版本到环境中

目前的手动发版部署的问题

  • 手动发版效率太低，也太繁琐
  • 减少人为错误的发生

自动化部署目的

  • 减少重复劳动力
  • 提高发版的效率
  • 把时间成本更专注于业务上

第三方部署平台

  • 提供了全面的服务，云服务平台提供了自动化、监控、硬件设备、技术支持、维护支持，让部署流程更加自动化和高效

自建服务

  • 自建人力成本、维护成本高,自建需要搭建服务、监控、运维、设备等等，云服务可以解决这些问题

谈谈docker容器化​

  • 通过docker容器可以更好的隔离环境
  • 对于每个项目来说，依赖的环境都可能不一样，有些项目可能依赖node14，node16版本，通过容器就可以很好解决这个问题， 每个服务都是一个镜像， 只需要切换不同的镜像，启动容器，就可以跑起来了
  • 可以把前端包 构建成 Docker image 镜像提供給其他人使用

docker常用操作

js
docker images
docker pull
docker ps
docker run 
docker exec

谈谈docker部署构建前端镜像流程​

  • 1、前端使用Docker构建自动化流程
    • 1、定义Dockerfile的构建镜像文件
    • 2、定义相关的构建脚本，如npm install、npm build等等
    • 3、再使用nginx镜像，把构建好的文件复制到nginx的静态文件目录中
    • 4、暴露nginx端口，启动nginx
  • 2、在项目根目录中构建Docker镜像
  • 3、构建完之后，再运行Docker容器
    • 运行Docker容器，需要指定容器的端口

你是如何配置gitlab cicd?​

  • 1、在gitlab创建项目仓库
  • 2、在项目上 创建.gitlab-ci.yml 【ci配置文件】
  • 3、在配置文件中，针对性的配置 （定义构建阶段和任务、指定 Runner 和镜像、指定特定分支来指定构建脚本）
    • image: 指定所使用的 Docker 镜像
    • stages：定义构建阶段
    • tags：指定runner运行器环境
      • runner 表示是运行Job（构建工作）的容器或管理者
    • script： 定义了当前阶段的执行脚本列表
    • only: 通过only来指定特定的分支来执行当前阶段的脚本

你是如何配置jenkins cicd?​

  • 创建任务

  • 配置git、绑定仓库地址

  • 构建触发器

  • 构建环境

  • 执行脚本

    • 把打包好的目录映射到nginx目录中