🎬 视频发布指南

网站支持两种视频发布方式：B 站嵌入（公开分享）和本地托管（自控内容）。

---

方式一：B 站嵌入（推荐大多数场景）

上传

1. 打开 Bilibili 创作中心
2. 上传视频 → 填写标题/标签 → 发布
3. 打开视频播放页，地址栏复制 URL

嵌入文章

## 演示视频

<iframe src="//player.bilibili.com/player.html?bvid=BV1xx411c7mD&page=1"
  width="100%" height="500" scrolling="no" border="0"
  frameborder="no" framespacing="0" allowfullscreen="true"
  style="max-width:800px;aspect-ratio:16/9;">
</iframe>

• bvid=xxx — 从视频 URL 中复制 BV 号
• page=1 — 多 P 视频指定第几 P
• aspet-ratio:16/9 — 保持宽高比

优点	缺点
不占服务器空间和带宽	有 B 站水印
国内 CDN 秒开	需审核（一般几分钟）
自动多清晰度	不能删 B 站那边的视频

---

方式二：本地托管（自控内容）

压缩视频

# 在项目根目录执行
bash compress-video.sh ~/Desktop/my-recording.mp4

脚本会：

• 转为 H.265 编码（压缩率最高）
• 缩放到 1080p
• 输出到 docs/public/videos/

嵌入文章

<video src="/videos/my-recording.mp4" controls width="100%"
  poster="/videos/my-recording-cover.jpg"
  style="max-width:800px;border-radius:8px;">
  你的浏览器不支持视频播放
</video>

属性	说明
controls	显示播放控制条
poster	封面图（可选）
width="100%"	自适应宽度
max-width	限制最大宽度

视频/封面文件位置

docs/public/videos/
├── my-recording.mp4          ← 视频文件
└── my-recording-cover.jpg    ← 封面图（可选）

构建后会自动出现在网站的 /videos/ 路径下。

---

两种方式对比

	B 站嵌入	本地托管
服务器空间	0	~100MB/个
服务器带宽	0	你出
播放体验	CDN 加速	取决于服务器带宽
审核	需要	不需要
适合	教程、演示、分享	内部资料、敏感内容
清晰度	自动多档	只有你压的那一档

一句话：能公开的就传 B 站，需要自控的就本地托管。