使用 Github，jsDelivr，TravisCI 搭建轻量 CDN - 魏长露的博客

使用 Github，jsDelivr， TravisCI 搭建轻量 CDN

免费-快速-可靠 CDN

内容分发网络（英语：Content Delivery Network或Content Distribution Network，缩写：CDN）是指一种透过互联网互相连接的电脑网络系统，利用最靠近每位用户的服务器，更快、更可靠地将音乐、图片、影片、应用程序及其他文件发送给用户，来提供高性能、可扩展性及低成本的网络内容传递给用户。 ---- [万维百科]

jsDelivr 官网

jsDelivr – Open Source CDN

使用

1、使用方式官网首页有各个平台的引用资源方式

#NPM

//加载npm上托管的任何项目
https://cdn.jsdelivr.net/npm/package@version/file

//加载jQuery v3.2.1
https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js

//使用版本范围而不是特定版本
https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js
https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js

//完全省略该版本以获取最新版本
//您不应该在生产中使用它
https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js

//将“ .min”添加到任何JS / CSS文件以获取缩小版本
//如果不存在，我们会为您生成
https://cdn.jsdelivr.net/npm/jquery@3.2.1/src/core.min.js

//省略文件路径以获取默认文件
https://cdn.jsdelivr.net/npm/jquery@3.2

//在末尾添加/以获取目录列表
https://cdn.jsdelivr.net/npm/jquery/

#GitHub

//加载任何GitHub版本，提交或分支
//注意：我们建议对支持npm的项目使用npm
https://cdn.jsdelivr.net/gh/user/repo@version/file
... ...

#WordPress

//从WordPress.org插件SVN存储库中加载任何插件
https://cdn.jsdelivr.net/wp/plugins/project/tags/version/file

//加载确切的版本
https://cdn.jsdelivr.net/wp/plugins/wp-slimstat/tags/4.6.5/wp-slimstat.js

//加载最新版本
//您不应该在生产中使用它
https://cdn.jsdelivr.net/wp/plugins/wp-slimstat/trunk/wp-slimstat.js

//从WordPress.org主题SVN存储库中加载任何主题
https://cdn.jsdelivr.net/wp/themes/project/version/file

//加载确切的版本
https://cdn.jsdelivr.net/wp/themes/twenty-十八teen / 1.7 / assets / js / html5.js

//将“ .min”添加到任何JS / CSS文件以获取缩小版本
//如果不存在，我们会为您生成

以下使用github作为存储， jsDelivr 做 CDN 服务器

注：jsDeliver资源限制20M。

2、新建gitHub仓库（不是重点，自己新建）

※ 新建仓库，并将仓库 clone 至本地，上传相关资源文件，并提交推送到仓库。下图已圈重点※：

※ 进入 releases 进行手动打包，如下图：tu；后面讲使用 TravisCI 做自动更新

3、引用方式（圈域名重点）

※ 引用

// 过一会就可以访问测试了
## GitHub 方式
https://cdn.jsdelivr.net/gh/user/repo@version/file
https://cdn.jsdelivr.net/gh/github用户名/项目名@版本号/...
例如
https://cdn.jsdelivr.net/gh/cl9000/jsDelivr-Test@1.0/images/2.jpg

## NPM 方式
https://cdn.jsdelivr.net/npm/package@version/file

※ 文件浏览和流量统计
jsDelivr 提供了一个可以看 CDN 文件和使用流量的地址：https://cdn.jsdelivr.net/gh/cl9000/jsDelivr-Test ，如下图：（新创建的要等段时间才会有统计结果）。

演示DEMO

https://cdn.jsdelivr.net/gh/cl9000/jsDelivr-Test@1.0/
https://cdn.jsdelivr.net/gh/cl9000/jsDelivr-Test@1.0/images/2.jpg
https://cdn.jsdelivr.net/gh/cl9000/jsDelivr-Test@1.0/js/wenzi.js

jsDelivr参考

cl9000/jsDelivr-Test
http://www.jsdelivr.com/
https://yremp.live/jsdeliver/
https://chi.miantiao.me/make-a-cdn-by-github-jsdelivr-travisci/

持续集成 CI

