腾讯云 COS 对象存储服务提供静态网站服务
1
业务背景
笔者有一个简单的纯静态文档站点docs.ioiox.com,使用的是docsify项目的Markdown渲染程序,平时通过本地VSCode编辑文档,并提交到Github,早前是直接使用GitHub Pages绑定域名来访问,但由于网络问题,体验并不好。
2
解决方案
腾讯云COS对象存储服务能够提供静态网站服务,并可以配置CDN域名进行访问,那么就需要解决以下两个问题:
如何使GitHub自动同步文件到腾讯云COS;
腾讯云COS对应的CDN又是如何自动刷新;
解决方案:
GitHub Action-配置每次Push代码后自动上传到COS;
腾讯云SCF云函数-检测到COS内文件变动后自动刷新对应的CDN链接;
方案流程图:
3
获取腾讯云API密钥
登录腾讯云控制面板,访问管理中的访问密钥→API密钥管理→新建密钥,此密钥拥有所有权限,为保证安全,也可以添加子用户,配置COS、CDN对应的权限,如下图示
4
配置腾讯云COS
登录腾讯云对象存储控制面板,在存储桶列表中创建存储桶,选择适合的地域,设置权限为公有读私有写并获取存储桶相关信息,如下图示
5
配置GitHub Actions
在GitHub仓库中,Settings→Secrets,添加SecretId和SecretKey分别为刚才获取的腾讯云API密钥,如下图示
GitHub仓库→Actions,默认会有很多推荐的workflows,这里选择Set up a workflow yourself自己来配置。
系统会创建一个workflow的yml配置文件,删除预设代码,复制以下样本代码。图上标红两处需修改为刚才创建存储桶获取的名称和区域,然后右上角提交即可。
yml配置文件样本
name:UploadtoCOSon: [push]jobs:build: runs-on: ubuntu-lateststeps: -uses: actions/checkout@v1 -name:Installcoscmdrun: sudo pip install coscmd -name:Configurecoscmdenv:SECRET_ID: ${{ secrets.SecretId}}SECRET_KEY: ${{ secrets.SecretKey}}BUCKET: docs-1300533487REGION: ap-shanghairun: coscmd config -a $SECRET_ID -s $SECRET_KEY -b $BUCKET -r $REGION -name:Uploadrun: coscmd upload -rs --delete-f .// --ignore "./.git/*"
复制
6
测试GitHub Actions
提交yml后系统检测到main.yml的push,便会开始运行这个workflow,根据yml配置文件,可以看出整个工作流简单理解为安装了腾讯云的coscmd工具,并根据配置的SecretId SecretKey BUCKET REGION上传整个仓库到腾讯云COS,同时忽略掉git文件夹,其中upload-rs命令会使用md5比对存储桶中已存在的文件,相同文件将会跳过上传。
7
配置CDN域名
配置腾讯云CDN域名,登录腾讯云对象存储控制面板,进入创建的存储桶,在基础配置中开启静态网站。
域名管理,添加自定义加速域名,并设置域名指向生成的CNAME地址,源站类型改为静态网站源站。
在控制面板内容分发网络域名管理下,点击添加的域名选择高级配置。
开启HTTPS,设置强制跳转HTTPS,并更改跳转方式为301,再点击前往配置申请免费证书。
8
配置SCF云函数
登录腾讯云云函数控制面板,首次使用云函数可能会跳出服务授权框,需要前往访问添加并同意授权即可,该角色对本次添加的云函数没有影响。
选择和存储桶相同区域并新建,填写函数名,运行环境选择Php5.6,创建方式选择空白函数下一步。
函数配置,上部分保持默认即可,删除默认代码,复制以下样本代码至此。
图上标红两处需修改为之前获取的API密钥,注意此处的ID和KEY顺序和之前配置GitHub Actions时是相反的,并把CDN链接改为你的域名,如果域名已配置过HTTPS和证书,确保此处为https,完成即可。
函数代码样本,可以联系小编索取。
测试函数代码,确认API及CDN配置正确,点击测试,返回成功。
添加触发方式,此处需要分别添加全部创建和全部删除两个触发方式。
触发方式 : COS触发;
COS Bucket : 选择你的存储桶 (请再次确保存储桶和云函数的区域相同);
事件类型 : 全部创建和全部删除;
9
测试SCF云函数
腾讯云内容分发网络控制台,左侧刷新预热→操作记录→查询。
可以看到刚才测试成功的一条记录,现在可以尝试在Push代码到GitHub来完整的测试整个流程了。
上一篇: 使用腾讯云存储和 CDN 的实践经验摘要
下一篇: 腾讯云 cos 对象存储使用
推荐阅读
-
7 WordPress图像分离对象存储插件包含国内主流云服务存储提供商
-
腾讯云 COS 对象存储服务提供静态网站服务
-
项目上传至腾讯云html,UEditor实现单张图片上传至腾讯云(对象存储服务)功能(html5+canvas)...
-
腾讯视频直播 02-推流-美颜滤镜 同样,腾讯云提供了 setBeautyFilter 方法来设置美颜风格、磨皮程度、美白程度和泛红程度 //style 磨皮风格:0:平滑 1:自然 2:朦胧 //美容级别:0-9。值为 0 时关闭美颜效果。默认值:0,关闭美颜效果。 //美白级别:取值 0-9。值为 0 时,将关闭美白效果。默认值:0,关闭美白效果。 //ruddyLevel:取值范围为 0-9。值为 0 时关闭美白效果。默认值:0,关闭美白效果。 public boolean setBeautyFilter(int style, int beautyLevel, int whiteningLevel, int ruddyLevel);; public boolean setBeautyFilter(int style, int beautyLevel, int whiteningLevel, int ruddyLevel) 滤镜 setFilter 方法可以设置滤镜效果,滤镜本身是一个直方图文件。setSpecialRatio 方法可以设置滤镜的程度,从 0 到 1,越大滤镜效果越明显,默认值为 0.5。 Bitmap bitmap = BitmapUtils.decodeResource(getResources, R.drawable.langman); if (mLivePusher) if (mLivePusher ! = null) { mLivePusher.setFilter(bmp); } 控制摄像头 腾讯云 sdk 默认为前置摄像头(可以通过修改 TXLivePushConfig 的配置函数 setFrontCamera 来修改默认值),调用一次 switchCamera 就切换一次,注意切换摄像头前要确保 TXLivePushConfig 和 TXLivePusher 对象已经初始化。 mLivePushConfig.setFrontCamera(true); // 默认前置摄像头。 mLivePusher.switchCamera; //切换摄像头。 ⑦ 设置徽标水印 腾讯视频云目前支持两种设置水印的方式:一种是在流媒体 SDK 中设置水印,原理是在 SDK 中对视频进行编码前在画面中设置水印。另一种方式是在云端设置水印,即由云端解析视频并添加水印标识。 建议使用 SDK 添加水印,因为在云端添加水印会有问题。下面是添加水印的 SDK 介绍: //设置视频水印 mLivePushConfig.setWatermark(BitmapFactory.decodeResource(getResources,R.drawable.watermark), 10, 10); // 最后两个参数是视频的水印。 //最后两个参数是水印位置的 X 轴和 Y 轴坐标。 mLivePusher.setConfig(mLivePushConfig); 如果需要对水印图像的位置进行模型适配,则需要调用水印规范化接口。 /设置视频水印 mLivePushConfig.setWatermark(mBitmap, 0.02f, 0.05f, 0.2f); //参数为水印图像。 //参数包括水印图像的位图、水印位置的 X 轴坐标、水印位置的 Y 轴坐标和水印宽度。后三个参数的范围是 [0,1]。 // 最后两个参数是水印位置的 X 轴坐标和 Y 轴坐标。 mLivePusher.setConfig(mLivePushConfig); TXLivePushConfig 中的 setHardwareAcceleration 方法可以启用或禁用硬件编码。 if (mHWVideoEncode){ if (mLivePushConfig ! = null) { if (Build.VERSION.SDK_INT < 18){ Toast.makeText(getApplicationContext, "Hardware acceleration failed, current phone API level is too low (min 18)"、 Toast.LENGTH_SHORT).show; mHWVideoEncode = false; } } } } mLivePushConfig.setHardwareAcceleration(mHWVideoEncode ? TXLiveConstants.ENCODE_VIDEO_HARDWARE : TXLiveConstants.ENCODE_VIDEO_SOFTWARE); mLivePusher.setConfig(mLivePushConfig); // 如果您不确定何时启用硬件加速,建议将其设置为 ENCODE_VIDEO_AUTO。 // 默认情况下启用软件编码,但如果手机的 CPU 使用率超过 80% 或帧速率为 10,SDK 将自动切换到硬件编码。 ⑨ 后台推流 在常规模式下,一旦应用程序进入后台,摄像头捕捉数据的能力就会被 Android 禁用,这意味着 SDK 无法继续捕捉和编码音频和视频数据。如果我们什么都不做,故事就会按照下面的脚本发展: 阶段 1(背景剪切后 10 秒 ->)- CDN 无法将视频流传输给观众,因为没有数据,观众看到的是主帧。 阶段 2(10 秒-> 70 秒)--观众一方的播放器因无法接收到直播流而退出,房间里空无一人。 第 3 阶段(70 秒后)--服务器直接断开了推送流媒体的 RTMP 链接,主播需要重新打开直播才能继续。 主播可能只是短暂地接了一个紧急电话,但各云提供商的安全措施会迫使主播的直播提前结束。 1) 设置 setPauseFlag 在开始推流之前,使用 TXLivePushConfig 的 setPauseImg 接口设置一个等待图像,其含义建议为 "主播将暂时离开,稍后再回来"。
-
使用腾讯云对象存储 COS 构建个人网站
-
重新构思后的标题:腾讯云的COS与CDN服务:云存储与全球内容分发网络
-
使用腾讯云COS对象存储服务的方法指南
-
腾讯云挂载cos存储桶到轻量级服务器