1.什么是BOM?

BOM是用来判断文本文件是哪一种Unicode编码的标记,其本身是一个Unicode字符("\uFEFF"),位于文本文件头部。

在不同的Unicode编码中,对应的bom的二进制字节如下:

Bytes Encoding

FE FF UTF16BE

FF FE UTF16LE

EF BB BF UTF8

所以我们可以根据文件头部的几个字节和上面的表格对应来判断该文件是哪种编码形式。

2. 如何查看你文件的BOM字符?

BOM头在记事本中是看不到的

以UTF8为例,新建一个1.txt文件,然后打开文件 输入 hello world 然后另存为 此时更改文件的编码格式 由默认的ANSI 即GB2312(国标2312)编码改成UTF8

然后通过下面的node代码,来打印该文本文件的buffer 就可以看到我们所说的BOM头字符


let fs = require('fs'); fs.readFile('./1.txt',function(err,data){
console.log(data)
}) // <Buffer ef bb bf 68 65 6c 6c 6f 20 77 6f 72 6c 64>
// 前三个字节就是对应的我们UTF8编码的文本的BOM头字符

3.存在的问题?

虽然BOM字符起到了标记文件编码的作用但是他并不属于文件的内容部分,所以会产生一些问题:

1.在某些使用场景下就会有问题。例如我们把几个JS文件合并成一个文件后,如果文件中间含有BOM字符,就会导致浏览器JS语法错误。

2.PHP就不能识别bom头,PHP并不会忽略BOM,所以在读取、包含或者引用这些文件时,会把BOM作为该文件开头正文的一部分。根据嵌入式语言的特点,这串字符将被直接执行(显示)出来。由此造成即使页面的 top padding 设置为0,也无法让整个网页紧贴浏览器顶部,因为在html一开头有这3个字符呢!

4.如何去掉UTF8编码的记事本文件的BOM头

方法一:在文件另存为的时候选择无BOM头的UTF8编码

方法二:使用node中的文件模块获取文件的buffer数据并去掉前三个字节,代码如下:

function deleteUtf8BomHead(path) {
let buf = fs.readFileSync(path);
if (buf[0] == 0xef && buf[1] == 0xbb && buf[2] == 0xbf) {
buf = buf.slice(3)
}
return buf
} console.log(deleteUtf8BomHead('./1.txt'));// <Buffer 68 65 6c 6c 6f 20 77 6f 72 6c 64>

// 将GBK编码的buffer转化成utf8的字符串

// 在这里我们要引入一个库 iconv-lite

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

fs.readFile('./2.txt',function (err, data) {

console.log(data,'qq');

let str = iconv.decode(data,'gbk');

console.log(str);

})

什么是文件的BOM头,及BOM头有哪些坑?的更多相关文章

  1. C#写UTF8文件时指定是否含BOM头

    BOM的基本概念 在UCS 编码中有一个叫做"ZERO WIDTH NO-BREAK SPACE"的字符,它的编码是FEFF.而FFFE在UCS中是不存在的字符,所以不应该出现在实 ...

  2. PSR-1之PHP代码文件必须以不带BOM的UTF-8编码

    BOM——Byte Order Mark,就是字节序标记 在UCS 编码中有一个叫做”ZERO WIDTH NO-BREAK SPACE“的字符,它的编码是FEFF.而FFFE在UCS中是不存在的字符 ...

  3. 配置apue的头文件apue.h和unp的头文件anp.h

    配置apue的头文件apue.h和unp的头文件anp.h 如果要使用gcc -g 来生成可调试文件一定要修改Make.defines.linux文件中的CFLAGS变量 修改为:CFLAGS=-an ...

  4. Effective Objective-C 2.0 — 第二条:类的头文件中尽量少引入其他头文件

    第二条:类的头文件中尽量少引入其他头文件 使用向前声明(forward declaring) @class EOCEmployer 1, 将引入头文件的实际尽量延后,只在确有需要时才引入,这样就可以减 ...

  5. Oracle EBS-SQL (BOM-19):主BOM与替代BOM互换.sql

    替代BOM与主BOM互相转换 BOM: 1-01-27-211       子件:1-01-27-416  ID:2202 BOM替代项:替代0001   子件: 1-01-26-204   ID:2 ...

  6. Oracle EBS-SQL (BOM-15):检查多层BOM(含common BOM).sql

    select       distinct b.lvl                                                      层次, b.OPERATION_SEQ ...

  7. 于用cocoapods添加第三方库,并且cocoapods添加成功,但是却在任何一个文件上都导入不了头文件

    关于用cocoapods添加第三方库,并且cocoapods添加成功,但是却在任何一个文件上都导入不了头文件,而且根本没有提示,即使手动打#import "xxxx.h"也报错xx ...

  8. 订单BOM、销售BOM、标准BOM

    订单BOM.销售BOM.标准BOM   訂單BOM: 是實際生產時用的BOM, 在標準BOM和銷售BOM基礎上增減物料的BOM銷售BOM: 是為特定客戶設定的BOM, 在主檔數據層次上的BOM, 在生 ...

  9. 在类的头文件里尽量少引入其它头文件 &lt;&lt;Effective Objective-C&gt;&gt;

    与C 和C++ 一样,Objective-C 也使用"头文件"(header file) 与"实现文件"(implementation file)来区隔代码.用 ...

  10. 订单BOM与销售BOM的区别

    訂單BOM: 是實際生產時用的BOM, 在標準BOM和銷售BOM基礎上增減物料的BOM 銷售BOM: 是為特定客戶設定的BOM, 在主檔數據層次上的BOM, 在生產時是帶到訂單BOM中去的. 標準BO ...

