butterfly主题(一)安装部署

📚 文档目录

🚀 butterfly主题(一)安装部署 - 📌 butterfly主题(二)基本设置 - 🌈 butterfly主题(三)美化

butterfly 是 Hexo 静态网站框架的一个主题，可扩展性较强，适合展示类博客或者网站。

环境

Nodejs
Git

安装

安装 Hexo

Windows 首次安装需启用 windows shell 外部脚本权限，以管理员权限执行执行以下命令，Y 回车确认

1	Set-ExecutionPolicy -ExecutionPolicy Bypass

npm更换国内镜像源

1	npm config set registry https://registry.npmmirror.com/

安装 hexo 初始化脚本

1	npm install -g hexo-cli

1	mkdir hexo && cd hexo

初始化(安装 Hexo)

hexo init

项目初始结构（版本不同可能有细微差异）

.
├── .github
| 	└── dependabot.yml  # 依赖更新脚本，会创建一个新分支存放最新依赖，建议删除
├── node_modules # 依赖
├── scaffolds # 模板，可在这里设置 Front Matter
| 	├── draft.md  # 草稿模板
| 	├── page.md # 页面模板
|	  └── post.md # 文章模板
├── source # 存放文章、页面
|	  └── _posts  # 文章
├── themes  # 主题文件目录
├── _config.landscape.yml # 默认主题配置，安装完新主题后可删除
├── _config.yml # 站点配置文件
├── .gitignore  # git忽略文件，用来指定哪些文件或者目录不被提交
├── package.json  # 包管理配置文件，记录项目信息和依赖名称及版本
└── package-lock.json # 存储每个安装的依赖是哪个版本

安装 butterfly

下载主题

# 推荐
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

# 备用
git clone -b master https://gitee.com/immyw/hexo-theme-butterfly.git themes/butterfly

删除themes\butterfly\.git、themes\butterfly\.github目录

1	Remove-Item -LiteralPath "themes\butterfly\.git", "themes\butterfly\.github" -Recurse -Force

安装 pug 以及 stylus 的渲染器（不安装主题无法显示）

1	npm install hexo-renderer-pug hexo-renderer-stylus --save

应用主題，修改 hexo 配置文件_config.yml，搜索theme:字段，修改默认主题为butterfly

1	theme: butterfly

常用命令

Hexo基本命令	作用
hexo init	一键安装Hexo
hexo s	本地运行博客，默认端口`4000`
hexo clean	清除静态资源
hexo g	将markdown文档编译为HTML源码，默认存放目录`public`
hexo n title	创建一篇新的文章，文章标题是 title

内容创建

Front Matter

文章和页面的相关参数设置

页面 Front Matter

---
title:  # 【必需】页面标题
type: # 【必需】标签、分类和友情链接三个页面需要配置
top_img:  # 【可选】页面顶部图片
toc: # 【可选】侧边栏目录
comments: # 【可选】显示页面评论模块（默认 true）
aside:  # 【可选】显示侧边栏（默认 true）

date: # 【可选】页面创建日期
updated:  # 【可选】页面更新日期
description:  # 【可选】页面描述
keywords: # 【可选】页面关键词
mathjax:  # 【可选】显示mathjax（当设置mathjax的per_page： false时，才需要配置，默认 false）
katex:  # 【可选】显示katex（当设置katex的per_page： false时，才需要配置，默认 false）

aplayer:  # 【可选】在需要的页面加载aplayer的js和css
highlight_shrink: # 【可选】配置代码框是否展开（true/false）（默认为设置中highlight_shrink的配置）
---

文章 Front Matter

---
title: 笔记 # 【必需】文章标题
date: 2022-01-12 11:51:53 # 【必需】文章创建日期
categories: 前端 # 【必需】文章分类
tags: CSS # 【必需】文章标签
top_img:  # 【可选】文章顶部图片
cover:  # 【可选】文章封面（如果没有设置top_img，文章页顶部将显示缩略图，可设为false/图片地址/留空）
sticky: 1 # 文章置顶，数值越大，优先级越大

aside:  # 【可选】显示侧边栏 （默认 true）
comments: # 【可选】显示文章评论模块（默认 true）