CI Tools
CI
CI (Continuous Integration，持续集成)。
CI 软件监视仓库，可以在开发者发送提交后立刻执行自动测试、构建、部署。通过持续执行这样一个操作，提高效率，简化构建部署，一次配置…。
常见的CI有：　Travis CI 、 Jenkins 、Circle CI

Travis CI

介绍

Travis-CI是一个使用YAML格式配置用于持续集成完成自动化测试构建部署的开源项目

目前 Travis-CI 分：

http://travis-ci.org/ == Github公开项目 <本文讲这个>
http://travis-ci.com/ == Github私有付费项目（私有库）
官方文档地址：https://docs.travis-ci.com/

Travis 使用

Travis 注册登录 Travis CI 官网 travis-ci.org ，使用 GitHub 账号授权登录即可，登录之后，Travis 就会实时同步你 GitHub 账号的仓库，然后打开个人页面并给你想要构建的项目启用 Travis，Travis 会监听这个仓库的所有变化。如下图：

.travis.yml 配置文件

新建 .travis.yml 配置文件放到项目根目录下。 （Mac可以使用touch命令创建此文件，显示隐藏文件快捷键：command+shift+. ）
Travis 会根据 .travis.yml 里的内容进行构建，下面是个简单的构建并部署发布到 GitHub-releases 的配置。<使用 go（可使用其它语言），只是符合规则，必须设置一门语言>

notifications:  # 每次构建的时候是否邮件通知
  email: false

language: go # 指定项目语言
go: 1.10.x   # 指定语言版本

before_install: "echo before_install ==="
install: true # 跳过 install 阶段，因为已经定义了 before_install

before_script: "echo before_script ==="
script: "" # 执行脚本

before_deploy: "echo ready? - before_deploy ===="
after_deploy: "echo end! - after_deploy ====="

deploy:
  provider: releases # 部署到 GitHub Release，除此之外，Travis CI 还支持发布到 fir.im、AWS、Google App Engine 等
  api_key: ${GH_TOKEN} # 填写 GitHub 的 token （Settings -> Personal access tokens -> Generate new token）
  # api_key:
    # secure: "GuH73nqFGRjOLL8me8/upKFBaro8pDMYogvDhK3McMbCH3A4uW68Sx9BRHMXbF67VU0Zmd4rh2kS6zF2NodiLK9HQHydUD4s4l1vwGQ4Hi67zXH3XSPVhMTx3SKLrO7gDmKha9npd/6g8A0gQL9H+XAsqTvcNCVCAfkqOV58DxEFHEQZFlgQawDTwhi3LFacrN2RfjtSzAx0MNHFW/2FTH8QAdYqTHCw/H8HIYg1PsheMVVKwBXgWPO4fXDAo5r7nJT95FR2NsI8sm2smeVp+aQ3jf32TSOIxNppn4qYh6qT307EmOkO4WKHWOWfH/WEyqx65336v6ltw8hQiQXcKXv/iwp69Zyvjva8Lq1pXRiB38oVSVyRRvTByqEMj2pyXNCBufM106YsfhAuB2V+9JwPvW3JRR+9qi68WzkpDE7BaB6oyTBoj4Plu/qf3aIdR02dxt1E+nLrAB42tWWbCUIqhnhhZ4yArjYa3v6S+u+BREIBLyM1ZBa2MQ7D3UwtRCIYbVfI9aJq2IjWOV9Fo4si7l3/muSbmeCJ5alulLQNMLK6eN/GKTfKhok5ajVb3YuzcAf24VZPDsdFfTQ2SbKfY9uER0rvwi5OV0T+yVbJAeMkk5Pvt58au1m/psiPPlAqNMwHT/bb2OZyNPgV6e7wATLpPfN8r9wS07GFP0s="
    # secure: ${GH_TOKEN} # (Octokit::Unauthorized) 使用 Travis 对token进行的加密
  file: jsDelivr-Test.zip # 部署文件路径、文件名
  skip_cleanup: true  # 设置为 true 以跳过清理
  draft: true # 不发表drafs
  on:
    repo: cl9000/jsDelivr-Test
    tags: true # tags 设置为 true 表示只有在有 tag 的情况下才部署

