最近在修一个 legacy bug,看到一段不太懂的代码。
调用的是 dropbox 的 api (参考这个链接)
https://www.dropbox.com/developers/documentation/http/documentation#files-download
这里的 dropbox 的文档就有点问题。该 API 的返回值,其实包含一个 property named fileBlob
,类型是 Blob (在文档里面没有写出来)
我们就是通过这个 fileBlob 拿到下载文件的内容。
我们代码大约是:
async get(fileId: string): Promise {
“blabla...”
const fileData = await [dropbox SDK client API call]
return (fileData as any).fileBinary;
}
成功返回了。内容也都拿到了。但是,这里,我不理解的是,
fileData 的类型是 dropbox.files.FileMetadata, 这个里面只有 property - fileBlob,类型是 Blob,没有 fileBinary 啊?这是怎么通过(fileData as any).fileBinary 转化成 ArrayBuffer 的?
更骚的是,
外面的调用者,直接通过下面这段来判断文件大小,也是成功的。
const fileData = await get("fileid");
(fileData as Buffer).length
google 了一些 ArrayBuffer, Blob, and Buffer 的相关资料,也没发现能够这样转换啊?
特来请教一下。有没有老司机 /大神解惑一下。
谢谢!
看了[这个例子]( https://github.com/dropbox/dropbox-sdk-js/blob/b2353edeb221ec17b8e70a1d8fd4799e2f1f031d/examples/typescript/node/download.tshttps://github.com/dropbox/dropbox-sdk-js/blob/4ba071b3f184538f24fffa34e40aca15d663f53d/src/download-request.js),在非浏览器环境中,会在返回结果里面强行加上这个 `fileBinary`。然后再看这个文件的 [63 行]( https://github.com/dropbox/dropbox-sdk-js/blob/4ba071b3f184538f24fffa34e40aca15d663f53d/src/download-request.js和 [64 行]( https://github.com/dropbox/dropbox-sdk-js/blob/4ba071b3f184538f24fffa34e40aca15d663f53d/src/download-request.jsdata 的来源其实就是 [8 行]( https://github.com/dropbox/dropbox-sdk-js/blob/4ba071b3f184538f24fffa34e40aca15d663f53d/src/download-request.js的 `res.blob()` (浏览器环境) 或者 `res.buffer()` ( node 环境)的返回值。
至于这个 `res` ,不难观察其实就是 `fetch.Response` 对象。
参考 [node-fetch 的实现]( https://github.com/node-fetch/node-fetch/blob/master/src/body.js处理的就是 `Buffer` 对象。 剩下的逻辑就是 nodejs 部分中, `Buffer` 和 `ArrayBuffer` 的故事了。
谢谢。清晰了好多。
dropbox 的 API 文档太坑了,这也不写,那也不写。fileBlob 没有写,fileBinary 也不写,还得去看源代码。
这一点,以前确实不知道: web & node 环境,这内容的返回类型还不同,blob or buffer,难道统一不好么?
还是说,因为技术限制 or 某些约定俗成 or best practice?
浏览器环境里面没有 buffer,它使用了 [blob]( https://developer.mozilla.org/en-US/docs/Web/API/Blob) 来实现 的 二进制数据处理。
简单的说 blob 就是 浏览器下面的 buffer .
Blob 是对 ArrayBuffer 的高级抽象。ArrayBuffer 是 JS 操作二进制的基本机制。
具体可见: https://javascript.info/arraybuffer-binary-arrays