ArrayBuffer Uint8Array Blob与文本字符相互转换示例

目录
  • API介绍
  • 字符与ArrayBuffer，Uint8Array相互转换

API介绍

前端 File 上传、下载，Canvas 保存图片，Ajax 和 Fetch 二进制流传输，PDF 预览，浏览器上 WebAssembly 的应用 等等都需要用到 ArrayBuffer 和 Blob 。文件就具体介绍一下这些对象的相互转换。

FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容，使用 File 或 Blob 对象指定要读取的文件或数据。

Blob 对象表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取，也可以转换成 ReadableStream 来用于数据操作。Blob 表示的不一定是 JavaScript 原生格式的数据。File 接口基于 Blob，继承了 blob 的功能并将其扩展使其支持用户系统上的文件。

ArrayBuffer 对象代表储存二进制数据的一段内存，它不能直接读写，只能通过视图（TypedArray 视图和 DataView 视图)来读写，视图的作用是以指定格式解读二进制数据。

Uint8Array 对象是 ArrayBuffer 的一个数据类型（8 位不带符号整数）。

TextEncoder 接受代码点流作为输入，并提供 UTF-8 字节流作为输出。

TextDecoder 接口表示一个文本解码器，一个解码器只支持一种特定文本编码，例如 utf-8、iso-8859-2、koi8、cp1261，gbk 等等。解码器将字节流作为输入，并提供代码点流作为输出。

注意： 二进制数组并不是真正的数组，而是类似数组的对象。

字符与ArrayBuffer，Uint8Array相互转换

TextEncoder => ArrayBuffer

let encoder = new TextEncoder();

// 字符 转 Uint8Array
let uint8Array = encoder.encode("你好啊");

// Uint8Array 转 ArrayBuffer
let arrayBuffer = uint8Array.buffer

Blob => ArrayBuffer

let str = 'hello，你好吗？'
let blob = new Blob([str],{type:'text/plain;charset=utf-8'});
let utf8decoder = new TextDecoder()
blob.arrayBuffer().then(buffer=>{
  // ArrayBuffer
  console.log(buffer)
  let text = utf8decoder.decode(buffer)
  // String
  console.log(text)
})

FileReader => ArrayBuffer

let str = 'hello，你好吗？'
let blob = new Blob([str],{type:'text/plain;charset=utf-8'});
let utf8decoder = new TextDecoder()
let fr = new FileReader()
fr.readAsArrayBuffer(blob)
fr.onload = function(res) {
  // ArrayBuffer
  let buffer = fr.result
  console.log(buffer)
  let text = utf8decoder.decode(buffer)
  // String
  console.log(text)
}

以上就是ArrayBuffer Uint8Array Blob与文本字符相互转换示例的详细内容，更多关于ArrayBuffer Uint8Array Blob转换文本字符的资料请关注我们其它相关文章！

赞 (0)

