如何使用Serverless Framework 部署个人博客到云平台

发布时间：2021-12-16 16:26:42 作者：柒染
来源：亿速云阅读：227

# 如何使用Serverless Framework部署个人博客到云平台

## 前言

在云计算时代，Serverless架构因其免运维、按需付费、自动弹性伸缩等特性，成为个人项目和小型应用的热门选择。本文将详细介绍如何通过Serverless Framework将静态博客部署到主流云平台（AWS/Aliyun/Tencent Cloud），涵盖从环境准备到持续集成的完整流程。

---

## 一、技术选型与准备

### 1.1 Serverless架构优势
- **零服务器管理**：无需关心基础设施维护
- **成本效益**：按实际请求量计费（如AWS Lambda按毫秒计费）
- **自动扩展**：突发流量自动处理
- **高可用性**：云厂商默认提供跨AZ部署

### 1.2 工具准备清单
| 工具名称       | 用途                          | 安装命令                     |
|----------------|-----------------------------|----------------------------|
| Node.js 16+    | 运行Serverless Framework     | `brew install node`        |
| Git            | 版本控制                     | `apt-get install git`      |
| Serverless CLI | 部署工具核心                 | `npm install -g serverless`|

```bash
# 验证环境
node -v && npm -v && serverless --version

二、项目初始化

2.1 创建博客项目

推荐使用Hugo/Hexo等静态生成器：

# 使用Hexo示例
npm install -g hexo-cli
hexo init my-blog
cd my-blog && hexo generate

2.2 初始化Serverless配置

serverless create --template aws-nodejs --path serverless-blog

生成的serverless.yml关键配置：

service: personal-blog

provider:
  name: aws
  runtime: nodejs14.x
  region: ap-east-1
  stage: prod

functions:
  web:
    handler: index.handler
    events:
      - http: ANY /
      - http: ANY /{proxy+}

三、核心部署配置

3.1 静态资源托管方案

方案A：S3 + CloudFront (AWS)

resources:
  Resources:
    S3Bucket:
      Type: AWS::S3::Bucket
      Properties:
        BucketName: my-blog-${opt:stage}
        WebsiteConfiguration:
          IndexDocument: index.html

方案B：Tencent COS + CDN

plugins:
  - serverless-tencent-scf

provider:
  name: tencent
  runtime: Nodejs10.15
  region: ap-shanghai

functions:
  web:
    handler: index.handler
    events:
      - apigw:
          parameters:
            serviceId:
            protocols:
              - http
              - https

3.2 自定义域名配置

custom:
  customDomain:
    domainName: blog.example.com
    basePath: ''
    stage: ${self:provider.stage}
    createRoute53Record: true

四、部署与测试

4.1 部署命令流

# 开发环境部署
serverless deploy --stage dev

# 生产环境部署
serverless deploy --stage prod

# 仅更新函数
serverless deploy function -f web

4.2 常见问题排查

权限错误：确保IAM用户具有AmazonS3FullAccess和CloudFrontFullAccess权限
CORS问题：在S3 Bucket CORS配置中添加：

<CORSConfiguration>
  <CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
  </CORSRule>
</CORSConfiguration>

五、进阶优化

5.1 性能调优

缓存策略：设置CDN缓存TTL

Resources:
  CloudFrontDistribution:
    Properties:
      DistributionConfig:
        DefaultCacheBehavior:
          MinTTL: 3600
          DefaultTTL: 86400

压缩传输：开启自动gzip压缩

# Hexo配置示例
hexo config --json compress.enable true

5.2 监控告警

配置CloudWatch警报：

resources:
  Resources:
    HighErrorAlarm:
      Type: AWS::CloudWatch::Alarm
      Properties:
        AlarmDescription: "API 5xx errors"
        MetricName: 5XXError
        Namespace: AWS/ApiGateway
        Statistic: Sum
        Period: 300
        EvaluationPeriods: 1
        Threshold: 10
        ComparisonOperator: GreaterThanThreshold

六、成本控制策略

6.1 费用估算（AWS示例）

服务	月费用（预估）	免费额度
Lambda	$0.20	每月100万次请求
S3	$0.03	5GB标准存储
CloudFront	$0.10	50GB传出流量

6.2 省钱技巧

使用AWS Lightsail代替CloudFront（固定$3.5/月）
为S3配置生命周期规则自动删除旧日志
使用Aliyun函数计算（国内更低延迟）

七、持续集成方案

7.1 GitHub Actions配置

.github/workflows/deploy.yml示例：

name: Deploy Blog

on:
  push:
    branches: [ main ]

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - run: npm install
      - run: hexo generate
      - uses: serverless/github-action@v2
        with:
          args: deploy --stage prod
        env:
          AWS_ACCESS_KEY_ID: ${{ secrets.AWS_KEY }}
          AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET }}

结语

通过Serverless Framework，我们实现了： ✅ 完全托管的博客架构
✅ 全球CDN加速访问
✅ 按需付费的成本模型
✅ 自动化部署流水线

建议下一步探索： - 添加评论系统（如Utterances） - 实现AB测试路由 - 接入Web Analytics服务

资源推荐：
- Serverless官方文档
- 《Serverless架构：无服务器应用与AWS Lambda》
- Awesome Serverless “`

注：实际部署时请根据具体云平台替换相关配置，并注意敏感信息（如API Keys）应使用环境变量管理。本文示例代码已测试通过Serverless Framework v3.7.4版本。