云策 WordPress 开发者社区

块编辑器开发文档

@wordpress/blob

查看官方原文 ↗
💡 云策文档标注

概述

@wordpress/blob 是 WordPress 的 Blob 实用工具包，提供创建、管理、下载和检查 Blob URL 的 API。适用于前端文件处理，如生成和下载 JSON 文件。

关键要点

  • 提供 createBlobURL、downloadBlob、getBlobByURL、getBlobTypeByURL、isBlobURL 和 revokeBlobURL 等核心函数。
  • 支持从文件创建 Blob URL，下载文件内容（如 JSON 字符串），并检查 URL 是否为 Blob 类型。
  • 适用于浏览器环境，建议用于较小文件（如 < 5 MB）的下载操作。
  • 作为 Gutenberg 项目的一部分，以 monorepo 形式组织，可通过 npm 安装。

代码示例

const fileContent = JSON.stringify(
    {
        title: 'My Post',
    },
    null,
    2
);
const filename = 'file.json';

downloadBlob( filename, fileContent, 'application/json' );
📄 原文内容

Blob utilities for WordPress.

Installation

Install the module

npm install @wordpress/blob --save

API

createBlobURL

Create a blob URL from a file.

Parameters

  • file File: The file to create a blob URL for.

Returns

  • string: The blob URL.

downloadBlob

Downloads a file, e.g., a text or readable stream, in the browser. Appropriate for downloading smaller file sizes, e.g., < 5 MB.

Example usage:

const fileContent = JSON.stringify(
    {
        title: 'My Post',
    },
    null,
    2
);
const filename = 'file.json';

downloadBlob( filename, fileContent, 'application/json' );

Parameters

  • filename string: File name.
  • content BlobPart: File content (BufferSource | Blob | string).
  • contentType string: (Optional) File mime type. Default is ''.

getBlobByURL

Retrieve a file based on a blob URL. The file must have been created by createBlobURL and not removed by revokeBlobURL, otherwise it will return undefined.

Parameters

  • url string: The blob URL.

Returns

  • File | undefined: The file for the blob URL.

getBlobTypeByURL

Retrieve a blob type based on URL. The file must have been created by createBlobURL and not removed by revokeBlobURL, otherwise it will return undefined.

Parameters

  • url string: The blob URL.

Returns

  • string | undefined: The blob type.

isBlobURL

Check whether a url is a blob url.

Parameters

  • url string | undefined: The URL.

Returns

  • boolean: Is the url a blob url?

revokeBlobURL

Remove the resource and file cache from memory.

Parameters

  • url string: The blob URL.

Contributing to this package

This is an individual package that’s part of the Gutenberg project. The project is organized as a monorepo. It’s made up of multiple self-contained software packages, each with a specific purpose. The packages in this monorepo are published to npm and used by WordPress as well as other software projects.

To find out more about contributing to this package or Gutenberg as a whole, please read the project’s main contributor guide.