关于cdn:jsDelivrGithub-自建免费CDN

为什么要用 CDN？

CDN 的全称是 Content Delivery Network，即内容散发网络。CDN 是构建在网络之上的内容散发网络，依附部署在各地的边缘服务器，通过核心平台的负载平衡、内容散发、调度等功能模块，使用户就近获取所需内容，升高网络拥塞，进步用户拜访响应速度和命中率。CDN 的关键技术次要有内容存储和散发技术。
— 百度百科

艰深的来讲 CDN 次要有两个性能：

• 根底性能：能够提供动态文件内容
• 次要性能：减速内容获取，进步访问速度

jsDelivr 是什么

A free, fast, and reliable Open Source CDN for npm, GitHub, Javascript, and ESM.
— from https://www.jsdelivr.com/

简略来说就是它能够为凋谢资源（比方 npm/github release 等）提供 CDN 服务。

网络散布：https://www.jsdelivr.com/netw…

能够看到在中国也有好几台服务器，国内应用也能够齐全不必放心速度。

jsDelivr + Github 能够做什么？

通过 jsDelivr 能够加载 github 仓库里的文件内容。

通过 jsDelivr 援用资源

罕用：应用 release 包外面的内容

指定版本：

https://cdn.jsdelivr.net/gh/ 你的用户名 / 你的仓库名 @公布的版本号 / 文件门路 

例如：https://cdn.jsdelivr.net/gh/s…
就是加载 v0.1.3 版本下的这个文件：https://github.com/specialCod…

其余应用办法

以 jquery 为例子：https://github.com/jquery/jquery

// 应用版本范畴而不是特定版本
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2/dist/jquery.min.js   https://cdn.jsdelivr.net/gh/jquery/jquery@3/dist/jquery.min.js
 
// 齐全省略该版本以获取最新版本
https://cdn.jsdelivr.net/gh/jquery/jquery/dist/jquery.min.js
 
// 将“.min”增加到任何 JS/CSS 文件中以获取放大版本，如果不存在，将为会主动生成
https://cdn.jsdelivr.net/gh/jquery/jquery@3.2.1/src/core.min.js
 

其余用法

// 加载任何 Github 公布、提交或分支
https://cdn.jsdelivr.net/gh/user/repo@version/file

// 在开端增加 / 以获取资源目录列表（返回以 html 文件，页面中展现列表）https://cdn.jsdelivr.net/gh/jquery/jquery/

github 局部

通过下面咱们晓得了 jsDelivr 能够加载 github release 下的内容，接下来咱们须要：

1. 创立 github cdn 仓库
2. 公布版本
3. 实现 push 的时候主动公布版本

创立 github cdn 仓库

拜访 https://github.com/ 创立，目前创立 public 仓库获取文件是没有问题的（private 仓库还没试过）。
而后把仓库代码克隆到本地，往仓库里增加你须要的文件，而后提交到近程即可。

公布版本

tag 与 release【待补充】

在仓库主页，点击左边区域 Release 按钮：

点击「创立一个新的 relaese」:

创立 release：

• choose tag: 抉择一个曾经存在的 tag 或者新建一个，对于 git tag
• target: 抉择一个分支或者一次提交。倡议抉择主分支
• title: 输出 title，会显示在版本列表中
• description: 输出版本形容
• Attach files: 疏忽
• pre-release: 公布测试版版本的时候能够勾选

输出结束而后抉择「Publish relasese」就能够了。

主动公布

应用 github action 来实现主动公布：

• mian 分支有提交的时候就会公布
• 应用 package.json 外面的 verison 管制 tag 和 版本号（tag 与 版本号统一）
• 每次都公布正式版本

.github/workflow/publish.yml 内容:

# This is a basic workflow to help you get started with Actions

name: release CI

# Controls when the workflow will run
on:
  # Triggers the workflow on push or pull request events but only for the main branch
  push:
    branches:
      - main

# A workflow run is made up of one or more jobs that can run sequentially or in parallel
jobs:
  # This workflow contains a single job called "build"
  build:
    # The type of runner that the job will run on
    runs-on: ubuntu-latest

    # Steps represent a sequence of tasks that will be executed as part of the job
    steps:
      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
      - name: Checkout
        uses: actions/checkout@v2

      - name: 读取以后版本号
        id: version
        uses: ashley-taylor/read-json-property-action@v1.0
        with:
          path: ./package.json
          property: version

      # Runs a set of commands using the runners shell
      - name: Release
        # uses: softprops/action-gh-release@v1
        # if: startsWith(github.ref, 'refs/tags/')
        uses: actions/create-release@master
        env:
          GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}
        with:
          tag_name: v${{steps.version.outputs.value}}
          release_name: v${{steps.version.outputs.value}}
          body: Release v${{steps.version.outputs.value}}
          draft: false
          prerelease: false

至此，github 局部实现。

总结

咱们实现了自制 CDN，并且能够主动发版。这样就能够欢快的应用了～～
思考🤔 如何把它做成一个接口？？这样咱们在文件需要较少的时候就省去了购买 文件存储的花销。

参考

• 收费 CDN：jsDelivr+Github 应用办法