hexo自动获取图片主色

缘由

不知道为什么,我在使用阿里云图片的时候,识别文章主色总是很慢,于是就觉得能不能生成文章的时候就直接确定主色,于是就有这个文件

代码

我的hexo souce文件是位于:

D:\blog\blogSourceCode\

这个新建文件是位于主题内这个目录下的:

D:\blog\blogSourceCode\themes\anzhiyu\scripts

文件名为 getTopImageColor.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
// 自动设置文章的 cover 和 main_color 两个字段
const fs = require("fs");
const path = require("path");
const axios = require("axios");
const yaml = require("js-yaml");
const https = require("https"); // Make sure to import this module
const { type } = require("os");

const POSTS_DIR = process.cwd() + "/source/_posts";
const RANDOM_IMG = "https://random-img.pupper.cn";

// Define httpsAgent right after your imports and before the function calls
const httpsAgent = new https.Agent({
rejectUnauthorized: false,
});

async function getCoverImage() {
try {
const response = await axios.get(RANDOM_IMG, {
maxRedirects: 0,
validateStatus: (status) => status === 302,
httpsAgent, // Use the agent here
});
return response.headers.location;
} catch (error) {
console.error("Error fetching cover image:", error);
}
}

async function getMainColor(url) {
try {
const urlSuffix = "?imageAve";
const aliyun = "aliyun";
//记得去添加自己常用文章图片的关键字,以及获取图片主色的方式
//我这个是由于我用的阿里云的,于是这样写的
if (url.includes(aliyun)) {
urlSuffix = "?x-oss-process=image/average-hue";
const response = await axios.get(`${url}` + urlSuffix);
return response.data.RGB;
}
const response = await axios.get(`${url}` + urlSuffix);
const mainColorData = response.data.RGB; // Access the RGB field
const mainColor = `#${mainColorData.slice(2)}`;
return mainColor;
} catch (error) {
console.error("Error fetching main color:", error);
}
}

function processFiles(dir) {
const files = fs.readdirSync(dir);

for (const file of files) {
const fullPath = path.join(dir, file);

if (fs.statSync(fullPath).isDirectory()) {
processFiles(fullPath);
} else if (path.extname(fullPath) === ".md") {
addCoverAndMainColor(fullPath);
}
}
}

function formatISO8601ToCustomFormat(isoDateString) {
// 检查输入是否已经是目标格式("yyyy-MM-dd HH:mm:ss")
if (/^\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}$/.test(isoDateString)) {
return -1; // 如果已经是目标格式,则直接返回
}
const date = new Date(isoDateString);

const year = date.getUTCFullYear();
const month = (date.getUTCMonth() + 1).toString().padStart(2, "0");
const day = date.getUTCDate().toString().padStart(2, "0");
const hours = date.getUTCHours().toString().padStart(2, "0");
const minutes = date.getUTCMinutes().toString().padStart(2, "0");
const seconds = date.getUTCSeconds().toString().padStart(2, "0");

return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}

async function addCoverAndMainColor(filePath) {
const content = fs.readFileSync(filePath, "utf8");
const yamlSection = content.match(/---\n([\s\S]*?)---/);

if (!yamlSection) return;

const data = yaml.load(yamlSection[1]);

let updated = false;

if (data.date) {
const _date = formatISO8601ToCustomFormat(data.date);
if (_date === -1) {
updated = false;
} else {
data.date = _date;
updated = true;
}
}

if (data.update) {
const _update = formatISO8601ToCustomFormat(data.update);
if (_update === -1) {
updated = false;
} else {
data.update = _update;
updated = true;
}
}

if (!data.cover) {
data.cover = await getCoverImage();
updated = true;
}

if (!data.main_color) {
data.main_color = await getMainColor(data.cover);
updated = true;
}

if (updated) {
const updatedYaml = yaml.dump(data);
const updatedContent = content.replace(yamlSection[1], updatedYaml);
fs.writeFileSync(filePath, updatedContent, "utf8");
console.log(`Updated: ${filePath}`);
}
}

processFiles(POSTS_DIR);

hexo.on("before_generate", async () => {
console.log("Automatically updating cover and main color...");
await processFiles(POSTS_DIR);
console.log("Cover and main color updated successfully!");
});

//在文件底部添加这段代码
hexo.on("before_generate", async () => {
console.log("Automatically updating cover and main color...");
await processFiles(POSTS_DIR);
console.log("Cover and main color updated successfully!");
});