Node.js server render Blob file All In One

合集 - Node.js(100)

1.Adafruit & CircuitPython & Node.js All In One2023-05-182.Node.js os module All In One2023-05-143.Node.js & Raspberry Pi & WS2812B RGB LEDs strip All In One2023-05-124.Node.js Buffer.from All In One2023-04-265.Node.js Event Loop & V8 engine & libuv All In One2023-04-236.Node.js & npm package.json exports field All In One2023-03-217.Node.js cli tools auto install npm packages All In One2023-03-168.Node.js 微服务 All In One2023-03-159.如何定位和分析 Node.js 项目中的内存泄漏问题 All In One2023-03-1310.Node.js process.nextTick All In One2023-02-2811.Web API setImmediate & Node.js setImmediate All In One2023-02-2812.如何使用 Node.js 和 OpenAI API 快速开发一个私有的 ChatGPT 智能聊天机器人程序 All In One2023-02-0813.how to config `node.js` version in vercel All In One2022-12-0214.Node.js & file system & async await & forEach bug All In One2022-11-2915.Microsoft & Node.js All In One2022-11-2716.Node.js fs API docs All In One2022-11-1217.macOS brew uninstall node.js All In One2022-11-1118.nvm & grep filter out only Node.js Latest LTS versions All In One2022-11-0219.Node.js ORM All In One2022-10-1320.How to exit Node.js REPL environment All In One2022-09-2221.Node.js 面试题 All In One2022-09-2122.How to custom your own Node.js Docker Image All In One2022-07-2623.Node.js 中 CommonJS 模块 exports 与 module.exports 实现原理剖析 All In One2022-04-2624.change nvm default Node.js version All In One2022-04-1925.Node.js path All In One2022-04-1726.如何使用 Node.js 服务器控制浏览器下载文件还是预览文件 All In One2022-04-17

27.Node.js server render Blob file All In One2022-04-09

28.how to exit terminal from a Node.js program All In One2022-04-0629.Node.js CommonJS __dirname ../ relative path bug All In One2022-04-0430.Node.js import ESM module error All In One2022-04-0431.TypeScript & Node.js crawler All In One2022-04-0132.Node.js process All In One2022-03-1333.autoprefixer: ignore next not work bug All In One2022-01-2634.如何判断当前 js 代码是运行在浏览器还是node环境中 All In One2022-01-1635.Node.js project auto open localhost with ip address All In One2021-12-2236.Node.js & TypeScript error All In One2021-11-1437.Node.js & child_process All In One2021-10-2038.cross-env & shelljs & set custom node.js env All In One2021-10-1539.nvm set system node version All In One2021-06-1740.Node.js 设置内存大小 All In One2021-06-1541.Node.js & ES Modules & TypeScript All In One2021-05-2142.Node.js & TS & VSCode error All In One2021-05-2143.Node.js & Express server support CORS2021-04-3044.Node.js in action All In One2021-04-1445.Node.js & Express.js Server get binary data All In One2021-04-0846.node.js & webpack proxy bug2021-04-0747.Node.js 实战（第2版）All In One2021-04-0648.node.js ECONNRESET error2021-03-2949.node.js cli downloader2021-01-2350.Node.js 文件上传 cli tools2021-01-1751.Node.js 实战 & 最佳 Express 项目架构2021-01-1152.cnblogs blogs backup & node.js crawler2021-01-0753.Node.js 返回 JSON 数据2020-12-2154.node.js 怎么扩大默认的分配的最大运行内存2020-12-1555.Node.js fs API _dirname & _filename & path All In One2020-11-1656.Node.js Backend Developer2020-10-2557.Node.js require 模块加载原理 All In One2020-10-0558.node.js module.exports & exports & module.export all in one2020-10-0559.Nest.js tutorials All In One2020-09-1360.PM2 & nodemon & Node.js Deamon All In One2020-09-0661.node.js 中间件2020-09-0262.node --experimental-modules & node.js ES Modules2020-08-3163.Express All In One2020-08-3064.Node.js & ES Modules & Jest2020-08-2965.how to config custom process.env in Node.js All In One2020-08-1466.一个最简单 node.js 命令行工具2020-07-1767.Node.js delete directory & file system All In One2020-07-0968.Node.js Learning Paths All In One2020-07-0869.Deno 1.0 & Node.js All In One2020-05-1770.Node.js & ORM & ODM All In One2020-05-1071.Node.js & BFF & FaaS2020-05-0572.Node.js 如何处理一个很大的文件 All In One2020-04-2773.Node.js RESTful API & EJS template engine All In One2020-04-2174.Node.js & ES modules & .mjs2020-02-2375.Node.js & 页面截图 & 生成画报 All In One2020-02-1976.Node.js & LTS2020-02-1877.Node.js Debugger All In One2020-02-1078.VSCode & Node.js & debugger & inspector2020-02-0879.玩转 Node.js & React 系列教程：graphql 教程2019-10-1980.Node.js & module.exports & exports All In One2019-09-0381.Node.js & process.env & OS Platform checker2019-05-3082.How to write a Node.js cli tools step by step tutorials All In One2019-05-1383.node.js & read argv2019-05-1384.Node.js & create file All In One2019-05-1385.Docker & Node.js2019-05-1086.NAIO & Node.js All In One2019-05-0887.node.js & fs & file read & file write All In One2019-05-0788.node.js & Unbuntu Linux & nvm & npm2019-05-0789.Node.js & SSR2019-02-2590.nodejs & docker2018-11-1291.Node.js & Koa.js All In One2018-10-1092.mongodb & vue & node.js2018-10-1093.Node.js & module system2018-08-1794.Node.js Spider2017-06-0495.How to Install Multiple Versions of Node.js on the same Server(PC) All In One2016-09-1896.how to updating Node.js and npm2016-09-1897.Node.js : npm-install 教程2016-08-1398.node.js && npm commands2016-07-0199.node.js <=> Command Line Options2016-06-28100.有关 Node.js, npm 和 modules 安装及使用方法的个人总结！All In One2015-09-18

