Hexo博客0氪建站记录(下)

引言

  1. 我还没说过我域名是怎么来的

  2. 建站不知道多少天了,我的朋友圈竟然还长这样:
    外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传
    在看了清羽飞扬的Friend-Circle-Lite:轻量友链朋友圈之后,手痒了,决定搞一个。

  3. 还有,我还需要自建图床。于是使用Telegraph Image做了一个。之前用github搞过一个,可是听别人说,github禁止把仓库当图床,轻则删库,重则封号,仓库大于1GB就要人工审核,所以就用了这种方法。

使用cloudflare Pages部署Github Pages的网站(?)

实在无法理解,之前那个admibrill.github.io蛮好,但过了几天就无法访问了(?),但是我的一些朋友还能访问(?),为了让自己能够访问,我把github上的项目仓库在cf上又部署了一次。

首先,打开cloudflare,找到Workers和Pages然后进入,点击创建,创建一个部署。

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

选择仓库,等程序跑完就可以了。

友链朋友圈

这一部分参考清羽飞扬的博文,清羽的里面有很多碎碎念,我精简一点。

.json存储文件

这个文件用于记录朋友圈里会显示的友站。

我们的友链有很多,我们不能每次改了友链都要改这个json文件。于是清羽飞扬提供了生成.json文件的JavaScript:

[blogroot]新建文件link.js,写入如下内容:(感谢代码)

const YML = require('yamljs')
const fs = require('fs')

const blacklist = ["友站名称1", "友站名称2", "友站名称3"]; // 由于某种原因,不想订阅的列表

let friends = [],
    data_f = YML.parse(fs.readFileSync('source/_data/link.yml').toString().replace(/(?<=rss:)\s*\n/g, ' ""\n'));

data_f.forEach((entry, index) => {
    let lastIndex = 2;
    if (index < lastIndex) {
        const filteredLinkList = entry.link_list.filter(linkItem => !blacklist.includes(linkItem.name));
        friends = friends.concat(filteredLinkList);
    }
});

// 根据规定的格式构建 JSON 数据
const friendData = {
    friends: friends.map(item => {
        return [item.name, item.link, item.avatar];
    })
};

// 将 JSON 对象转换为字符串
const friendJSON = JSON.stringify(friendData, null, 2);

// 写入 friend.json 文件
fs.writeFileSync('./source/friend.json', friendJSON);
//在控制台提示
console.log('friend.json 文件已生成。');

然后我们每次更新博客,就得多加一条,保证没有友链漏掉:

node link.js;..... #...为其他指令

现在就更新一次,确保friend.json上传到了网站里!

后端部署

首先,前往清羽的仓库willow-god/Friend-Circle-Lite: 🐱一个精简版,无后端,且仅利用github action运行的精简版友链朋友圈程序,兼容fc的json格式信息,同时支持推送友圈更新,支持他人订阅个人站点并在更新时发送邮箱推送把仓库Fork复制到自己的账号下:

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

然后到自己的账号里的这个仓库,找到conf.yml

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

修改配置:

# 爬虫相关配置
# 解释:使用request实现友链文章爬取,并放置到根目录的all.json下
#   enable:             是否启用爬虫
#   json_url:           请填写对应格式json的地址,仅支持网络地址
#   article_count:      请填写每个博客需要获取的最大文章数量
#   marge_result:       是否合并多个json文件,若为true则会合并指定网络地址和本地地址的json文件
#     enable:           是否启用合并功能,该功能提供与自部署的友链合并功能,可以解决服务器部分国外网站无法访问的问题
#     marge_json_path:  请填写网络地址的json文件,用于合并,不带空格!!!
spider_settings:
  enable: true
  json_url: "https://admibrill1.pages.dev/friend.json" ########一定要改,不然是我的,改成"自己的网站/friend.json"
  article_count: 15
  merge_result:
    enable: false
    merge_json_url: "https://fc.liushen.fun"

# 邮箱推送功能配置,暂未实现,等待后续开发
# 解释:每天为指定邮箱推送所有友链文章的更新,仅能指定一个
#   enable:             是否启用邮箱推送功能
#   to_email:           收件人邮箱地址
#   subject:            邮件主题
#   body_template:      邮件正文的 HTML 模板文件
email_push:
  enable: false   ########### 我不需要,就没有启用
  to_email: recipient@example.com
  subject: "今天的 RSS 订阅更新"
  body_template: "rss_template.html"

