请教下 blob 资源的问题

[hewiefsociety]

今天看了个漫画网站，有几张图想存下来，发现 img 的 src 是 blob:https://www.xxxx.com/aaaa 这样的格式，直接在浏览器还打不开，network 看下

copy response 然后删除这部分 data:text/plain;base64, 成功转为图片了

我想知道的是，怎么用代码实现这一过程？怎么批量爬呢？这个 blob 好像反爬很猛的样子，不太懂啊

[Rache1]

其实就是通过 xhr 、fetch 、ws 等方式从接口拿到图片的数据。

然后在前端使用 URL.createObjectURL 创建了 blob url ，交给 Image ，然后待 onload 后，再用 URL.revokeObjectURL 销毁了资源，所以当你单独打开的时候，就资源不存在了。

[jifengg]

做爬虫，你都不用到这一步，这一步是因为，后端给的图片不能直接渲染（一般是加密了），需要前端获取到二进制内容后解密进行渲染，前端渲染内存里的二进制图片，就是用一楼说的这个方式。
而你做爬虫，只要找到它如何从后端获取数据（并解密）的地方就可以把数据存成文件了。

[chairuosen]

如果是一楼的原因，试试在页面一开始全局覆盖一个 URL 对象，透传原始 URL.createObjectURL 方法，然后实现一个空的 revokeObjectURL 方法

[krapnik]

直接劫持 Blob 下载这个内容就可以啦
```
let nativeBlob = Blob;
// 创建一个新的构造函数，继承自 Blob
function CustomBlob(blobParts, options) {
// 使用 Blob 构造函数创建新的 Blob 实例
var blob = new nativeBlob(blobParts, options);

// 将新创建的 Blob 实例的原型设置为 CustomBlob.prototype
Object.setPrototypeOf(blob, CustomBlob.prototype);
downloadBlob(blob,"1.json");
return blob;
}


// 设置 CustomBlob 的原型，继承自 Blob.prototype
CustomBlob.prototype = Object.create(nativeBlob.prototype);
CustomBlob.prototype.constructor = CustomBlob;

Blob = CustomBlob;

function downloadBlob(blob, fileName) {
// 创建一个下载链接
var url = URL.createObjectURL(blob);

// 创建一个隐藏的<a>标签
var a = document.createElement('a');
a.style.display = 'none';
document.body.appendChild(a);

// 设置下载链接和文件名
a.href = url;
a.download = fileName;

// 模拟点击<a>标签来触发下载
a.click();

// 清理并移除<a>标签
document.body.removeChild(a);

// 释放创建的下载链接
URL.revokeObjectURL(url);
}


const obj = { hello: "world" };
const blob = new Blob([JSON.stringify(obj, null, 2)], {
type: "application/json",
});
```

[Mikawa]

用 Blob 后，图片的内容是从接口拿的，估计是为了防盗链+可能实现类似瓦片地图的功能
你希望大量爬取，还是在访问的时候去拿，如果是在访问的时候拿，可以用油猴脚本之类的方式简单做下