收起

Node.js server render Blob file All In One

Blob

The Blob object represents a blob, which is a file-like object of immutable, raw data;
they can be read as text or binary data, or converted into a ReadableStream so its methods can be used for processing the data.

Blob 对象表示一个blob，它是一个不可变的原始数据的类文件对象；
它们可以作为文本或二进制数据读取，也可以转换为 ReadableStream，以便其方法可用于处理数据。

Blobs can represent data that isn't necessarily in a JavaScript-native format.
The File interface is based on Blob, inheriting blob functionality and expanding it to support files on the user's system.

Blob 可以表示不一定是 JavaScript 原生格式的数据。
File 接口基于 Blob，继承了 blob 功能并将其扩展为支持用户系统上的文件。

const obj = {
  msg: 'hello world!',
  emoji: '👻',
};

const blob = new Blob([JSON.stringify(obj, null, 4)], {type : 'application/json'});

blob.size;
// 50

blob.type;
// 'application/json'

blob.text();
// Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "{\n    \"msg\": \"hello world!\",\n    \"emoji\": \"👻\"\n}"

blob.stream();
// ReadableStream {locked: false}locked: false[[Prototype]]: ReadableStreamcancel: ƒ cancel()getReader: ƒ getReader()locked: (...)pipeThrough: ƒ pipeThrough()pipeTo: ƒ pipeTo()tee: ƒ tee()constructor: ƒ ReadableStream()Symbol(Symbol.toStringTag): "ReadableStream"get locked: ƒ locked()[[Prototype]]: Object


blob.arrayBuffer();
// Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: ArrayBuffer(50)  byteLength: 50[[Prototype]]: ArrayBuffer[[Int8Array]]: Int8Array(50)[[Uint8Array]]: Uint8Array(50)[[Int16Array]]: Int16Array(25)[[ArrayBufferByteLength]]: 50[[ArrayBufferData]]: 717

const obj = {
  msg: 'hello world!',
  emoji: '👻',
};

const blob = new Blob([JSON.stringify(obj, null, 4)], {type : 'application/json'});

blob;
// Blob {size: 50, type: 'application/json'}

const halfBlob = blob.slice(0, blob.size / 2);

blob.text();
// Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "{\n    \"msg\": \"hello world!\",\n    \"emoji\": \"👻\"\n}"

halfBlob.text();
// Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "{\n    \"msg\": \"hello world"

API

https://developer.mozilla.org/en-US/docs/Web/API/Blob

https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream

https://developer.mozilla.org/en-US/docs/Web/API/File

demo

ArrayBuffer

https://www.youtube.com/watch?v=p8lhWdgH49c

// XHR API

// Fetch API

Video demo

https://cdn.xgqfrms.xyz/HTML5/Blob/index.html

https://cdn.xgqfrms.xyz/HTML5/Blob/2022-04-07-sh.mp4

File API ✅

Blob arrayBuffer ❌

//  'arrayBuffer' ❌
// xhr.responseType = 'arrayBuffer';
//  'arraybuffer' ✅
xhr.responseType = 'arraybuffer'; 

refs

---

---

©xgqfrms 2012-2025

www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

---