随机推荐

  1. django cookie session 自定义分页

    cookie cookie的由来 http协议是无状态的,犹如人生若只如初见,每次都是初次.由此我们需要cookie来保持状态,保持客户端和服务端的数据通信. 什么是cookie Cookie具体指的 ...

  2. 【巨杉数据库SequoiaDB】巨杉数据库 v5.0 Beta版 正式发布

    2020年疫情的出现对众多企业运营造成了严重的影响.面对突发状况,巨杉利用长期积累的远程研发协作体系,仍然坚持进行技术创新,按照已有规划­­推进研发工作,正式推出了巨杉数据库(SequoiaDB) v ...

  3. web服务器的解析漏洞罗列

    前言 服务器相关中间件存在一些解析漏洞,攻击者可通过上传一定格式的文件,被服务器的中间件进行了解析,这样就对系统造成一定危害.常见的服务器解析漏洞涉及的中间件有IIS,apache.nginx等.可利 ...

  4. 牛客寒假训练营2-C算概率

    思路 用 f(i,j) 来表示当前做了i道题,共做对了j道题 状态 f[i][j] = f[i-1][j] * (1-p[i]) + f[i-1][j-1] * p[i] 第一种:由于i-1时对了j题 ...

  5. sqli-labs less-5 --> less-6

    盲注笔记: SQL盲注攻击:只有两种回显结果,错误和正确:无法用url查询爆出数据库的信息:回显注入语句中加入判断方式,使得回显结果为true或者false: SQL盲注分类:布尔盲注,时间盲注,报错 ...

  6. MAT(memory anlayzer tool)使用方法

    Analyzing and understanding the memory use of an application is challenging. A subtle logic error ca ...

  7. ELK学习实验015:日志的自定义index配置

    前面使用json格式收集了nginx的日志,但是再index的显示是filebeat-*,现在使用自定义的index进行配置 但是再使用filebeat的7.4版本以后,有一个巨坑,就是按照网络的很多 ...

  8. codeforces 99999/553 Sultan's Pearls Solution 珍珠 题解

    文章目录 珍珠 题意 分析 增加限定条件 去掉限定条件 Code 珍珠 题意 一共n课珍珠,m颗悬挂,其余在桌子上.如图所示. 仆人每天从某一端"借"一颗珍珠珠.主人每天都会检查悬 ...

  9. react-native构建基本页面5---调用拍照摄像头

    调用摄像头拍照 react-native-image-picker的github官网 yarn add react-native-image-picker 运行react-native link自动注 ...

  10. c# 调用c++类库控制usb继电器

    网上找不到调用此类库的文章,简单写一下,以备后用. 下面是封装后的调用c++类库的类 public class UsbRelayDeviceHelper { /// <summary> / ...