updated:  # 【可选】文章更新日期
keywords: # 【可选】文章关键词
description:  # 【可选】文章描述，设置后优先出现在文章预览界面

toc:  # 【可选】显示文章TOC（默认为设置中toc的enable配置）
toc_number: # 【可选】显示toc_number（默认为设置中toc的number配置）
toc_style_simple: # 【可选】显示 toc 简洁模式

copyright:  # 【可选】显示文章版权模块（默认为设置中post_copyright的enable配置）
copyright_author: # 【可选】文章版权模块的文章作者
copyright_author_href:  # 【可选】文章版权模块的链接文章作者
copyright_url:  # 【可选】文章版权模块的链接文章链接
copyright_info: # 【可选】文章版权模块的文字版权声明

mathjax:  # 【可选】显示mathjax（当设置mathjax的per_page： false时，才需要配置，默认 false）
katex:  # 【可选】显示katex（当设置katex的per_page： false时，才需要配置，默认 false）
aplayer:  # 【可选】在需要的页面加载aplayer的js和css
highlight_shrink: # 【可选】配置代码框是否展开（true/false）（默认为设置中highlight_shrink的配置）
---

文章多分类写法

1
2
3

categories: 
  - 笔记
  - linux

文章子分类写法

1
2
3

categories: 
  - [笔记,linux]
  - [搭建]

linux是笔记的一个子分类，搭建是单独的一个分类

创建页面

分类页面

1	hexo new page categories

创建完成后在 Front Matter 添加

type: "categories"
top_img: false
aside: false
comments: false

标签页面

1	hexo new page tags

创建完成后在 Front Matter 添加

type: "tags"
top_img: false
aside: false
comments: false

关于页面

1	hexo new page about

创建完成后在 Front Matter 添加

type: "about"
top_img: false
aside: false
comments: false

友链页面

1	hexo new page link

创建完成后在 Front Matter 添加

1
2
3

type: "link"
top_img: false
aside: false

在source/_data目录中（如果沒有_data文件夹，请自行创建），创建一个文件link.yml，编辑你的友链

- class_name: 友情链接
  class_desc: 那些人，那些事
  link_list:
    - name: Hexo
      link: https://hexo.io/zh-tw/
      avatar: https://d33wubrfki0l68.cloudfront.net/6657ba50e702d84afb32fe846bed54fba1a77add/827ae/logo.svg
      descr: 快速、简单且强大的博客框架

- class_name: 网站
  class_desc: 值得推荐的网站
  link_list:
    - name: Youtube
      link: https://www.youtube.com/
      avatar: https://i.loli.net/2020/05/14/9ZkGg8v3azHJfM1.png
      descr: 视频网站
    - name: Twitter
      link: https://twitter.com/
      avatar: https://i.loli.net/2020/05/14/5VyHPQqR6LWF39a.png
      descr: 社交分享平台

说说页面

1	hexo new page shuoshuo

创建完成后在 Front Matter 添加

1
2
3

type: "shuoshuo"
top_img: false
aside: false

数据来源

在 Hexo 根目录中的source/_data（如果没有 _data 文件夹，请自行创建），创建一个文件 shuoshuo.yml

author和avatar可省略，会自动去获取配置文件中的author和avatar
如果需要开啓评论，必须配置key，否则不会显示评论按钮