env:
  global:
    # 将其添加到 Travis 的环境变量中
    # - GH_URL: github.com:cl9000/jsDelivr-Test.git

具体的配置详情可参阅官网文档：

· GitHub发布上传releases /GitHub Releases Uploading

· 官方模板 - GitHub发布上传releases - GitHub Releases Uploading

deploy:
  provider: releases
  api_key: "GITHUB OAUTH TOKEN"
  file: "FILE TO UPLOAD"
  skip_cleanup: true
  on:
    tags: true

加密构建中使用到的密码和toke

TODO: 待补充。。。。
自动化构建中需要用到密码和证书，必须保证的安全性。为此Travis CI为此提供了2种解决方案：

一种是对敏感信息、密码、证书、token等进行对称加密，在CI构建环境时解密；
一种是将密码等通过Travis CI的控制台（即网站）设置为构建时的环境变量；

创建 Github Personal Access Token

三方CI，无论是发布到GitHub，还是其它三方仓库，都需要验证身份的授权密钥，或账户密码。GitHub里用的就是Personal access tokens。
首先去GitHub 新建一个 Personal access tokens，具体的权限可按自己的需要设置，提交会生成一个token，先保存下来备用。

（Github Personal Access Token 创建后退出，无法再次查看；忘记了token就只有重新生成 token。）

生成了Github Personal Access Token后就将其应用到 .travis.yml中。

Travis 应用 Github Personal Access Token的两种方案

一、将 Token 直接设置为环境变量参数

进入 Travis 对应的项目页面，点击 More options 中的 settings 进入项目的设置环境；
在 Environment Variables 添加环境变量：例如 GH_TOKEN 变量名称，值为之前生成的Personal Access Token，并确保Display value in build log为FF状态。

然后在.travis.yml文件中使用该环境变量：

# 验证方式 - 生效
api_key: ${GH_TOKEN} 

# 验证方式 - 会报异常 待加密验证测试
# api_key:
#     secure: ${GH_TOKEN}

二、使用 Travis 提供的加密环境对其进行加密

官网 Encryption keys 参考链接

加密环境安装、ruby、gem

查询最新的Travis CI的版本： $ gem search travis
安装指定版本： $ gem install travis
测试安装完成： $ travis version，默认即可
查看环境： $ travis report --org

开始加密

首次运行，travis会提示需要登录，可以使用下命令登录：<2选1>
1. $ travis login --github-token <github-token>
2. travis login 输入Github用户名密码进行登录；
方式一：
本地项目目录执行 $ travis encrypt SOMEVAR="secretvalue" 或 $ travis encrypt SOMEVAR="secretvalue" --add 自动添加到配置文件
终端将输出一个类似于以下内容的字符串，如下。将其放置在 .travis.yml 文件中，

1	secure: ".... encrypted data ...."

1
2
3

env:
  global:
    secure: ".... encrypted data ...."

&&-1： 手动位置官网有说法：<env: - global: - secure: "... ..."> 参阅 - travis encrypt SOMEVAR=“secretvalue”

方式二：
<1> 本地项目目录执行命令：
の $ travis encrypt <github-token> -r <owner>/<project>
或 $ travis encrypt <github-token> -r <owner>/<project> --add Y 自动添加到配置文件
或 $ travis encrypt <github-token> --add Y 自动添加到配置文件
其中 -r 用于指定仓库。如下：

1
2
3

deploy:
    api_key:
        secure: ".... encrypted data ...."

1
2
3

env:
  global:
    secure: ".... encrypted data ...."

<2> 将环境变量参数一起加密：
本地项目目录执行命令：
$ travis encrypt GITHUB_TOKEN=<github-token> -r <owner>/<project>
加密环境变量： GITHUB_TOKEN 一同被加密，Travis解密之后得到 GITHUB_TOKEN=<ithub-token> 不仅仅是 github-token
对于加密环境变量 GITHUB_TOKEN 的形式，需这样使用：

deploy:
  api_key:
    secure: ${GITHUB_TOKEN}
# ... ...
env:
  global:
    secure: ".... encrypted data ...."

方式三：
较直接简单的方式，在本地项目目录直接执行下命令，按照提示输入即可自动生成配置：
$ travis setup releases

