构建Serverless应用

发表于 分类于 Waline：

现在的gitee,coding等代码托管的平台,都取消了pages服务,这里记录一下怎么在Serverless上部署静态资源

在Page-server服务不可用的情况下，使用腾讯云Serverless架构搭建一个Hexo静态博客是一个很好的选择。本文将详细介绍如何通过腾讯云Serverless架构，并绑定存储桶和Git来构建和部署你的Hexo博客

准备工作

在开始之前，我们需要准备以下工具和资源：

  • Hexo（静态网站生成器）
  • 腾讯云账号（用于使用腾讯云Serverless服务）
  • 腾讯云命令行工具（CLI）
  • GitHub（或其他Git服务）账号（用于托管源代码）

两种方法部署,挑选适合自己的部署方式

方式一

构建 Serverless Hexo 站点

腾讯云官网地址

以下记录在官网构建的基础上新增了 配置COS和Git绑定

1. 创建Hexo静态网站

安装Hexo和初始化项目

  1. 安装Hexo：
    1
    npm install -g hexo-cli
  2. 初始化Hexo项目：
    1
    2
    3
    hexo init my-blog
    cd my-blog
    npm install
  3. 生成静态文件：
    1
    hexo generate

2. 配置腾讯云COS

腾讯云对象存储（COS）适合托管静态文件。

  1. 登录腾讯云控制台，进入COS服务。
  2. 创建新存储桶，选择公共读私有写权限。
  3. 在“基础配置”中启用静态网站托管，指定索引文档（如index.html）和错误文档（如404.html）。

存储桶

使用腾讯云CLI上传静态文件

  1. 安装并配置腾讯云CLI：
    1
    2
    pip install coscmd
    coscmd config -a <SecretId> -s <SecretKey> -b <BucketName> -r <Region>
  2. 上传静态文件到COS存储桶：
    1
    coscmd upload -r public/ /

3. 配置腾讯云Serverless服务

腾讯云Serverless框架帮助绑定存储桶和Git仓库，实现自动化部署。

安装Serverless框架

  1. 安装Serverless框架：
    1
    npm install -g serverless

配置Serverless项目

  1. 初始化Serverless项目：
    1
    2
    serverless create --template-url https://github.com/serverless/components/tree/master/templates/tencent-website --path my-hexo-blog
    cd my-hexo-blog
  2. 修改serverless.yml配置文件，绑定COS存储桶和Git仓库：
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    org: your-org-name
    app: your-app-name
    stage: dev
    component: "@serverless/tencent-website"
    name: my-hexo-blog

    inputs:
      code:
        src: ./public
        hook: npm run generate
        dist: ./public
      region: ap-guangzhou
      bucket: your-bucket-name
      protocol: https
      host: blog.yourdomain.com
      environment:
        variables:
          COS_SECRET_ID: ${env:COS_SECRET_ID}
          COS_SECRET_KEY: ${env:COS_SECRET_KEY}
          GIT_URL: git@github.com:your-repo/your-blog.git
          GIT_BRANCH: main

部署Serverless项目

  1. 部署项目：
    1
    serverless deploy

4. 配置CDN

为了提高网站访问速度和全球可用性，可以使用腾讯云CDN进行加速：

  1. 在腾讯云控制台中，进入CDN服务。
  2. 添加新的CDN加速域名，源站类型选择COS。
  3. 配置缓存规则和HTTP头。

5. 实现自动化部署

每次更新博客内容并推送到Git仓库时，Serverless服务会自动将最新的静态文件部署到COS存储桶中。

结论

上面的方法是构建一个 Serverless Hexo 站点来部署你的hexo博客

方式二

腾讯云官网

这种方法是部署hexo打包后的public文件,之前介绍过了hexo打包部署直接上传到git或者coding,这次就不做介绍了

创建Serverless应用

在腾讯云的控制台中找到Serverless.创建应用时

  • 创建方式: 应用市场
  • 模板: 快速部署website

下一步的基础配置,写好应用名和存储桶的名称,Serverless会自动创建一个存储桶,点击保存

存储桶修改

在存储桶的列表可以看到刚刚新增的存储桶,配置刚刚的存储桶

  • 在权限管理-存储桶访问权限中,把权限改为公有读私有写
  • 在基础配置-静态网址中,开启静态网址的服务

存储桶

自2024年1月1日起，新创建的存储桶不支持使用存储桶默认域名（包括存储桶域名、静态网站域名、全球加速域名）在浏览器预览文件，而是直接下载。所以需要自己自定义域名

部署Serverless

回到Serverless列表,进入应用后点击开发部署中的更新应用

选择代码托管,仓库选择自己要部署的项目,存储桶配置根据自己的需求,选择全量覆盖还是增量更新

Serverless

结论

配置完成之后,后续提交到git仓库的内容,会同步更新到存储桶中,就可以直接访问页面了

以上就是我对Serverless上部署静态资源的理解，如有错误，欢迎大佬指出

-------------本文结束感谢您的阅读-------------