相关推荐

  • js将字符转换为UTF-8字符的工具

    在下面的文本框中输入中文文字,按"转化",即可将其转化为UTF-8字符. 再按"还原",即可将其还原为简体中文. GB2312 - UTF8 互转工具 UTF-8 转换工具 在下面的文本框中输入中文文字,按"转化",即可将其转化为UTF-8字符. 再按"还原",即可将其还原为简体中文. var mode="zhuan"; function encode(obj,btn){ if(mode=="zh

  • js blob类型url的视频下载问题的解决

    blob下载问题的详细描述 我想用src url blob:https://www.youtube.com/23aea5c8-9ae2-40dc-9417-e675ea99b386下载视频,但是不知道应该怎么做. 有没有下载这类视频的通用方法? 推荐的解决方法 我在Vimeo中找到了一个使用blob url下载视频的方法(读了这篇文章,我才知道做法).我正在使用Google Chrome,具体步骤如下: 1.打开More Tools(更多工具)→Developer Tools(开发工具) 2.检

  • Blob实现与File DataURL canvas相互转换示例

    目录 引言 一.概念介绍 二.相互转化 2-1. dataURL(base64) 转化成 Blob(二进制)对象 2-2. File.Blob 文件数据绘制到 canvas 2-3. File.Blob 转化成 dataURL 2-4. 从 canvas 中获取文件 dataURL 引言 因为浏览器沙箱的存在,web端操作文件的限制比较多,只能进行一些简单的文件上传下载.对于编辑文件和文件转换感到苍白无力,但这并不代表说毫无办法.随着现代化浏览器的不断升级,也提供了一些好用强大的API可以间接操

  • js中关于Blob对象的介绍与使用

    blob对象介绍 一个 Blob对象表示一个不可变的, 原始数据的类似文件对象.Blob表示的数据不一定是一个JavaScript原生格式 blob对象本质上是js中的一个对象,里面可以储存大量的二进制编码格式的数据. 创建blob对象 创建blob对象本质上和创建一个其他对象的方式是一样的,都是使用Blob() 的构造函数来进行创建. 构造函数接受两个参数: 第一个参数为一个数据序列,可以是任意格式的值. 第二个参数是一个包含两个属性的对象{ type: MIME的类型, endings: 决

  • Javascript将双字节字符转换成单字节字符并计算长度

    复制代码 代码如下: function(s){     return Math.ceil(s.replace(/[\u4e00-\u9fa5]/g, 'xx').length / 2); } 也可以用(/[^\x00-\xff]/g,'**'),这个是用'**'替换双字节字符 (/[\u4e00-\u9fa5]/g, '**') 这个是用'**'替换中文字符,\u4e00-\u9fa5中文的unicode编吗 以上就是本文的全部内容,了解更多JavaScript的语法,大家可以查看:<JavaS

  • JavaScript Blob对象原理及用法详解

    Blob是JavaScript内建对象,表示不可变的原始数据,类似文件的对象. blob是表示原始数据的不可变对象,这些数据不一定是JavaScript原生格式的,文件接口基于Blob,继承Blob功能并将其扩展为支持用户系统上的文件. Blob有很多用途: 可以从网络的内容创建. 可以保存到磁盘或从磁盘读取. 例如,它们是FileReader API中使用的File的基础数据结构. 我们可以使用 Blob() 构造函数从其他非blob对象和数据构造Blob. Blob构造函数 Blob构造函数

  • ArrayBuffer Uint8Array Blob与文本字符相互转换示例

    目录 API介绍 字符与ArrayBuffer,Uint8Array相互转换 API介绍 前端 File 上传.下载,Canvas 保存图片,Ajax 和 Fetch 二进制流传输,PDF 预览,浏览器上 WebAssembly 的应用 等等都需要用到 ArrayBuffer 和 Blob .文件就具体介绍一下这些对象的相互转换. FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用 File 或 Blob 对象指定要读取的文件或数据. B

  • C++多字节字符与宽字节字符相互转换

    最近在C++编程中经常遇到需要多字节字符与宽字节字符相互转换的问题,一直自己贴那几句代码.觉得麻烦,于是就自己写了一个类来封装wchar_t与char类型间的转换,其他的,诸如:CString\ LPWSTR\TCHAR CHAR\LPSTR之间也是一样用 复制代码 代码如下: #include <iostream> using namespace std; class CUser { public: CUser(); virtual~ CUser(); char* WcharToChar(w

  • Python3调用微信企业号API发送文本消息代码示例

    本文主要向大家分享了Python3调用微信企业号API发送文本消息示例的有关代码,具体如下: #!/usr/bin/env python # -*- coding:utf-8 -*- import urllib.request import json import sys import logging touser = '@all' agentid = 0 corpid = 'wx5aef2da956514535' corpsecret = 'Co17m_OPlvE8Q4P2RKKwtq5oIA

  • Java String字符串和Unicode字符相互转换代码详解

    Java String字符串和Unicode字符相互转换代码详解

    网上大部分有关"Java String字符串和Unicode字符相互转换代码"的博文几乎都仅是将全为Unicode字符的字符串进行转换,而我们日常很可能需要的是将混有普通字符的Unicode一并转换(例如"\u0061\u0062\u0063(123)",我们希望转换成"abc(123)",而实际上网上的通用方法并不符合该需求,运行即报错),普通字符跳过而Unicode字符要进行转换,在进行字符串的查找替换截取什么的使用正则表达式往往是个很好的选

  • java 判断字符串中是否有重复字符的示例

    如下所示: /** * 判断字符串是否包含重复字符 * @param str * @return */ public static boolean containRepeatChar(String str){ if(str==null||str.isEmpty()){ return false; } char[] elements=str.toCharArray(); for(char e:elements){ if(str.indexOf(e)!=str.lastIndexOf(e)){ re

  • 在Java中轻松将HTML格式文本转换为纯文本的方法示例(保留换行)

    第一步:引入Jsoup和lang和lang3的依赖: Jsoup是HTML解析器 lang和lang3这两个包里有转换所需的工具类 <dependency> <groupId>org.jsoup</groupId> <artifactId>jsoup</artifactId> <version>1.11.3</version> </dependency> <dependency> <group

  • python实现企业微信定时发送文本消息的示例代码

    企业微信定时发送文本消息 使用工具:企业微信机器人+python可执行文件+计算机管理中的任务计划程序 第一步:创建群机器人 选择群聊,单击鼠标右键,添加群机器人. 建立群机器人后,右键查看机器人,如下 复制机器人的链接. 第二步:编辑python程序 import requests from datetime import datetime url = 'https://qyapi.we......' #机器人的webhook地址 headers = {'Content-type':'appl

  • python中文本字符处理的简单方法记录

    python中文本字符处理的简单方法记录

    今天,跟大家分享一下我做小项目时想出来的文本字符处理的方法,希望能对大家有所帮助. 完整代码: strings = "我,是'C|S;D|N!的:程[序]员#M,r&.:P'a#n?_&学?狂"#将字符串设置好 def String_Process(string):#定义一个字符处理函数,设置参数string,是有待处理的字符串. print("python使我快乐!!") print("未处理的字符串:",string) var

  • Java 生成随机字符的示例代码

    Java 生成随机字符的示例代码

    示例代码: import java.util.Random; import java.util.UUID; public class Dept { /** * 生成随机字符串 uuid */ public static String getUUID() { return UUID.randomUUID().toString(); } /** * 生成随机字符串 uuid 将"-"替换为"" */ public static String getUUNUM() { r

随机推荐