iis服务器助手广告广告
返回顶部
首页 > 资讯 > 前端开发 > node.js >使用Node.js处理前端代码文件的编码问题
  • 861
分享到

使用Node.js处理前端代码文件的编码问题

代码文件Node 2022-06-04 17:06:27 861人浏览 八月长安
摘要

使用 nodejs 编写前端工具时,操作得最多的是文本文件,因此也就涉及到了文件编码的处理问题。我们常用的文本编码有 UTF8 和 GBK 两种,并且 UTF8 文件还可能带有 BOM。在读取不同编码的文本

使用 nodejs 编写前端工具时,操作得最多的是文本文件,因此也就涉及到了文件编码的处理问题。我们常用的文本编码有 UTF8 和 GBK 两种,并且 UTF8 文件还可能带有 BOM。在读取不同编码的文本文件时,需要将文件内容转换为 js 使用的 UTF8 编码字符串后才能正常处理。

BOM 的移除
BOM 用于标记一个文本文件使用 Unicode 编码,其本身是一个 Unicode 字符("uFEFF"),位于文本文件头部。在不同的 Unicode 编码下,BOM 字符对应的二进制字节如下:


  Bytes   Encoding
----------------------------
  FE FF    UTF16BE
  FF FE    UTF16LE
  EF BB BF  UTF8

因此,我们可以根据文本文件头几个字节等于啥来判断文件是否包含 BOM,以及使用哪种 Unicode 编码。但是,BOM 字符虽然起到了标记文件编码的作用,其本身却不属于文件内容的一部分,如果读取文本文件时不去掉 BOM,在某些使用场景下就会有问题。例如我们把几个 JS 文件合并成一个文件后,如果文件中间含有 BOM 字符,就会导致浏览器 JS 语法错误。因此,使用 nodeJS 读取文本文件时,一般需要去掉 BOM。例如,以下代码实现了识别和去除 UTF8 BOM 的功能。


function readText(pathname) {
  var bin = fs.readFileSync(pathname);

  if (bin[0] === 0xEF && bin[1] === 0xBB && bin[2] === 0xBF) {
    bin = bin.slice(3);
  }

  return bin.toString('utf-8');
}

GBK 转 UTF8
NodeJS 支持在读取文本文件时,或者在 Buffer 转换为字符串时指定文本编码,但遗憾的是,GBK 编码不在NodeJS自身支持范围内。因此,一般我们借助 iconv-lite 这个三方包来转换编码。使用 NPM 下载该包后,我们可以按下边方式编写一个读取 GBK 文本文件的函数。


var iconv = require('iconv-lite');

function readGBKText(pathname) {
  var bin = fs.readFileSync(pathname);

  return iconv.decode(bin, 'gbk');
}

单字节编码
有时候,我们无法预知需要读取的文件采用哪种编码,因此也就无法指定正确的编码。比如我们要处理的某些 CSS 文件中,有的用 GBK 编码,有的用 UTF8 编码。虽然可以一定程度可以根据文件的字节内容猜测出文本编码,但这里要介绍的是有些局限,但是要简单得多的一种技术。

首先我们知道,如果一个文本文件只包含英文字符,比如 Hello World,那无论用 GBK 编码或是 UTF8 编码读取这个文件都是没问题的。这是因为在这些编码下,ASCII0~128 范围内字符都使用相同的单字节编码。

反过来讲,即使一个文本文件中有中文等字符,如果我们需要处理的字符仅在 ASCII0~128 范围内,比如除了注释和字符串以外的JS代码,我们就可以统一使用单字节编码来读取文件,不用关心文件的实际编码是 GBK 还是 UTF8。以下示例说明了这种方法。

1. GBK编码源文件内容:


  var foo = '中文';

2. 对应字节:


  76 61 72 20 66 6F 6F 20 3D 20 27 D6 D0 CE C4 27 3B

3. 使用单字节编码读取后得到的内容:


  var foo = '{乱码}{乱码}{乱码}{乱码}';

4. 替换内容:


  var bar = '{乱码}{乱码}{乱码}{乱码}';

5. 使用单字节编码保存后对应字节:


  76 61 72 20 62 61 72 20 3D 20 27 D6 D0 CE C4 27 3B

6. 使用 GBK 编码读取后得到内容:


  var bar = '中文';

这里的诀窍在于,不管大于 0xEF 的单个字节在单字节编码下被解析成什么乱码字符,使用同样的单字节编码保存这些乱码字符时,背后对应的字节保持不变。

NodeJS 中自带了一种 binary 编码可以用来实现这个方法,因此在下例中,我们使用这种编码来演示上例对应的代码该怎么写。


function replace(pathname) {
  var str = fs.readFileSync(pathname, 'binary');
  str = str.replace('foo', 'bar');
  fs.writeFileSync(pathname, str, 'binary');
}

--结束END--

本文标题: 使用Node.js处理前端代码文件的编码问题

