-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
396 lines (338 loc) · 49.2 KB
/
index.html
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
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
<!DOCTYPE html><html lang="zh-CN" data-theme="light"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"><title>青衣墨客</title><meta name="keywords" content="青衣墨客,Web前端,学习记录,经验分享"><meta name="author" content="Tsing Yi"><meta name="copyright" content="Tsing Yi"><meta name="format-detection" content="telephone=no"><meta name="theme-color" content="#ffffff"><meta name="description" content="学习，记录，交流">
<meta property="og:type" content="website">
<meta property="og:title" content="青衣墨客">
<meta property="og:url" content="https://www.qingyi1220.cn/index.html">
<meta property="og:site_name" content="青衣墨客">
<meta property="og:description" content="学习，记录，交流">
<meta property="og:locale" content="zh_CN">
<meta property="og:image" content="https://www.qingyi1220.cn/img/Tsingyi.jpg">
<meta property="article:author" content="Tsing Yi">
<meta property="article:tag" content="青衣墨客,Web前端,学习记录,经验分享">
<meta name="twitter:card" content="summary">
<meta name="twitter:image" content="https://www.qingyi1220.cn/img/Tsingyi.jpg"><link rel="shortcut icon" href="/img/favicon.png"><link rel="canonical" href="https://www.qingyi1220.cn/"><link rel="preconnect" href="//cdn.jsdelivr.net"/><link rel="preconnect" href="//hm.baidu.com"/><link rel="preconnect" href="//busuanzi.ibruce.info"/><link rel="stylesheet" href="/css/index.css"><link rel="stylesheet" href="/pluginsSrc/@fortawesome/fontawesome-free/css/all.min.css" media="print" onload="this.media='all'"><link rel="stylesheet" href="/pluginsSrc/@fancyapps/ui/dist/fancybox.css" media="print" onload="this.media='all'"><script>var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?93adee852b8cb35b14a6ea01882e2f32";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script><script>const GLOBAL_CONFIG = {
root: '/',
algolia: undefined,
localSearch: {"path":"/search.xml","preload":false,"languages":{"hits_empty":"找不到您查询的内容：${query}"}},
translate: undefined,
noticeOutdate: undefined,
highlight: {"plugin":"highlighjs","highlightCopy":true,"highlightLang":true,"highlightHeightLimit":200},
copy: {
success: '复制成功',
error: '复制错误',
noSupport: '浏览器不支持'
},
relativeDate: {
homepage: false,
post: false
},
runtime: '天',
date_suffix: {
just: '刚刚',
min: '分钟前',
hour: '小时前',
day: '天前',
month: '个月前'
},
copyright: undefined,
lightbox: 'mediumZoom',
Snackbar: undefined,
source: {
justifiedGallery: {
js: '/pluginsSrc/flickr-justified-gallery/dist/fjGallery.min.js',
css: '/pluginsSrc/flickr-justified-gallery/dist/fjGallery.css'
}
},
isPhotoFigcaption: false,
islazyload: false,
isAnchor: false
}</script><script id="config-diff">var GLOBAL_CONFIG_SITE = {
title: '青衣墨客',
isPost: false,
isHome: true,
isHighlightShrink: false,
isToc: false,
postUpdate: '2024-06-28 17:06:31'
}</script><noscript><style type="text/css">
#nav {
opacity: 1
}
.justified-gallery img {
opacity: 1
}
#recent-posts time,
#post-meta time {
display: inline !important
}
</style></noscript><script>(win=>{
win.saveToLocal = {
set: function setWithExpiry(key, value, ttl) {
if (ttl === 0) return
const now = new Date()
const expiryDay = ttl * 86400000
const item = {
value: value,
expiry: now.getTime() + expiryDay,
}
localStorage.setItem(key, JSON.stringify(item))
},
get: function getWithExpiry(key) {
const itemStr = localStorage.getItem(key)
if (!itemStr) {
return undefined
}
const item = JSON.parse(itemStr)
const now = new Date()
if (now.getTime() > item.expiry) {
localStorage.removeItem(key)
return undefined
}
return item.value
}
}
win.getScript = url => new Promise((resolve, reject) => {
const script = document.createElement('script')
script.src = url
script.async = true
script.onerror = reject
script.onload = script.onreadystatechange = function() {
const loadState = this.readyState
if (loadState && loadState !== 'loaded' && loadState !== 'complete') return
script.onload = script.onreadystatechange = null
resolve()
}
document.head.appendChild(script)
})
win.activateDarkMode = function () {
document.documentElement.setAttribute('data-theme', 'dark')
if (document.querySelector('meta[name="theme-color"]') !== null) {
document.querySelector('meta[name="theme-color"]').setAttribute('content', '#0d0d0d')
}
}
win.activateLightMode = function () {
document.documentElement.setAttribute('data-theme', 'light')
if (document.querySelector('meta[name="theme-color"]') !== null) {
document.querySelector('meta[name="theme-color"]').setAttribute('content', '#ffffff')
}
}
const t = saveToLocal.get('theme')
if (t === 'dark') activateDarkMode()
else if (t === 'light') activateLightMode()
const asideStatus = saveToLocal.get('aside-status')
if (asideStatus !== undefined) {
if (asideStatus === 'hide') {
document.documentElement.classList.add('hide-aside')
} else {
document.documentElement.classList.remove('hide-aside')
}
}
const detectApple = () => {
if(/iPad|iPhone|iPod|Macintosh/.test(navigator.userAgent)){
document.documentElement.classList.add('apple')
}
}
detectApple()
})(window)</script><script src="/js/three.min.js"></script> <link rel="stylesheet" href="/css/font.css"> <link rel="stylesheet" href="/css/Aplayer.css" media="defer" onload="this.media='all'"> <link rel="stylesheet" href="/css/fengche.css"> <script data-pjax src="/js/echarts.js"></script> <script charset="UTF-8" id="LA_COLLECT" src="/js/js-sdk-pro.min.js"></script> <script>LA.init({id:"Jto0LsV751BCl1jG",ck:"Jto0LsV751BCl1jG"})</script><!-- hexo injector head_end start --><link rel="stylesheet" href="https://npm.elemecdn.com/hexo-filter-gitcalendar/lib/gitcalendar.css" media="print" onload="this.media='all'"><!-- hexo injector head_end end --><meta name="generator" content="Hexo 6.2.0"><link rel="alternate" href="/atom.xml" title="青衣墨客" type="application/atom+xml">
</head><body><div id="loading-box"><div class="centered"><div class="blob-1"></div><div class="blob-2"></div></div></div><div id="web_bg"></div><div id="sidebar"><div id="menu-mask"></div><div id="sidebar-menus"><div class="avatar-img is-center"><img src="/img/Tsingyi.jpg" onerror="onerror=null;src='/img/friend_404.gif'" alt="avatar"/></div><div class="sidebar-site-data site-data is-center"><a href="/archives/"><div class="headline">文章</div><div class="length-num">16</div></a><a href="/tags/"><div class="headline">标签</div><div class="length-num">9</div></a><a href="/categories/"><div class="headline">分类</div><div class="length-num">3</div></a></div><hr/><div class="menus_items"><div class="menus_item"><a class="site-page" href="/"><i class="fa-fw fas fa-home"></i><span> 首页</span></a></div><div class="menus_item"><a class="site-page" href="/archives/"><i class="fa-fw fas fa-archive"></i><span> 时间轴</span></a></div><div class="menus_item"><a class="site-page" href="/tags/"><i class="fa-fw fas fa-tags"></i><span> 标签</span></a></div><div class="menus_item"><a class="site-page" href="/categories/"><i class="fa-fw fas fa-folder-open"></i><span> 分类</span></a></div><div class="menus_item"><a class="site-page group" href="javascript:void(0);"><i class="fa-fw fa fa-heartbeat"></i><span> 清单</span><i class="fas fa-chevron-down"></i></a><ul class="menus_item_child"><li><a class="site-page child" href="/echarts/"><i class="fa-fw fas fa-chart-simple"></i><span> 博客统计</span></a></li><li><a class="site-page child" href="/music/"><i class="fa-fw fas fa-music"></i><span> 音乐</span></a></li><li><a class="site-page child" href="/gallery/"><i class="fa-fw fas fa-images"></i><span> 图库</span></a></li><li><a class="site-page child" href="/movies/"><i class="fa-fw fas fa-video"></i><span> 影视</span></a></li></ul></div><div class="menus_item"><a class="site-page" href="/link/"><i class="fa-fw fas fa-link"></i><span> 友链</span></a></div><div class="menus_item"><a class="site-page" href="/about/"><i class="fa-fw fas fa-heart"></i><span> 关于</span></a></div></div></div></div><div class="canvas-container" id="canvas"></div><div class="page" id="body-wrap"><header class="full_page" id="page-header"><nav id="nav"><span id="blog_name"><a id="site-name" href="/">青衣</a></span><div id="menus"><div id="search-button"><a class="site-page social-icon search"><i class="fas fa-search fa-fw"></i><span> 搜索</span></a></div><div class="menus_items"><div class="menus_item"><a class="site-page" href="/"><i class="fa-fw fas fa-home"></i><span> 首页</span></a></div><div class="menus_item"><a class="site-page" href="/archives/"><i class="fa-fw fas fa-archive"></i><span> 时间轴</span></a></div><div class="menus_item"><a class="site-page" href="/tags/"><i class="fa-fw fas fa-tags"></i><span> 标签</span></a></div><div class="menus_item"><a class="site-page" href="/categories/"><i class="fa-fw fas fa-folder-open"></i><span> 分类</span></a></div><div class="menus_item"><a class="site-page group" href="javascript:void(0);"><i class="fa-fw fa fa-heartbeat"></i><span> 清单</span><i class="fas fa-chevron-down"></i></a><ul class="menus_item_child"><li><a class="site-page child" href="/echarts/"><i class="fa-fw fas fa-chart-simple"></i><span> 博客统计</span></a></li><li><a class="site-page child" href="/music/"><i class="fa-fw fas fa-music"></i><span> 音乐</span></a></li><li><a class="site-page child" href="/gallery/"><i class="fa-fw fas fa-images"></i><span> 图库</span></a></li><li><a class="site-page child" href="/movies/"><i class="fa-fw fas fa-video"></i><span> 影视</span></a></li></ul></div><div class="menus_item"><a class="site-page" href="/link/"><i class="fa-fw fas fa-link"></i><span> 友链</span></a></div><div class="menus_item"><a class="site-page" href="/about/"><i class="fa-fw fas fa-heart"></i><span> 关于</span></a></div></div><div id="toggle-menu"><a class="site-page"><i class="fas fa-bars fa-fw"></i></a></div></div></nav><div id="site-info"><h1 id="site-title">青衣墨客</h1><div id="site-subtitle"><span id="subtitle"></span></div><div id="site_social_icons"><a class="social-icon" href="https://res.abeim.cn/api-qq?qq=987549601" target="_blank" title="QQ"><i class="fa-brands fa-qq"></i></a><a class="social-icon" href="https://github.com/TsingYi1263" target="_blank" title="Github"><i class="fab fa-github"></i></a><a class="social-icon" href="/./atom.xml" target="_blank" title=""><i class="fas fa-rss"></i></a></div></div><div id="scroll-down"><i class="fas fa-angle-down scroll-down-effects"></i></div></header><main class="layout" id="content-inner"><div class="recent-posts" id="recent-posts"><div class="recent-post-item"><div class="post_cover left"><a href="/posts/28885.html" title="手写Promise"><img class="post_bg" src="https://bu.dusays.com/2022/12/04/638c96d8be84f.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="手写Promise"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/28885.html" title="手写Promise">手写Promise</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2023-03-14T16:00:00.000Z" title="发表于 2023-03-15 00:00:00">2023-03-15</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/Web%E5%89%8D%E7%AB%AF/">Web前端</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/28885.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content">/** * @description MyPromise * @author TsingYi */class MyPromise { state = 'pending' //状态，'pending', fulfilled','rejected' value = undefined //成功后的值 reason = undefined //失败后的原因 resolveCallbacks = [] //pending状态下，储存成功的回调 rejectCallbacks = [] //pending状态下，储存失败的回调 constructor(fn) { const resolveHandler = (value) => { this.state = this.state === 'pending' ? 'fulfilled' : this.state this.value = value t ...</div></div></div><div class="recent-post-item"><div class="post_cover right"><a href="/posts/25593.html" title="Vue中hash路由和history路由原理及优缺点"><img class="post_bg" src="https://bu.dusays.com/2022/11/23/637dd6b33a964.jpg" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="Vue中hash路由和history路由原理及优缺点"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/25593.html" title="Vue中hash路由和history路由原理及优缺点">Vue中hash路由和history路由原理及优缺点</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2023-02-13T16:00:00.000Z" title="发表于 2023-02-14 00:00:00">2023-02-14</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/Web%E5%89%8D%E7%AB%AF/">Web前端</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/25593.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content">hash模式:
原理: 在 url 中的 # 之后对应的是 hash 值, 其原理是通过window.onhashChange() 事件监听hash值的变化, 根据路由表对应的hash值来判断加载对应的路由加载对应的组件
优点:(1) 只需要前端配置路由表, 不需要后端的参与(2) 兼容性好, 浏览器都能支持(3) hash值改变不会向后端发送请求, 完全属于前端路由
缺点:(1) hash值前面需要加#, 不符合url规范,也不美观
history模式:
原理: 利用H5新增的history.pushState()和window.onpopstate()以及history.replaceState()方法监听和改变url
优点:(1) 符合url地址规范, 不需要#, 使用起来比较美观
缺点:(1) 在用户手动输入地址或刷新页面时会发起url请求, 后端需要配置index.html页面用户匹配不到静态资源的情况, 否则会出现404错误(2) 兼容性比较差, 是利用了 HTML5 History对象中新增的 pushState() 和 replaceState() 方法,需要特定浏览 ...</div></div></div><div class="recent-post-item"><div class="post_cover left"><a href="/posts/3918.html" title="手写bind,apply,call"><img class="post_bg" src="https://bu.dusays.com/2022/12/04/638c96d8b3db7.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="手写bind,apply,call"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/3918.html" title="手写bind,apply,call">手写bind,apply,call</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2023-02-12T16:00:00.000Z" title="发表于 2023-02-13 00:00:00">2023-02-13</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/Web%E5%89%8D%E7%AB%AF/">Web前端</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/3918.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content">手写bind,apply,call
apply,call,bind都是js给函数内置的一些api,调用他们可以为函数指定this的执行,同时也可以传参.
使用方式//callfun.call(thisArg, arg1, arg2, ...)//apply func.apply(thisArg, [argsArray])//bindconst newFun = fun.bind(thisArg, arg1, arg2, ...)newFun()
apply和call就是传参不一样,但是两个都是会在调用的时候同时执行调用的函数,但是bind则会返回一个绑定了this的函数.
我们还需要知道一个事情,就是this的指向.
this的指向this的指向是在函数调用的时候确定下来的,this的指向大致可以分为五种.
1. 默认绑定默认绑定一般发生在回调函数,函数直接调用
function test() { //严格模式下是undefined //非严格模式下是window console.log(this)}setTimeout(function () ...</div></div></div><div class="recent-post-item"><div class="post_cover right"><a href="/posts/16918.html" title="CDN入门配置"><img class="post_bg" src="https://bu.dusays.com/2022/11/23/637dd7a0d042b.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="CDN入门配置"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/16918.html" title="CDN入门配置">CDN入门配置</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2022-12-02T16:00:00.000Z" title="发表于 2022-12-03 00:00:00">2022-12-03</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/%E7%BD%91%E7%BB%9C%E6%8A%80%E6%9C%AF/">网络技术</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/16918.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content">CDN配置原理：在第一次使用CDN服务时，往往会遇到一些问题，比如不知道回源HOST是干什么的，该不该配置？HOST 在计算机网络是主机、服务机的意思。顾明思议，回源HOST也就是客户访问CDN节点时，如果节点没有缓存这个资源，要在指定的主机寻找客户想要的目标资源。
源站和回源HOST的区别：
源站：源站决定了回源时请求到的具体IP地址。
回源HOST：回源HOST决定了回源请求访问到该IP地址上的具体站点。
举个例子：您要去某单位找张三办事，如果告诉您某单位在 XX路XX号，这就相当于源站。到单位后您需要找张三，就还需要知道张三的房间号，XX楼XX层XX号办公室，这就相当于回源HOST。
不需要设置回源HOST的应用场景以下两种应用场景下，可以不设置回源HOST，或者设置回源HOST为加速域名。
在您源站地址是加速域名服务器IP的情况下，您的回源HOST类型应为加速域名。
在您源站地址是OSS域名的情况下，您的回源HOST类型应为源站域名。
需要设置回源HOST的应用场景当您的服务器有多个站点，需要回源的站点不是加速域名对应的站点时，设置回源HOST。设置回源HOST要明白以 ...</div></div></div><div class="recent-post-item"><div class="post_cover left"><a href="/posts/61132.html" title="hexo小标题旋转风车"><img class="post_bg" src="https://bu.dusays.com/2022/11/23/637dd7a0d0cec.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="hexo小标题旋转风车"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/61132.html" title="hexo小标题旋转风车">hexo小标题旋转风车</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2022-11-29T16:00:00.000Z" title="发表于 2022-11-30 00:00:00">2022-11-30</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/Hexo/">Hexo</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/61132.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content">前言如果不喜欢Butterfly主题自带的曲别针图标，可以换一种风格。（比如我现在使用的旋转风车）
操作打开主题配置文件_config.butterfly.yml
把beautify的title-prefix-icon选项设置为'\f863'
（如果没有开启图标功能则需要将enable设置为true）
beautify: enable: true title-prefix-icon: '\f863'
在inject的head引入:
inject: head: <style>#article-container.post-content h1: before, h2: before, h3: before, h4: before, h5: before, h6: before { -webkit-animation: avatar_turn_around 1s linear infinite; -moz-animation: avatar_turn_around 1s linear infinite; -o-animati ...</div></div></div><div class="recent-post-item"><div class="post_cover right"><a href="/posts/61402.html" title="gulp压缩博客资源"><img class="post_bg" src="https://bu.dusays.com/2022/11/23/637dd7a0ba8c3.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="gulp压缩博客资源"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/61402.html" title="gulp压缩博客资源">gulp压缩博客资源</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2022-11-27T16:00:00.000Z" title="发表于 2022-11-28 00:00:00">2022-11-28</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/Hexo/">Hexo</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/61402.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content">前言gulp 能够帮助用户自动压缩静态资源，配合各类下属插件，能够压缩包括 css、js、html 乃至各类格式的图片文件。（图片文件的压缩往往只能节省几十 KB，效果远远不如 imagine、tinypng 等压缩方式，所以此处不再写使用 gulp 压缩图片的内容）。
如果需要压缩图片的话推荐使用图片在线压缩工具，将图像转换为WebP格式。WebP这是支持在互联网上无损和有损图像质量压缩的新格式。谷歌公司开发这种格式专为在网上迅速和方便地做好工作。其主要优点是，相对于其他图像格式，文件小，但图像质量相似。
配置教程
安装 Gulp 插件：在博客根目录 [Blogroot] 打开终端，输入：
npm install gulp #安装gulp插件
安装各个下属插件以实现对各类静态资源的压缩。
压缩 HTML：
npm install gulp-htmlclean # 清理htmlnpm install gulp-htmlmin # 压缩html
压缩 CSS：
npm install gulp-minify-css # 压缩css
压缩JS
npm install gulp ...</div></div></div><div class="recent-post-item"><div class="post_cover left"><a href="/posts/12492.html" title="vue引入网络图片跨域问题"><img class="post_bg" src="https://bu.dusays.com/2022/12/04/638c9aea5952b.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="vue引入网络图片跨域问题"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/12492.html" title="vue引入网络图片跨域问题">vue引入网络图片跨域问题</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2022-11-27T16:00:00.000Z" title="发表于 2022-11-28 00:00:00">2022-11-28</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/Web%E5%89%8D%E7%AB%AF/">Web前端</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/12492.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content">vue请求网络接口中图片报错403解决办法造成原因：网络接口都是有请求限制的，特别是图片字段值是绝对路径的情况，请求的时候就会报错403 forbidden。
解决办法：方法一：这个时候应该使用缓存的方式拿到请求图片的地址进行缓存，只要在请求到的图片链接前面加上https://images.weserv.nl/?url=即可（这是一个专门缓存图片的网址）
getImages( _url ){ if( _url !== undefined ){ let _u = _url.substring( 7 ); return 'https://images.weserv.nl/?url=' + _u; } }123456
_u：提取http://后面的部分_url：是请求接口后返回的图片字段
方法二：在index.html 中增加一个meta标签，不发送HTTP Referer首部
<meta name="referrer" conten ...</div></div></div><div class="recent-post-item"><div class="post_cover right"><a href="/posts/5063.html" title="Node.js"><img class="post_bg" src="https://bu.dusays.com/2022/12/04/638c9aea5a2f8.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="Node.js"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/5063.html" title="Node.js">Node.js</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2022-11-24T16:00:00.000Z" title="发表于 2022-11-25 00:00:00">2022-11-25</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/Web%E5%89%8D%E7%AB%AF/">Web前端</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/5063.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content">文章转载自 Kerwin，如有侵权，请联系作者，本站仅当学习使用。
一、Node.js基础1. 认识Node.js
Node.js是一个javascript运行环境。它让javascript可以开发后端程序，实现几乎其他后端语言实现的所有功能，可以与PHP、Java、Python、.NET、Ruby等后端语言平起平坐。
Nodejs是基于V8引擎，V8是Google发布的开源JavaScript引擎，本身就是用于Chrome浏览器的js解释部分，但是Ryan Dahl 这哥们，鬼才般的，把这个V8搬到了服务器上，用于做服务器的软件。
01 nodejs的特性
Nodejs语法完全是js语法，只要你懂js基础就可以学会Nodejs后端开发
NodeJs超强的高并发能力,实现高性能服务器
开发周期短、开发成本低、学习成本低
02 浏览器环境vs node环境
Node.js 可以解析JS代码（没有浏览器安全级别的限制）提供很多系统级别的API，如：
文件的读写 (File System)
const fs = require('fs')fs.readFile(& ...</div></div></div><div class="recent-post-item"><div class="post_cover left"><a href="/posts/22565.html" title="hexo图片引入"><img class="post_bg" src="https://bu.dusays.com/2022/11/23/637dc831b4070.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="hexo图片引入"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/22565.html" title="hexo图片引入">hexo图片引入</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2022-11-11T16:00:00.000Z" title="发表于 2022-11-12 00:00:00">2022-11-12</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/Hexo/">Hexo</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/22565.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content"> source 文件夹中除了文章以外还可能需要引入其它文件，例如图片、CSS、JS 文件等。如果Hexo项目中只有少量图片，那最简单的方法就是将它们放在 source/images 文件夹中。然后通过类似于  的方法访问它们。
如果需要更有规律地提供图片和其他资源以及想要将资源分布在各个文章上，可以通过将 config.yml 文件中的 post_asset_folder 选项设为 true 来打开。
_config.ymlpost_asset_folder: truemarked: prependRoot: true postAsset: true
安装插件hexo图片管理插件：npm i hexo-asset-image
启用后，资源图片将会被自动解析为其对应文章的路径。例如： image.jpg 位置为 /2022/09/01/Hello world/image.jpg ，这表示它是 /2022/09/01/Hello world/ 文章的一张资源图片，  将会被解析为 <img src=&quo ...</div></div></div><div class="recent-post-item"><div class="post_cover right"><a href="/posts/49461.html" title="hexo提交报错"><img class="post_bg" src="https://bu.dusays.com/2022/11/23/637dc8317fa75.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="hexo提交报错"></a></div><div class="recent-post-info"><a class="article-title" href="/posts/49461.html" title="hexo提交报错">hexo提交报错</a><div class="article-meta-wrap"><span class="post-meta-date"><i class="far fa-calendar-alt"></i><span class="article-meta-label">发表于</span><time datetime="2022-11-10T16:00:00.000Z" title="发表于 2022-11-11 00:00:00">2022-11-11</time></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-inbox"></i><a class="article-meta__categories" href="/categories/Hexo/">Hexo</a></span><span class="article-meta"><span class="article-meta-separator">|</span><i class="fas fa-comments"></i><a class="twikoo-count" href="/posts/49461.html#post-comment"><i class="fa-solid fa-spinner fa-spin"></i></a><span class="article-meta-label"> 条评论</span></span></div><div class="content">解决hexo报错spwan failedFATAL Something's wrong. Maybe you can find the solution here: https://hexo.io/docs/troubleshooting.htmlError: Spawn failed at ChildProcess.<anonymous> (D:\Blog\node_modules\hexo-util\lib\spawn.js:51:21) at ChildProcess.emit (node:events:527:28) at ChildProcess.cp.emit (D:\Blog\node_modules\cross-spawn\lib\enoent.js:34:29) at Process.ChildProcess._handle.onexit (node:internal/child_process:291:12)
解决方案
进行以下处理
##进入博客根目录(以我的为例)cd D:\Blog##删除git提交文件夹rm - ...</div></div></div><nav id="pagination"><div class="pagination"><span class="page-number current">1</span><a class="page-number" href="/page/2/#content-inner">2</a><a class="extend next" rel="next" href="/page/2/#content-inner"><i class="fas fa-chevron-right fa-fw"></i></a></div></nav></div><div class="aside-content" id="aside-content"><div class="card-widget card-info"><div class="is-center"><div class="avatar-img"><img src="/img/Tsingyi.jpg" onerror="this.onerror=null;this.src='/img/friend_404.gif'" alt="avatar"/></div><div class="author-info__name">Tsing Yi</div><div class="author-info__description">学习，记录，交流</div></div><div class="card-info-data site-data is-center"><a href="/archives/"><div class="headline">文章</div><div class="length-num">16</div></a><a href="/tags/"><div class="headline">标签</div><div class="length-num">9</div></a><a href="/categories/"><div class="headline">分类</div><div class="length-num">3</div></a></div><a id="card-info-btn" target="_blank" rel="noopener" href="https://github.com/TsingYi1263/TsingYi1263.github.io"><i class="fab fa-github"></i><span>Follow Me</span></a><div class="card-info-social-icons is-center"><a class="social-icon" href="https://res.abeim.cn/api-qq?qq=987549601" target="_blank" title="QQ"><i class="fa-brands fa-qq"></i></a><a class="social-icon" href="https://github.com/TsingYi1263" target="_blank" title="Github"><i class="fab fa-github"></i></a><a class="social-icon" href="/./atom.xml" target="_blank" title=""><i class="fas fa-rss"></i></a></div></div><div class="card-widget card-announcement"><div class="item-headline"><i class="fas fa-bullhorn fa-shake"></i><span>公告</span></div><div class="announcement_content">好好学习，天天向上</div></div><div class="sticky_layout"><div class="card-widget card-recent-post"><div class="item-headline"><i class="fas fa-history"></i><span>最新文章</span></div><div class="aside-list"><div class="aside-list-item"><a class="thumbnail" href="/posts/28885.html" title="手写Promise"><img src="https://bu.dusays.com/2022/12/04/638c96d8be84f.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="手写Promise"/></a><div class="content"><a class="title" href="/posts/28885.html" title="手写Promise">手写Promise</a><time datetime="2023-03-14T16:00:00.000Z" title="发表于 2023-03-15 00:00:00">2023-03-15</time></div></div><div class="aside-list-item"><a class="thumbnail" href="/posts/25593.html" title="Vue中hash路由和history路由原理及优缺点"><img src="https://bu.dusays.com/2022/11/23/637dd6b33a964.jpg" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="Vue中hash路由和history路由原理及优缺点"/></a><div class="content"><a class="title" href="/posts/25593.html" title="Vue中hash路由和history路由原理及优缺点">Vue中hash路由和history路由原理及优缺点</a><time datetime="2023-02-13T16:00:00.000Z" title="发表于 2023-02-14 00:00:00">2023-02-14</time></div></div><div class="aside-list-item"><a class="thumbnail" href="/posts/3918.html" title="手写bind,apply,call"><img src="https://bu.dusays.com/2022/12/04/638c96d8b3db7.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="手写bind,apply,call"/></a><div class="content"><a class="title" href="/posts/3918.html" title="手写bind,apply,call">手写bind,apply,call</a><time datetime="2023-02-12T16:00:00.000Z" title="发表于 2023-02-13 00:00:00">2023-02-13</time></div></div><div class="aside-list-item"><a class="thumbnail" href="/posts/16918.html" title="CDN入门配置"><img src="https://bu.dusays.com/2022/11/23/637dd7a0d042b.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="CDN入门配置"/></a><div class="content"><a class="title" href="/posts/16918.html" title="CDN入门配置">CDN入门配置</a><time datetime="2022-12-02T16:00:00.000Z" title="发表于 2022-12-03 00:00:00">2022-12-03</time></div></div><div class="aside-list-item"><a class="thumbnail" href="/posts/61132.html" title="hexo小标题旋转风车"><img src="https://bu.dusays.com/2022/11/23/637dd7a0d0cec.webp" onerror="this.onerror=null;this.src='/img/404.jpg'" alt="hexo小标题旋转风车"/></a><div class="content"><a class="title" href="/posts/61132.html" title="hexo小标题旋转风车">hexo小标题旋转风车</a><time datetime="2022-11-29T16:00:00.000Z" title="发表于 2022-11-30 00:00:00">2022-11-30</time></div></div></div></div><div class="card-widget card-categories"><div class="item-headline">
<i class="fas fa-folder-open"></i>
<span>分类</span>
</div>
<ul class="card-category-list" id="aside-cat-list">
<li class="card-category-list-item "><a class="card-category-list-link" href="/categories/Hexo/"><span class="card-category-list-name">Hexo</span><span class="card-category-list-count">5</span></a></li><li class="card-category-list-item "><a class="card-category-list-link" href="/categories/Web%E5%89%8D%E7%AB%AF/"><span class="card-category-list-name">Web前端</span><span class="card-category-list-count">10</span></a></li><li class="card-category-list-item "><a class="card-category-list-link" href="/categories/%E7%BD%91%E7%BB%9C%E6%8A%80%E6%9C%AF/"><span class="card-category-list-name">网络技术</span><span class="card-category-list-count">1</span></a></li>
</ul></div><div class="card-widget card-tags"><div class="item-headline"><i class="fas fa-tags"></i><span>标签</span></div><div class="card-tag-cloud"><a href="/tags/CDN/" style="font-size: 1.15em; color: rgb(131, 171, 163)">CDN</a><a href="/tags/Nodejs/" style="font-size: 1.15em; color: rgb(41, 68, 102)">Nodejs</a><a href="/tags/Vue/" style="font-size: 1.35em; color: rgb(125, 30, 115)">Vue</a><a href="/tags/Vue-router/" style="font-size: 1.25em; color: rgb(175, 20, 19)">Vue-router</a><a href="/tags/Hexo%E4%BC%98%E5%8C%96/" style="font-size: 1.35em; color: rgb(125, 174, 162)">Hexo优化</a><a href="/tags/Butterfly%E7%BE%8E%E5%8C%96/" style="font-size: 1.25em; color: rgb(25, 168, 180)">Butterfly美化</a><a href="/tags/Git/" style="font-size: 1.15em; color: rgb(69, 158, 63)">Git</a><a href="/tags/JavaScript/" style="font-size: 1.45em; color: rgb(83, 40, 126)">JavaScript</a><a href="/tags/%E5%91%BD%E5%90%8D%E8%A7%84%E8%8C%83/" style="font-size: 1.15em; color: rgb(151, 82, 166)">命名规范</a></div></div><div class="card-widget card-archives"><div class="item-headline"><i class="fas fa-archive"></i><span>归档</span></div><ul class="card-archive-list"><li class="card-archive-list-item"><a class="card-archive-list-link" href="/archives/2023/03/"><span class="card-archive-list-date">三月 2023</span><span class="card-archive-list-count">1</span></a></li><li class="card-archive-list-item"><a class="card-archive-list-link" href="/archives/2023/02/"><span class="card-archive-list-date">二月 2023</span><span class="card-archive-list-count">2</span></a></li><li class="card-archive-list-item"><a class="card-archive-list-link" href="/archives/2022/12/"><span class="card-archive-list-date">十二月 2022</span><span class="card-archive-list-count">1</span></a></li><li class="card-archive-list-item"><a class="card-archive-list-link" href="/archives/2022/11/"><span class="card-archive-list-date">十一月 2022</span><span class="card-archive-list-count">6</span></a></li><li class="card-archive-list-item"><a class="card-archive-list-link" href="/archives/2022/10/"><span class="card-archive-list-date">十月 2022</span><span class="card-archive-list-count">1</span></a></li><li class="card-archive-list-item"><a class="card-archive-list-link" href="/archives/2022/09/"><span class="card-archive-list-date">九月 2022</span><span class="card-archive-list-count">5</span></a></li></ul></div><div class="card-widget card-webinfo"><div class="item-headline"><i class="fas fa-chart-line"></i><span>网站资讯</span></div><div class="webinfo"><div class="webinfo-item"><div class="item-name">文章数目 :</div><div class="item-count">16</div></div><div class="webinfo-item"><div class="item-name">已运行时间 :</div><div class="item-count" id="runtimeshow" data-publishDate="2022-08-31T16:00:00.000Z"><i class="fa-solid fa-spinner fa-spin"></i></div></div><div class="webinfo-item"><div class="item-name">本站总字数 :</div><div class="item-count">24.7k</div></div><div class="webinfo-item"><div class="item-name">本站访客数 :</div><div class="item-count" id="busuanzi_value_site_uv"><i class="fa-solid fa-spinner fa-spin"></i></div></div><div class="webinfo-item"><div class="item-name">本站总访问量 :</div><div class="item-count" id="busuanzi_value_site_pv"><i class="fa-solid fa-spinner fa-spin"></i></div></div><div class="webinfo-item"><div class="item-name">最后更新时间 :</div><div class="item-count" id="last-push-date" data-lastPushDate="2024-06-28T09:06:31.550Z"><i class="fa-solid fa-spinner fa-spin"></i></div></div></div></div></div></div></main><footer id="footer"><div id="footer-wrap"><div class="copyright">©2020 - 2024 By Tsing Yi</div><div class="footer_custom_text"><p style="margin: 10px 0 5px"><a target="_blank"rel="noopener"href="https://hexo.io/"style="margin-inline: 5px"><img src="/img/Hexo.svg"data-lazy-src="/img/Hexo.svg"alt="博客框架 Hexo"data-ll-status="loaded"class="entered loaded"/></a ><a target="_blank"rel="noopener"href="https://butterfly.js.org/"style="margin-inline: 5px"><img src="/img/Butterfly.svg"data-lazy-src="/img/Butterfly.svg"alt="主题 Butterfly"data-ll-status="loaded"class="entered loaded"/></a ><a target="_blank"rel="noopener"href="https://github.com/"style="margin-inline: 5px"><img src="/img/Github.svg"data-lazy-src="/img/Github.svg"alt="本站托管于 Github"data-ll-status="loaded"class="entered loaded"/></a></p><a target="_blank"rel="noopener"href="https://beian.miit.gov.cn/"><img src="/img/ICP.png"data-lazy-src="/img/ICP.png"alt="备案号：皖ICP备2022016747号-1"style="vertical-align: text-top; margin-right: 5px"data-ll-status="loaded"class="entered loaded"/>备案号：皖ICP备2022016747号-1</a></div></div></footer></div><div id="rightside"><div id="rightside-config-hide"><button id="darkmode" type="button" title="浅色和深色模式转换"><i class="fas fa-adjust"></i></button><button id="hide-aside-btn" type="button" title="单栏和双栏切换"><i class="fas fa-arrows-alt-h"></i></button></div><div id="rightside-config-show"><button id="rightside_config" type="button" title="设置"><i class="fas fa-cog fa-spin"></i></button><button id="go-up" type="button" title="回到顶部"><i class="fas fa-arrow-up"></i></button></div></div><div id="local-search"><div class="search-dialog"><nav class="search-nav"><span class="search-dialog-title">搜索</span><span id="loading-status"></span><button class="search-close-button"><i class="fas fa-times"></i></button></nav><div class="is-center" id="loading-database"><i class="fas fa-spinner fa-pulse"></i><span> 数据库加载中</span></div><div class="search-wrap"><div id="local-search-input"><div class="local-search-box"><input class="local-search-box--input" placeholder="搜索文章" type="text"/></div></div><hr/><div id="local-search-results"></div></div></div><div id="search-mask"></div></div><div><script src="/js/utils.js"></script><script src="/js/main.js"></script><script src="/pluginsSrc/medium-zoom/dist/medium-zoom.min.js"></script><script src="/js/search/local-search.js"></script><script async="async">var preloader = {
endLoading: () => {
document.body.style.overflow = 'auto';
document.getElementById('loading-box').style = 'transition: opacity 3s ease 0s; opacity: 0';
},
initLoading: () => {
//- document.body.style.overflow = '';
//- document.getElementById('loading-box').classList.remove("loaded")
}
}
window.addEventListener('load',()=> {
preloader.endLoading();
setTimeout(function(){document.getElementById('loading-box').classList.add("loaded")}, 3000);
})</script><div class="js-pjax"><script>(() => {
const getCommentUrl = () => {
const eleGroup = document.querySelectorAll('#recent-posts .article-title')
let urlArray = []
eleGroup.forEach(i=>{
urlArray.push(i.getAttribute('href'))
})
return urlArray
}
const getCount = () => {
const runTwikoo = () => {
twikoo.getCommentsCount({
envId: 'https://twikoo.qingyi1220.cn/',
region: '',
urls: getCommentUrl(),
includeReply: false
}).then(function (res) {
document.querySelectorAll('#recent-posts .twikoo-count').forEach((item,index) => {
item.innerText = res[index].count
})
}).catch(function (err) {
console.log(err)
})
}
if (typeof twikoo === 'object') {
runTwikoo()
} else {
getScript('/pluginsSrc/twikoo/dist/twikoo.all.min.js').then(runTwikoo)
}
}
window.pjax ? getCount() : window.addEventListener('load', getCount)
})()</script><script>function subtitleType () {
if (true) {
window.typed = new Typed("#subtitle", {
strings: ["世界既不黑也不白，而是一道精致的灰"],
startDelay: 300,
typeSpeed: 100,
loop: true,
backSpeed: 50
})
} else {
document.getElementById("subtitle").innerHTML = '世界既不黑也不白，而是一道精致的灰'
}
}
if (true) {
if (typeof Typed === 'function') {
subtitleType()
} else {
getScript('/pluginsSrc/typed.js/lib/typed.min.js').then(subtitleType)
}
} else {
subtitleType()
}</script></div><script async data-pjax src="/js/sky.js"></script> <div class="aplayer no-destroy" data-id="7788063551" data-server="netease" data-type="playlist" data-fixed="true" data-mini="true" data-listFolded="false" data-order="random" data-preload="none" data-autoplay="false" data-mutex="true" muted></div><link rel="stylesheet" href="/pluginsSrc/aplayer/dist/APlayer.min.css" media="print" onload="this.media='all'"><script src="/pluginsSrc/aplayer/dist/APlayer.min.js"></script><script src="/pluginsSrc/butterfly-extsrc/metingjs/dist/Meting.min.js"></script><script src="/pluginsSrc/pjax/pjax.min.js"></script><script>let pjaxSelectors = ["head > title","#config-diff","#body-wrap","#rightside-config-hide","#rightside-config-show",".js-pjax"]
var pjax = new Pjax({
elements: 'a:not([target="_blank"]):not([href="/tags/"]):not([href="/categories/"]):not([href="/echarts/"])',
selectors: pjaxSelectors,
cacheBust: false,
analytics: false,
scrollRestoration: false
})
document.addEventListener('pjax:send', function () {
// removeEventListener scroll
window.tocScrollFn && window.removeEventListener('scroll', window.tocScrollFn)
window.scrollCollect && window.removeEventListener('scroll', scrollCollect)
typeof preloader === 'object' && preloader.initLoading()
document.getElementById('rightside').style.cssText = "opacity: ''; transform: ''"
if (window.aplayers) {
for (let i = 0; i < window.aplayers.length; i++) {
if (!window.aplayers[i].options.fixed) {
window.aplayers[i].destroy()
}
}
}
typeof typed === 'object' && typed.destroy()
//reset readmode
const $bodyClassList = document.body.classList
$bodyClassList.contains('read-mode') && $bodyClassList.remove('read-mode')
typeof disqusjs === 'object' && disqusjs.destroy()
})
document.addEventListener('pjax:complete', function () {
window.refreshFn()
document.querySelectorAll('script[data-pjax]').forEach(item => {
const newScript = document.createElement('script')
const content = item.text || item.textContent || item.innerHTML || ""
Array.from(item.attributes).forEach(attr => newScript.setAttribute(attr.name, attr.value))
newScript.appendChild(document.createTextNode(content))
item.parentNode.replaceChild(newScript, item)
})
GLOBAL_CONFIG.islazyload && window.lazyLoadInstance.update()
typeof chatBtnFn === 'function' && chatBtnFn()
typeof panguInit === 'function' && panguInit()
// google analytics
typeof gtag === 'function' && gtag('config', '', {'page_path': window.location.pathname});
// baidu analytics
typeof _hmt === 'object' && _hmt.push(['_trackPageview',window.location.pathname]);
typeof loadMeting === 'function' && document.getElementsByClassName('aplayer').length && loadMeting()
// prismjs
typeof Prism === 'object' && Prism.highlightAll()
typeof preloader === 'object' && preloader.endLoading()
})
document.addEventListener('pjax:error', (e) => {
if (e.request.status === 404) {
pjax.loadUrl('/404.html')
}
})</script><script async data-pjax src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script></div><!-- hexo injector body_end start --><script data-pjax src="https://npm.elemecdn.com/hexo-filter-gitcalendar/lib/gitcalendar.js"></script><script data-pjax>
function gitcalendar_injector_config(){
var parent_div_git = document.getElementById('recent-posts');
var item_html = '<div class="recent-post-item" style="width:100%;height:auto;padding:10px;"><style>#git_container{min-height: 280px}@media screen and (max-width:650px) {#git_container{min-height: 0px}}</style><div id="git_loading" style="width:10%;height:100%;margin:0 auto;display: block;"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 50 50" style="enable-background:new 0 0 50 50" xml:space="preserve"><path fill="#d0d0d0" d="M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z" transform="rotate(275.098 25 25)"><animatetransform attributeType="xml" attributeName="transform" type="rotate" from="0 25 25" to="360 25 25" dur="0.6s" repeatCount="indefinite"></animatetransform></path></svg><style>#git_container{display: none;}</style></div><div id="git_container"></div></div>';
parent_div_git.insertAdjacentHTML("afterbegin",item_html)
console.log('已挂载gitcalendar')
}
if( document.getElementById('recent-posts') && (location.pathname ==='/'|| '/' ==='all')){
gitcalendar_injector_config()
GitCalendarInit("https://gitcalendar.qingyi1220.cn/api",['rgb(242, 249, 255)', 'rgb(117, 200, 255)', 'rgb(45, 160, 255)', 'rgb(20, 126, 255)', 'rgb(0, 140, 255)', 'rgb(0, 104, 224)', 'rgb(0, 80, 171)', 'rgb(0, 79, 170)','rgb(0, 64, 137)', 'rgb(3, 47, 98)', 'rgb(5, 38, 76)'],'TsingYi1263')
}
</script><!-- hexo injector body_end end --></body></html>