saber酱的抱枕

Fly me to the moon

01/18
11:42
软件

获取bilibili视频的封面图片的用户脚本

bilibili cover image javascript js UserScript 哔哩哔哩 封面图 用户脚本

在 bilibili 的各种视频/直播封面上,以及视频播放页面/直播间内,按 Ctrl+鼠标右键 ,就会在新标签页里打开它的封面图。

脚本安装地址:
https://greasyfork.org/zh-CN/scripts/30714

老东西了,今天更新了一下。

获取bilibili视频的封面图片的用户脚本

04/18
14:41
软件

手动编码 multipart/form-data 格式的数据

自动发送的 multipart/form-data

在浏览器中,如果 POST 请求的 body 数据是 FormData 类型,那么浏览器会自动把数据以 multipart/form-data 格式编码并发送,不需要我们进行额外处理。

const formElement = document.querySelector('#form')
const formData = new FormData(formElement)
fetch('/post', {
  method: 'post',
  body: formData,
})

multipart/form-data 编码方式可以用于上传文件。不过即使不上传文件,因为 FormData 用起来很便捷,所以我也习惯使用它。

但是极少数情况可能需要我们自己把表单数据编码成 multipart/form-data 格式,于是我就尝试了一番。

Read More →

手动编码 multipart/form-data 格式的数据

03/16
16:23
软件

JS 的 MD5 库

最近做一个网站的下载器,发现它的请求头有个标记 sign,是对字符串进行 MD5 加密产生的 hash,所以我就找了个 JavaScript 的 MD5 库。

https://github.com/pvorb/node-md5

这个库主目录下的 md5.js 文件是 NodeJS 环境使用的,dist 目录里的 js 文件是浏览器环境里使用的。

吐槽下这个网站,不知为何它没有用 HTTPS,估计是因为这个原因所以搞了个 sign 验证。但是 sign 的计算是在前端做的,我直接从它的 js 源码里找到了加密算法,就像这样:

const key = 'asdasddsa'
const time = Date.now()
const sign = md5(key + time)

用一个固定的字符串做秘钥,加上发起请求时的时间戳生成 md5 作为 sign。(请求头里同时也要携带这个时间戳,服务器端再做验证)。不仅秘钥可以直接看到,而且时间戳也由我提供,我寻思这加密是加了个寂寞……

JS 的 MD5 库

08/10
12:07
软件

把图片转换为 icon 图标的工具

我用 JavaScript 写了一个把图片转换为 icon 图标的工具,支持多种图标尺寸,可以在线使用:
https://icon.pixiv.download/
效果:
把图片转换为 icon 图标
左边是图片,右边是生成的 ico 文件。
之前当我想在 pixiv 下载器里加入“用户头像转 ico 文件”的功能时,搜索相关的 JS 库,发现都是给 NodeJS 写的(需要依赖一些图片处理的包),没有原生 JS 可以直接用的。然后我去搜索在线转换的网站,想扒代码,发现都是发送到服务器由后端进行转换的。
没办法我就自己研究写了一个,使用原生 JS,转换是在本地直接完成的,不需要发送到服务器。

Read More →

把图片转换为 icon 图标的工具

07/23
17:03
学习

JavaScript 中 setTimeout 0 的使用

console.log(0)
setTimeout(() => {
  console.log(1)
}, 0);
console.log(2)

如上代码会输出 0,2,1。 setTimeout 里面的是最后执行的。这是因为 JavaScript 的任务队列分为同步队列和异步队列, 优先执行同步队列里的任务,同步队列里的任务执行完了才会执行异步队列里的任务。setTimeout 里的代码会被放到异步队列里,这样就改变了代码的执行顺序。指定时间 0 是让 JavaScript 执行异步队列时尽早执行这部分代码。

Read More →

JavaScript 中 setTimeout 0 的使用

05/11
14:33
学习

JS 中 exec 和 match 进行正则表达式匹配的区别

设想一下简单的例子:有字符串 abcd,我们使用正则表达式 /\w/g 全局匹配它,应该获取到 a b c d 四个字符串。

正则表达式的 exec 方法和字符串的 match 都可以达到这个目的,但使用方式上有差别。

下面的内容只探讨全局匹配模式的情况(也就是正则表达式后面加了 g 标识)。非全局匹配模式,可以基本认为它们没有差别。

Read More →

JS 中 exec 和 match 进行正则表达式匹配的区别