使用 GitHub 和 jsDelivr 图床，可以免费、稳定地存储和访问图片文件。以下是详细的搭建流程，帮助你将 GitHub 作为存储库，并通过 jsDelivr 快速访问图片。

---

创建 GitHub 仓库

1. 登录 GitHub (opens new window)。
2. 点击右上角的 “New repository” 创建一个新的仓库。
3. 填写仓库名（如 cdn），设置为 Public（公开），这样 jsDelivr 才能访问。
4. 无需添加 README 或 .gitignore 文件（当然也可以添加）。

---

上传图片到 GitHub 仓库

1. 进入刚创建的仓库。
2. 点击 "Add file" -> "Upload files"。
3. 拖拽或选择你想上传的图片文件。
4. 提交更改：填写 Commit message（如 "Upload images"），然后点击 "Commit changes"。

---

获取图片的 URL

1. 进入你的 GitHub 仓库，点击你上传的图片，进入图片的详细页面。
2. 鼠标右键 赋值得到图片的 GitHub 原始链接。
   • 示例：

     https://github.com/ArnoldShu/cdn/blob/main/banner/black.jpg?raw=true
     

---

通过 jsDelivr 加速图片

1. 将图片的 GitHub 原始链接转换为 jsDelivr 的格式：

   • jsDelivr链接格式：

     https://cdn.jsdelivr.net/gh/username/repo_name@branch_name/file_path
     

   • 示例：
     如果 GitHub 原始链接为：

     https://github.com/ArnoldShu/cdn/blob/main/banner/black.jpg?raw=true
     

     则 jsDelivr 加速链接为：

     https://cdn.jsdelivr.net/gh/ArnoldShu/cdn@main/banner/black.jpg
     https://cdn.jsdelivr.net/gh/ArnoldShu/cdn/banner/black.jpg
     https://fastly.jsdelivr.net/gh/ArnoldShu/cdn/banner/black.jpg
     

---

步骤五：检查和使用图片

1. 将上述生成的 jsDelivr 链接粘贴到浏览器中，确认图片能正常访问。
2. 你可以将这些图片的链接用于：
   • HTML 页面：

     <img src="https://cdn.jsdelivr.net/gh/username/image-hosting@main/image1.jpg" alt="Image">
     

   • Markdown 文件：

     ![Image](https://cdn.jsdelivr.net/gh/username/image-hosting@main/image1.jpg)
     

---

附加技巧

1. 自动更新图片链接：

   • 如果你在仓库中更新了图片，无需改变 jsDelivr 链接。jsDelivr 会根据最新的提交自动更新资源。

2. 版本控制：

   • 在 jsDelivr 链接中指定版本号：

     https://cdn.jsdelivr.net/gh/username/image-hosting@v1.0/image1.jpg
     

   • 如果不指定版本号（使用 @main），则会始终加载仓库的最新版本。

3. 缓存问题：

   • 如果 jsDelivr 缓存没有及时更新，可以在 URL 末尾添加参数，例如：

     https://cdn.jsdelivr.net/gh/username/image-hosting@main/image1.jpg?v=1
     

---

总结

通过 GitHub 和 jsDelivr 搭建图床，可以免费存储图片，并通过 CDN 加速访问。整个流程稳定高效，非常适合用于个人博客、项目页面或 Markdown 文档中的图片展示。

​