# 邮箱issue订阅功能配置
# 解释:向在issue中提取的所有邮箱推送您网站中的更新,添加邮箱和删除邮箱均通过添加issue对应格式实现
#   enable:             是否启用邮箱推送功能
#   github_username:    GitHub 用户名,用于构建issue api地址
#   github_repo:        GitHub 仓库名,用于构建issue api地址
#   your_blog_url:      你的博客地址
rss_subscribe:
  enable:  false ############ 我不需要,就没有启用
  github_username: willow-god
  github_repo: Friend-Circle-Lite
  your_blog_url: https://admibrill1.pages.dev/
  email_template: "./rss_subscribe/email_template.html"

# SMTP 配置
# 解释:使用其中的相关配置实现上面两种功能,若无推送要求可以不配置,请将以上两个配置置为false
#   email:              发件人邮箱地址
#   server:            SMTP 服务器地址
#   port:              SMTP 端口号
#   use_tls:           是否使用 tls 加密
smtp:
  email: 3162475700@qq.com
  server: smtp.qq.com
  port: 587
  use_tls: true

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

第一次运行测试

按图示操作,运行workflow:

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

然后我们点开一条记录,查看Check RSS feeds

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

有这样的输出即为正常。

使用cloudflare托管后端

按照前面cloudflare部署的方法,部署一个后端地址。这个地址将会被我们当做后端。

前端部署

Blogroot/source/fcircle/index.md中添加如下内容(其实就是加html):

<div id="friend-circle-lite-root"></div>
<script>
    if (typeof UserConfig === 'undefined') {
        var UserConfig = {
            // 填写你的fc Lite地址
            private_api_url: 'https://fc.liushen.fun/',
            // 点击加载更多时,一次最多加载几篇文章,默认20
            page_turning_number: 20,
            // 头像加载失败时,默认头像地址
            error_img: 'https://pic.imgdb.cn/item/6695daa4d9c307b7e953ee3d.jpg',
        }
    }
</script>
<link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/willow-god/Friend-Circle-Lite/main/fclite.min.css">
<script src="https://fastly.jsdelivr.net/gh/willow-god/Friend-Circle-Lite/main/fclite.min.js"></script>

ok,朋友圈功能到此完成。

Telegraph Image图床

在写博客的时候,常常需要图片~~(比如说刚才那个部分就弄了n次图片)~~。

为了方便自己,自己建了个图床。

部署图床

首先还是fork仓库(不需要图了吧),cf-pages/Telegraph-Image: Image Hosting solution, Flickr/imgur alternative, make it easy for users to share their images. Using Cloudflare Pages and Telegraph. (github.com)

然后把把仓库部署的cloudflare上(不需要图了吧)。

使用PicGo方便Typora上传图片

然后下载安装PicGo,进入插件,安装插件telegraph-image-uploader

进入图床设置

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

设置URL为你的图床地址,就可以使用PicGo上传啦!

接着使用Markdown编辑器Typora:

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

现在截图复制粘贴到Typora里就可以上传了。

使用Python来删除Typora创建的临时图片文件

但是有个问题:我们粘进Typora的文件,会先放到C:\Users\<username>\AppData\Roaming\Typora\typora-user-images这个文件夹里,久而久之,文件会越来越多,Typora却不自己删除。于是我决定用Python来删除这些文件。

代码

在任意位置新建一个delete.py,写入如下代码:

# 导入库,放心,都是Python标准库,不用pip
import os
import time
# 编辑配置
username='乐乐'   #这是我电脑用户名,需要改成自己的
path='C:\\Users\\'+username+'\\AppData\\Roaming\\Typora\\typora-user-images\\'  #检查的目录
curlist={}  #存放需要处理的文件列表
checktime=5 #每次检查新文件和删除文件的间隔时间
deltime=50  #每个文件存在大于多少秒就要删除,足以等待图片上传完
# 启动
while True: 
    listd=os.listdir(path)
    for i in listd:
        if i in curlist.keys():
            if time.time()-curlist[i]>deltime:
                os.remove(path+i)
                curlist.pop(i)
                print('removed '+path+i)
        else:
            curlist[i]=time.time()
    time.sleep(checktime)![](https://source-admibrill.pages.dev/file/9383922c0c644b447d15a.png)

总结

到此hexo建站教程就完结了,886!

  • 27
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值