写在前面

侧边栏单向历小工具是本人在之前使用wordpress的argon主题的时候，在argon作者本人的博客发现的一款挺文艺风的小工具，关于在wordpress上利用反代获取图片的方案本人已经写过教程（详见单向历小工具的实现（反代） | 秦国识积 (ezcoder.top)）

添加组件教程

添加教程参考官方博客自定義側邊欄 | Butterfly

自定义html按照如下格式书写

1
<a href="https://cdn.jsdelivr.net/gh/Destiny12138/MyPic/tuchuang/cos_calendar.jpg" data-fancybox="gallery" data-caption="" data-thumb="https://cdn.jsdelivr.net/gh/Destiny12138/MyPic/tuchuang/cos_calendar.jpg"><img class="image ows-calendar" style="width: 100%;height: auto;" src="https://cdn.jsdelivr.net/gh/Destiny12138/MyPic/tuchuang/cos_calendar.jpg"></a>

http://img.owspace.com/Public/uploads/Download/2023/0115.jpg 是该图片的官方地址，但若直接写在代码里，无论如何都加载不出图片

本人在过去使用wordpress做博客时用的方法是使用nginx对该地址进行反代，然后通过自己的域名进行访问，但现在使用github+hexo方案，没有服务器来反代，故采用爬虫+flask的方法实现访问

ps：外层套的a标签是为了调用butterfly的图片放大功能，如果想使用请在配置文件里将图片放大方式改成gallery

  • 使用效果

    image-20230118215152172

实现方案一：利用爬虫获取图片二进制码并使用flask返回

使用vercel新建一个flask项目（地址Flask Hello World – Vercel），等待其创建好github仓库

进入GitHub仓库，会发现文件格式如下图所示

作者已经写好爬虫+flask返回的代码，访问Destiny12138/ows_calendar (github.com)查看

下载该仓库全部代码，将requirement.txt与/api/index.python两个文件修改为该仓库内的代码并保存，等待vercel自动部署

部署完成后用浏览器访问vercel提供的域名，即可看到图片，再把上面的自定义html的地址改为你的域名（若国内访问不了则需要自定义域名，教程网上很多）

实现方案二：爬虫并上传至图床（腾讯云对象存储）

注：这个方案不使用vercel，因为是国外的服务器并且每次访问都要爬取一次，所以速度慢一点，只不过用这个方法的话需要购买腾讯云的cos服务，不想花钱可以用上面的方案

代码也是现成的，访问Destiny12138/cos_calendar (github.com)查看并下载

  1. 自己创建一个新的github仓库，并且上传你下载的压缩包里的index.py文件

  2. 进入Action界面新建一个workflow，名称随意

image-20230118220320620

  1. 选择python模板（其实无所谓，我写好了workflow的配置文件）

    image-20230118220451437

  2. 打开下载的压缩包中的/.github/workflows/文件夹里的main.yml，将其中的内容复制到出现的编辑模板中并保存

    image-20230118220702832

  3. 打开setting里的secrets，添加action secrets，添加三个名称如下，内容根据你的腾讯云自己设置

image-20230118220811010

  1. 点开你创建的workflow，点右面的run，进行测试，查看是否报错

image-20230118220935746

  1. 成功执行的话即可每天自动爬取，图片自动存在腾讯云cos里，直接将上面的html里的链接换成你cos的图片链接即可，每天爬取的新图会自动覆盖旧的

结尾

  • github的时间使用的是UTC时间，和北京时间有8小时时差，所以在代码里获取当天日期的地方都是设定了时区，而workflow的定时任务是直接换算成了UTC时间，北京时间是每天凌晨自动执行

  • 在secrets中配置的环境变量在代码里使用os.environ读取，保护个人敏感信息

  • 代码所需的第三方依赖的安装卸载了main.yml里，github action的工作逻辑是上传你的代码到你指定系统的服务器上，再使用你指定版本的python，执行你指定的pip命令，然后执行

  • 其实能免费设置定时任务的地方还有华为云的函数服务，每月免费限额贼多，但是华为云函数没法在线下载依赖，需要自己打包上传，然而腾讯云的cos操作依赖需要的前置依赖还有点多，上传挺麻烦的（我上传过），如果觉得github麻烦可以去学习怎么配置（然而我觉得github配置更简单）

  • 这两种方案都是弹性工作制，运行需要排队，有时候甚至会比你指定的时间晚十多分钟到半小时，不过影响不大