- author: Butterfly
  avatar: https://butterfly.js.org/img/avatar.png
  date: 2024-06-21 23:33:26
  key: key-1
  content: |
    This is a sample content for **Author 1**.
    ![Sample Image](https://via.placeholder.com/150)
  tags:
    - tags1
    - tags2
- author: Butterfly
  avatar: https://butterfly.js.org/img/avatar.png
  date: 2024-06-20 23:33:26
  key: key-2
  content: |
    This is a sample content for **Author 2**.
    ![Sample Image](https://via.placeholder.com/150)
  tags:
    - tag2
    - tag3

- author: Butterfly
  avatar: https://butterfly.js.org/img/avatar.png
  date: 2024-06-19 23:33:26
  key: key-3
  content: |
    This is a sample content for **Author 3**.

| 参数 | 解释 | | ---- | ---- | | author | 【可选】作者名称 | | avatar | 【可选】作者头像 | | date | 【必需】日期 | | content | 【必需】内容（ Markdown 格式或者 Html 格式） | | key | 【可选】评论的唯一标识, 开启评论必须配置 | | tag | 【可选】标签 |

注意：选择远程加载后，本地生成的方法会无效。
远程拉取只支持json

在说说页面 Markdown 里的 front-matter 添加远程链接

1	shuoshuo_url: xxxxx

Json 的格式：

author和avatar可省略，会自动去获取配置文件中的author和avatar

[
  {
    "author": "Butterfly",
    "avatar": "https://butterfly.js.org/img/avatar.png",
    "date": "2024-06-21 23:33:26",
    "content": "This is a sample content for **Author 1**.",
    "key": "key-1",
    "tags": ["tags1", "tags2"]
  },
  {
    "author": "Butterfly",
    "avatar": "https://butterfly.js.org/img/avatar.png",
    "date": "2024-06-20 23:33:26",
    "content": "This is a sample content for **Author 2**.",
    "key": "key-2",
    "tags": ["tag2", "tag3"]
  },
  {
    "author": "Butterfly",
    "avatar": "https://butterfly.js.org/img/avatar.png",
    "date": "2024-06-19 23:33:26",
    "content": "This is a sample content for **Author 3**."
  }
]

创建文章

创建新文章

1	hexo new 新文章

创建后会在source/_post文件夹生成一个新文章.md文件，内容如下

---
title: 新文章
date: 2022-04-10 07:31:09
tags:
---

升级

在 hexo-theme-butterfly/releases 查看新版的更新内容，根据实际情况更新你的配置内容。

部署

静态博客的优点就是不过度依赖服务器，所以有很多部署方法，甚至不花一分钱也能有很好的体验

代码托管

Github 世界上最大的代码托管平台，微软旗下产品，缺点是被墙了
Gitlab 还是美国产品，暂时没有被墙，且用且珍惜
Gitee 开源中国旗下产品，国内代码平台都是受管控的，有时候乱和谐，不推荐用来写博客
Coding 腾讯旗下产品，没用过，不了解

云编译平台

Vercel

个人认为最好用的一个，平均延迟80ms，每月免费100G流量、免费HTTPS证书，虽然给的域名被墙了，不过没啥影响，绑定个域名就能用了，节点被墙后恢复的也快

新建一个 Gitlab 仓库，并导入 Vercel
首次推送到 Gitlab 仓库

git init
git add .
git commit -m "$(date)"
git push -u -f https://gitlab.com/pbloods/hexo.git main

GitLab默认不允许强制推送，后台关闭即可，详见

后续使用shell脚本一键推送，项目根目录新建文件push.ps1

1
2
3

git add ./
git commit -m "$(date)"
git push

写完文章根目录执行以下命令即可推送

1	./push.ps1

Github Pages

通过Github Actions实现云编译，优点是代码和Web托管都在一个平台，缺点是比较麻烦，而且github被墙，要一直挂着梯子使用，不推荐，不过作为源站使用也还凑合

name: ci

on: [push]

jobs: # 工作流
  build: # 自定义名称
    runs-on: ubuntu-latest #运行在虚拟机环境ubuntu-latest

    steps: # 步骤
      - name: Checkout 🛎️
        uses: actions/checkout@v3 # 步骤1、检出仓库，获取源码

      - name: setup-node
        uses: actions/setup-node@v3 # 步骤2、安装node
        with:
          node-version: '16'

      - name: Install and Build 🔧 
        run: |
          npm install
          npm run build

      - name: Deploy 🚀
        uses: JamesIves/github-pages-deploy-action@4.1.5 # 步骤3、将静态资源推送到指定分支
        with:
          branch: gh-pages # 需要上传静态资源的分支
          folder: public # 静态资源目录

Gitlab Pages

Gitlab Pages默认导入仓库代码，比Github Actions还简单，但是现在需要国外手机号或者信用卡验证才能用了

Gitlab CI:

# The Docker image that will be used to build your app
image: node:lts
# Functions that should be executed before the build script is run
before_script:
  - npm install
pages:
  script:
    - npm run build
  artifacts:
    paths:
      # The folder that contains the files to be exposed at the Page URL
      - public
  rules:
    # This ensures that only pushes to the default branch will trigger
    # a pages deploy
    - if: $CI_COMMIT_REF_NAME == $CI_DEFAULT_BRANCH

cloudflare pages

响应延迟平均190ms

备案

什么是备案
备案是国内有关部门为了管控国内网站、APP、小程序的一项措施，不备案无法正常使用国内厂商的某些云服务，比如CDN、内网穿透、网页托管等，域名还有可能被墙掉。

备案的种类

ICP备案 ICP备案是由工信部主导的，第三方云服务商（如阿里云、腾讯云）参与的备案，至少需要购买云服务厂商的一台服务器或者服务才能申请备案，目前的备案主要是域名备案，若主域名完成备案，子域名可自由使用。注意此备案完成后通过备案域名可以查到你的姓名。
公安备案 公安备案是由公安部网络安全保卫局主导的，由当地公安审核。根据《中华人民共和国计算机信息系统安全保护条例》以及《计算机信息网络国际联网安全保护管理办法》的相关规定，开办服务必须到当地公安机关网安部门办理备案手续，并且在自网络正式联通后的三十日内办理，如果不履行，公安机关会给予警告或者停机整顿不超过六个月的处罚。注意此备案完成后通过域名可以查到你的姓名和所在城市。

申请备案：

阿里云ICP备案购买一台阿里云的服务器然后将你的主域名解析到这台服务器IP，申请备案即可。
腾讯云ICP备案购买一台腾讯云的服务器然后将你的主域名解析到这台服务器IP，申请备案即可。

注销备案
ICP备案一般在云服务厂商申请注销即可，若无法注销需到当地对应政务部门申请注销，安徽的可在《皖事通办》APP申请注销。
公安备案在公安部网络安全保卫局注销即可。

CDN

先了解一下自选IP的概念，自选IP是一种通过手动选择最优节点来优化访问体验的技术，尤其适用于国外CDN（如Cloudflare CDN、Amazon CloudFront）在国内没有节点或线路未优化的情况。由于这些CDN的默认节点可能延迟较高，导致国内访问体验较差，自选IP可以帮助用户找到更快的节点，从而提升访问速度。

举个例子，我的博客最初托管在Github Pages上，域名为xdog.github.io，但由于Github Pages在国内访问较慢且不稳定，我决定使用Cloudflare CDN来加速。为此，我购买了一个新域名cf.xdog.top，添加CNAME记录到xdog.github.io并开启Cloudflare的小云朵，这样就接入了Cloudflare。然而，默认的Cloudflare节点仍然较慢。于是，我通过工具找到了一些延迟较低的Cloudflare节点IP（如1.1.1.1和2.2.2.2），并创建了一个中转域名cdn-xdog.oss-ap-northeast-1.aliyuncs.com，为其添加了两个A记录，分别指向1.1.1.1和2.2.2.2。接着，我将blog.xdog.top通过CNAME记录指向cdn-xdog.oss-ap-northeast-1.aliyuncs.com，从而实现了通过自选IP优化访问的目的。

Cloudflare CDN 免备案，免费使用，免费HTTPS证书，但都是国外节点，平均延迟150ms以上，下面是一些优选节点或者Cname域名。
Amazon CloudFront 免备案，每月1T免费流量、200万次HTTP/HTTPS请求、免费HTTPS证书，移动联通线路平均延迟50ms左右，电信线路平均延迟160ms左右，比Cloudflare的好多了，但要绑定信用卡，注意设置限额和开启防攻击功能，配置教程，不用折腾什么优选节点，因为好节点不是被墙就是在被墙的路上，不如直接用默认的
，下面是大佬扫出来的亚马逊国内节点，但貌似开通亚马逊中国账号才能用，怎么开通不清楚

亚马逊国内节点

云南昆明CU
14.204.185.244
14.204.185.207
天津CU
60.28.100.48
60.28.100.46
60.28.100.55
60.28.100.69
60.28.100.83
60.28.100.220
河南驻马店CU
61.163.234.50
61.163.234.64
61.163.234.66
黑龙江哈尔滨CU
61.167.55.23
天津CU
111.161.121.21
111.161.122.76
111.161.122.123
111.161.122.159
111.161.122.121
111.161.122.122
重庆CU
113.207.5.51
辽宁抚顺CU
116.138.177.173
116.138.177.175
116.138.177.186
116.138.177.170
陕西宝鸡CU
123.138.203.115
123.138.203.113
123.138.203.126
123.138.203.110
123.138.203.114
福建泉州CU
175.43.120.63
175.43.120.221
175.43.120.195
175.43.120.205
上海CU
211.95.52.157
211.95.52.172
河北邯郸CU
221.193.246.83
221.193.246.97
江苏南通CU
36.156.74.86
36.156.74.71
Ucloud-北京BGP
106.75.4.162
106.75.16.214
106.75.34.130
Ucloud-广州BGP
106.75.130.199
106.75.136.107
106.75.137.7
106.75.141.189
河南郑州CM
111.7.109.85
湖北武汉CM
111.47.222.145
111.47.222.144
111.47.222.152
宁夏银川
111.51.66.0
111.51.66.7
111.51.66.2

又拍云加入又拍云联盟后可享每月15G免费流量，10G免费储存空间，免费HTTPS证书自动续签，响应延迟平均30ms
多吉云每月20G免费流量、200万次HTTPS请求，但是储存空间付费(0.003元/GB/日)，不过一年也就1块钱，国内节点，响应延迟平均10ms，详情
注意要配置以下缓存规则

1 2	类型内容缓存策略缓存键操作文件类型 .css;.js 6 小时保留 v 参数，其余参数忽略

缤纷云每月30G免费流量(国内)，国内节点，响应延迟平均30ms，好像没有linux系统上传工具或者API？详情
SCDN 免费线路无限流量，付费的也非常便宜，海外 CDN 免实名备案，内地 CDN 要求实名
FreeCDN 免费线路无限流量，付费的也非常便宜，海外 CDN 免实名备案，内地 CDN 要求实名

免费公共CDN

大厂运营/赞助CDN：

字节跳动CDN
cdnjs
饿了么CDN 阿里云境内 CDN；未公开发布，曾经有段时间暂停回源；仅包含 npm(unpkg)
又拍云赞助仅同步 cdnjs

个人运营/赞助：

webcache 包含常用前端公共库、Google字体库服务、CDNJS镜像服务、NPM资源文件服务，且已支持对托管在GitHub、GitLab、Gitea、Gitee、GitCode和Bitbucket等代码托管平台下的Web项目的加速。

公共图床：

路过图床图床，平均延迟1.2s
imagehub 图床，平均延迟0.9s
111666.best
Cravatar 互联网公共头像，平均延迟30ms

HTTPS证书

https://zerossl.com/
https://ohttps.com/ 自动更新HTTPS证书并同步到各个平台

云储存(图床)

整理了一些适合做图床的免费云储存，大部分云储存都支持Web托管，如果有合适的工具也能实现网站加速

Cloudflare R2 免备案，每月免费10G储存空间、1M次写操作、10M次读操作，流量无限！
Amazon S3 免备案，5G免费标准型存储，每月100G免费流量，2000次写操作，20000次读操作
国际阿里云OSS 免备案，5G免费标准型存储（本地冗余），非内地节点每月100G免费互联网下行流量，详细定价，推荐使用日本东京节点，支持自动部署，支持PicGo
又拍云加入又拍云联盟后可享每月15G免费流量，10G免费储存空间，免费HTTPS证书自动续签，支持PicGo，做博客图床很好用，但是需要备案
多吉云储存
- picgo-plugin-dogecloud 多吉云PicGo图片上传插件
- dogecloud-oss-upload 多吉云文件批量上传命令行工具
  多吉云 Gitlab CI 文件批量上传脚本
  dogecloud-oss-upload.mjs

import axios from 'axios';
import crypto from 'crypto';
import querystring from 'querystring';
import fs from 'fs';
import path from 'path';
import { S3Client, PutObjectCommand } from '@aws-sdk/client-s3';
import mime from 'mime';

// 配置
const accessKey = process.env.ACCESS_KEY; // 你的多吉云 AccessKey，在Gitlab>CI/CD里设置
const secretKey = process.env.SECRET_KEY; // 你的多吉云 SecretKey，在Gitlab>CI/CD里设置
const s3Bucket = 's-sh-11111-xdog-1111111111'; // 存储空间的 s3Bucket 值，控制台存储空间 SDK 参数选项卡中可以找到
const s3Endpoint = 'https://cos.ap-shanghai.myqcloud.com'; // 存储空间的 s3Endpoint 值，控制台存储空间 SDK 参数选项卡中可以找到
const directoryPath = 'public'; // 要上传的目录路径，替换为实际的值

/**
 * 调用多吉云 API
 *
 * @param {string} apiPath - API 接口路径，例如 '/oss/upload/put.json'
 * @param {object|string} data - 请求体数据，可以是对象或字符串
 * @param {boolean} jsonMode - 是否以 JSON 格式请求数据
 * @param {function} callback - 回调函数
 * @returns {Promise} - 返回一个 Promise
 */
function dogecloudApi(apiPath, data = {}, jsonMode = false, callback = null) {
    const body = jsonMode ? JSON.stringify(data) : querystring.encode(data); // 根据 jsonMode 选择请求体格式
    const sign = crypto.createHmac('sha1', secretKey).update(Buffer.from(apiPath + "\n" + body, 'utf8')).digest('hex'); // 生成签名
    const authorization = 'TOKEN ' + accessKey + ':' + sign; // 设置 Authorization 头部

    return new Promise((resolve, reject) => {
        try {
            axios.request({
                url: 'https://api.dogecloud.com' + apiPath, // 完整 API URL
                method: 'POST', // 使用 POST 方法
                data: body, // 请求体数据
                responseType: 'json', // 响应数据类型
                headers: {
                    'Content-Type': jsonMode ? 'application/json' : 'application/x-www-form-urlencoded',
                    'Authorization': authorization // 设置 Authorization 头部
                }
            })
            .then(response => {
                if (response.data.code !== 200) { // 如果 API 返回错误
                    callback ? callback({Error: 'API Error: ' + response.data.msg}, null) : reject({errno: response.data.code, msg: 'API Error: ' + response.data.msg});
                    return;
                }
                callback ? callback(null, response.data.data) : resolve(response.data.data);
            })
            .catch(err => {
                callback ? callback(err, null) : reject(err);
            });
        } catch (error) {
            callback ? callback(error, null) : reject(error);
        }
    });
}

// 获取临时密钥并初始化 S3 实例
dogecloudApi('/auth/tmp_token.json', {
    channel: 'OSS_FULL',
    scopes: ['*']
}, true)
    .then(data => {
        const credentials = data.Credentials;

        const s3 = new S3Client({ // 用服务端返回的信息初始化一个 S3 实例
            region: 'automatic',
            endpoint: s3Endpoint, // 存储空间的 s3Endpoint 值，控制台存储空间 SDK 参数选项卡中可以找到
            credentials: credentials,
            params: {
                Bucket: s3Bucket // 存储空间的 s3Bucket 值，控制台存储空间 SDK 参数选项卡中可以找到
            }
        });
        /**
         * 递归地上传目录及其子目录中的所有文件到 S3
         *
         * @param {string} directoryPath - 目录路径
         * @param {string} basePath - 文件的基路径
         */
        async function uploadFilesFromDirectory(directoryPath, basePath = '') {
            try {
                const files = fs.readdirSync(directoryPath); // 读取目录中的所有文件和子目录

                const uploadPromises = files.map(async file => { // 创建上传文件的 Promise 数组
                    const filePath = path.join(directoryPath, file); // 生成文件的完整路径
                    const fileStat = fs.statSync(filePath); // 获取文件状态

                    if (fileStat.isDirectory()) { // 如果是目录，递归调用 uploadFilesFromDirectory
                        await uploadFilesFromDirectory(filePath, path.join(basePath, file)); // 递归上传子目录中的文件
                    } else { // 如果是文件，上传文件
                        const fileContent = fs.readFileSync(filePath); // 读取文件内容
                        const relativePath = path.join(basePath, file).replace(/\\/g, '/'); // 构建相对路径并替换反斜杠为斜杠
                        const contentType = mime.getType(filePath) || 'application/octet-stream'; // 获取文件的 Content-Type

                        try {
                            // 上传文件
                            await s3.send(new PutObjectCommand({
                                Bucket: s3Bucket,
                                Key: relativePath,
                                Body: fileContent,
                                ContentType: contentType // 设置 Content-Type
                            }));
                            console.log(`Uploaded ${relativePath} successfully`);
                        } catch (error) {
                            console.error(`Failed to upload ${relativePath}:`, error);
                        }
                    }
                });

                await Promise.all(uploadPromises); // 等待所有文件上传完成

            } catch (error) {
                console.error('Upload failed:', error); // 打印读取目录或上传过程中的错误
            }
        }

        // 调用函数，传递目录路径和储存桶名称
        uploadFilesFromDirectory(directoryPath);
    })
    .catch(err => {
        console.error('Failed to get temporary credentials:', err);
    });

Gitlab CI:

stages:
  - dogecloud-oss-upload  # 定义阶段

build_job:  # 定义作业
  stage: dogecloud-oss-upload  # 作业所属阶段
  image: node:20-alpine  # 运行作业的环境
  before_script:
    - npm install @aws-sdk/client-s3
    - npm install axios
    - npm install mime

  script:
    - npm install
    - npm run build
    - node dogecloud-oss-upload.mjs

第三方图床：
- 去布图床

国际阿里云OSS部署方案

Github Actions

name: oss

on: [push]

jobs: # 工作流
  build: # 自定义名称
    runs-on: ubuntu-latest # 运行在虚拟机环境 ubuntu-latest

    steps: # 步骤
      - name: Checkout 🛎️
        uses: actions/checkout@v3 # 检出仓库，获取源码

      - name: Setup ossutil
        uses: manyuanrong/setup-ossutil@master  # 部署到到阿里云OSS
        with:
          endpoint: "oss-cn-hongkong.aliyuncs.com"   # 你的阿里云 Endpoint（地域节点），在阿里云 <对象存储/Bucket列表/uesname/概览> 里查询
          access-key-id: ${{ secrets.ACCESS_KEY_ID }}   # 你的阿里云 ACCESS_KEY_ID，在 <github/remote/Settings/secrets/Actions> 里填写，可以自定义名称
          access-key-secret: ${{ secrets.ACCESS_KEY_SECRET }} # 你的阿里云 AccessKey Secret，在 <github/remote/Settings/secrets/Actions> 里填写，可以自定义名称
      - run: ossutil cp -rf public oss://pblood/  # 将 public 目录复制到你的阿里云 Bucket

Gitlab CI:

stages:
  - setup_ossutil  # 定义阶段

# 定义安全变量，以便 GitLab CI/CD 使用你的阿里云密钥
variables:
  ACCESS_KEY_ID: $ACCESS_KEY_ID
  ACCESS_KEY_SECRET: $ACCESS_KEY_SECRET
  ENDPOINT: "oss-cn-hongkong.aliyuncs.com"

build_job:  # 定义作业
  stage: setup_ossutil  # 作业所属阶段
  image: node:20-alpine  # 运行作业的环境
  before_script:
    - apt-get update && apt-get install -y wget
    - wget https://gosspublic.alicdn.com/ossutil/1.7.6/ossutil64 -O /usr/local/bin/ossutil
    - chmod 755 /usr/local/bin/ossutil
  script:
    - npm install
    - npm run build
    - ossutil config -e $ENDPOINT -i $ACCESS_KEY_ID -k $ACCESS_KEY_SECRET
    - ossutil cp -rf public oss://xdog/

HTTP跳转HTTPS方法：
阿里云OSS没有HTTP自动跳转HTTPS设置项，只有开启阿里云的CDN后才会自动启用HTTP跳转HTTPS，不过我们可以通过JS实现无感跳转。

修改themes\butterfly\layout\includes\head.pug，在最顶端加上下面这段跳转代码即可

<script>
let currentUrl = window.location.href;
if (!currentUrl.startsWith("http://localhost") && !currentUrl.startsWith("https://xdog.top")) {
  window.location.replace("https://xdog.top");
}
</script>

我的部署方案

CDN原来用又拍云的，因为没用阿里的服务器，阿里取消了我的备案，用不成了，换CloudFront了😅

Xdogの小岛 Gitlab+vercel
Xdogの文档站 Gitlab+vercel
Xdogの导航 本地+FRP
Xdogの云盘 本地+FRP
Twikoo评论系统 Docker本地部署+FRP
图片、小文件 国际阿里云OSS