本文链接: https://www.lsjlt.com/news/13078.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • Java解决前端数据处理及乱码问题
    目录一、数据处理1. 处理提交数据2. 数据显示到前端二、乱码问题一、数据处理 1. 处理提交数据 1.提交的名称和方法的参数名一致 //localhost:8080/user/...
    99+
    2024-04-02
  • Python编解码问题及文本文件处理方法详解
    编解码器 在字符与字节之间的转换过程称为编解码,Python自带了超过100种编解码器,比如: ascii(英文体系) gb2312(中文体系) utf-...
    99+
    2024-04-02
  • JS前端使用Blob和File读取文件的操作代码
    目录Blob创建 Blob 类型的对象1. new Blob()2. blob.slice()Blob 对象的属性Blob 应用实例FileFileReader构造函数属性事件方法实...
    99+
    2022-11-13
    js使用Blob和File读取文件 js读取文件
  • PHP如何处理中文字符编码问题
    PHP如何处理中文字符编码问题,需要具体代码示例 在开发PHP应用程序时,处理中文字符编码问题是一个常见的挑战。特别是在处理用户输入、数据库操作以及输出到网页等场景中,正确处理中文字符...
    99+
    2024-04-02
  • Java如何解决前端数据处理及乱码问题
    本篇文章为大家展示了Java如何解决前端数据处理及乱码问题,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。一、数据处理1. 处理提交数据提交的名称和方法的参数名一致//localhost:8080/u...
    99+
    2023-06-22
  • Qt使用流处理XML文件的示例代码
    本章开始我们将了解到如何使用 Qt 处理 XML 格式的文档。 XML(eXtensible Markup Language)是一种通用的文本格式,被广泛运用于数据交换和数据存储(虽...
    99+
    2023-02-03
    Qt处理XML文件 Qt处理XML Qt XML
  • PHP中文文件名乱码问题处理技巧
    PHP中文文件名乱码问题处理技巧 在开发过程中,经常会遇到处理中文文件名乱码的问题,尤其是在处理用户上传的文件时。在PHP中,如何正确处理文件名乱码是一个比较常见且重要的问题。本文将介...
    99+
    2024-02-27
    php 乱码 文件名
  • Go语言中如何处理并发文件的文件系统路径处理和文件名编码问题?
    Go语言是一门支持并发编程的编程语言,它提供了丰富的工具和库,可以方便地处理文件系统路径和文件名编码问题。在编写并发文件操作时,我们需要注意以下几个方面:文件系统路径的处理、文件名编码、并发操作。一、文件系统路径的处理:在处理文件系统路径时...
    99+
    2023-10-22
    并发处理 文件系统路径处理 文件名编码
  • 关于Python的文本文件转换编码问题
    目录前言 测试数据编码转换代码执行结果说明前言  因为编程的原因,经成会遇到字符编码的问题。如开发工具使用的是UTF-8编码(推荐使用),然后需要导入一个从其它地...
    99+
    2023-05-16
    Python文本文件 文件转换编码
  • Python中对XML文件的编码转换问题
    目录1. 在 Python 中 XML 文件的编码问题2. 处理 Python XML 文件的思路3. 实际过程中遇到的问题4. 最后使用的代码1. 在 Python 中 XML 文...
    99+
    2023-03-21
    Python XML 文件编码转换 Python XML 转换
  • 怎么使用node.js处理前端提交的GET请求
    本篇内容介绍了“怎么使用node.js处理前端提交的GET请求”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!一、获取GET请求流程1、首先和...
    99+
    2023-06-17
  • 使用node.js怎么处理前端提交的GET请求
    本篇文章给大家分享的是有关使用node.js怎么处理前端提交的GET请求,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。一、获取GET请求流程1...
    99+
    2024-04-02
  • 怎么处理php下载文件内容乱码的问题
    这篇文章将为大家详细讲解有关怎么处理php下载文件内容乱码的问题,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。php下载文件内容乱码的解决办法:1、通过“ob_clean()”函数清空输出缓冲区内容;2、...
    99+
    2023-06-07
  • Python的文本文件转换编码问题怎么解决
    这篇文章主要介绍“Python的文本文件转换编码问题怎么解决”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“Python的文本文件转换编码问题怎么解决”文章能帮助大家解决问题。测试数据注:测试文本采用...
    99+
    2023-07-06
  • 使用JsonConverter处理上传文件的路径问题
    目录场景解决方法使用场景 我们上传一个文件,把文件保存到服务器上,会有一个明确的物理路径,由于需要从前端访问这个文件,还需要web服务器中的一个虚拟路径。这个虚拟路径的存储会有一个问...
    99+
    2022-12-24
    JsonConverter处理上传文件的路径 JsonConverter 上传文件路径
  • 如何解决utf8编码网页包含文件时前面有空行的问题
    小编给大家分享一下如何解决utf8编码网页包含文件时前面有空行的问题,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!  页面采用UTF8编码,头部和尾部用了模板包含文件的方法,结果头部和尾部无端端各多出一个约10px的空行,...
    99+
    2023-06-08
  • 字符编码的处理和BeanUtils组件使用详解
    目录1、字符编码问题解决方案1.1、字符编码处理的实现2、字符和谐的问题在过滤器中设置脏数据在处理完字符编码问题的时候进行和谐(在处理完编码之后进行调用)3、BeanUtils组件的...
    99+
    2024-04-02
  • Golang高效处理文件编码转换的实用技巧
    正确处理 golang 中的文件编码转换使用 ioutil.readall 将文件内容读入字节数组。使用 encoding/csv 对 csv 文件进行映射,并指定文件编码进行转换。使用...
    99+
    2024-04-04
    golang 文件编码
  • 巧破字符编码和文件处理的初探
    一、字符编码 什么是字符编码? 答:我们能够了解到,我们人类能够理解的是字符的高等标识符,计算机智能识别类似于0和1组成的标识符,那么我们人类和计算机沟通,一定需要某种媒介来支持,来进行两种标识符的相互转换。例如: 1 10 -&...
    99+
    2023-01-31
    字符 文件
  • Golang 文件上传中如何处理不同编码的文件名?
    在 go 文件上传中处理不同编码的文件名,可以使用以下两种解决方法:使用 mime.header 和 url 解码。mime.header 通过 filename 字段存储原始编码,而 ...
    99+
    2024-05-13
    文件上传 编码处理 golang
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作