Travis 提供了多种加密方式，可以根据项目的级别设置，具体可以参阅Travis CI 官方文档；

Travis 提供了验证配置文件的规则性：
在线验证：http://lint.travis-ci.org/
本地验证：$ travis lint .travis.yml

主要的配置文件完成了，其它的就比较简单了

部署 deployment

Travis - deployment
Travis - GitHub Releases Uploading

部署到 GitHub Releases

这只说明部署到 GitHub Releases，发布版本，Tag时才发布releases

通常只会在发布版本时才发布 release 。可以通过下面这个设置可以只在Push Tag时，才触发deploy流程：

# ...
on:
  tags: true # 发布  tag版 时才进行发包   
  draft: false # 不发表drafs

发布流程

修改代码文件
git add . && git commit -m "first commit" && git push -u origin master   # 指定分支 <master分支>

git tag v2.0 -m "备注信息"
git push origin --tags

1
2
3

# 打 Tag 仍报错：Skipping a deployment with the xxx provider because this is not a tagged commit
git push --delete origin v2.0
git push origin v2.0

问题参阅

Skipping a deployment with the xxx provider because this is not a tagged commit - 解决方案
预后设置tagName https://docs.travis-ci.com/user/deployment/releases/#deploying-only-on-tagged-builds
(Octokit::Unauthorized) 使用 Travis 对token进行的加密方式有误

补充

git tag 常用命令

# 列出所有tag
$ git tag

# 新建一个tag在当前commit
$ git tag [tag]

# 新建一个tag在指定commit
$ git tag [tag] [commit]

# 删除本地tag
$ git tag -d [tag]

# 删除远程tag
$ git push origin :refs/tags/[tagName]

# 查看tag信息
$ git show [tag]

# 提交指定tag
$ git push [remote] [tag]

# 提交所有tag
$ git push [remote] --tags

# 新建一个分支，指向某个tag
$ git checkout -b [branch] [tag]

如何简单入门使用Travis-CI持续集成
 使用Travis-CI构建Android项目并自动打包部署到GitHub-Release
使用travis-ci自动部署github上的项目
 github 配置 travis 自动发布 release
使用travis自动上传github releases
使用 Github，jsDelivr， TravisCI 搭建一个轻量靠谱的 CDN
从Travis回GitHub
Github与Travis CI测试与部署
 Travis-CI持续构建生产实践
 基于Travis CI实现 Hexo 在 Github 和 Coding 的同步部署

赏

支付宝打赏

微信打赏

赞赏一下坚持原创技术分享，您的支持将鼓励我继续创作！

使用 Github，jsDelivr， TravisCI 搭建轻量 CDN

免费-快速-可靠 CDN

jsDelivr 官网

使用

1、使用方式 官网首页有各个平台的引用资源方式

#NPM

#GitHub

#WordPress

2、新建gitHub仓库（不是重点，自己新建）

3、引用方式（圈域名重点）

演示DEMO

jsDelivr参考

持续集成 CI

Travis CI

介绍

Travis 使用

.travis.yml 配置文件

· Travis 官网文档配置

· 部署方式 /deployment

· 加密密钥 /Encryption keys

· GitHub发布上传releases /GitHub Releases Uploading

· 官方模板 - GitHub发布上传releases - GitHub Releases Uploading

加密构建中使用到的密码和toke

创建 Github Personal Access Token

Travis 应用 Github Personal Access Token的两种方案

一、将 Token 直接设置为环境变量参数

二、使用 Travis 提供的加密环境对其进行加密

加密环境安装、ruby、gem

开始加密

部署 deployment

部署到 GitHub Releases

这只说明 部署到 GitHub Releases，发布版本，Tag时才发布releases

发布流程

问题参阅

补充

TravisCI 参考

· Travis CI 官网 travis-ci.org

· Travis 官网文档

· 部署方式 /deployment

· 加密密钥 /Encryption keys

· GitHub发布上传releases /GitHub Releases Uploading

FEATURED TAGS

FRIENDS

1、使用方式官网首页有各个平台的引用资源方式

这只说明部署到 GitHub Releases，发布版本，Tag时才发布releases