浏览器处理由带BOM的utf-8格式的php文件输出的HTML问题

今天编写web程序时出现一个Bug，如下面两个图所示：

在源代码中，代码的结构是没有问题的，而Firefox将1/2/3/25/26行标记为红色，意思是说有问题。再到Firebug中一看，发现本应该在head部分的meta/title/script/style等标签，全都跑到了body下面！这是怎么回事儿呢？用validator.w3.org一验证，发现一条错误说：

这一个character "" not allowed in prolog的错误，标记的红色在<!DOCTYPE的前面，到底是什么意思？

经过研究，发现问题的根源在我一个引用的PHP文件中。这个PHP文件是utf-8的，而且是直接用记事本另存的，这样就产生了传说中的BOM（Byte Order Maker）。BOM头导致了在各浏览器中解析HTML，出现错误！！

以下是从http://blog.sina.com.cn/s/blog_669fb0c30100vvf4.html 复制过来的文字，学习一下。

最近在写php时，莫名其妙的浏览器头多出一行空行，在网上搜索一下，大致都是把文件保存为非BOM的UTF-8格式

在本地也解决了，但是上传到服务器依然有空行，搞了一个上午，都快崩溃了，最后决定自己想办法解决，经过几个小时的摸索终于有了完美解决方法了。
运用php显示缓冲区显示原理，成功去掉
在php的头上加一行ob_start(); 然后再模板显示前加个ob_end_clean(); 在模板显示后加个ob_end_flush();
这样问题就解决了，现在给出整体结构实例代码：

复制代码代码如下:

<?php
ob_start(); //此处为php逻辑操作
ob_end_clean(); //此处为php模板显示
ob_end_flush();
?>

其它网友的补充：
开发中一直没办法解决的一个问题，收藏
　　页面采用UTF8编码，头部和尾部用了模板包含文件的方法，结果头部和尾部无端端各多出一个约10px的空行，什么也没有。
　　原因是全部采用utf8编码，包含文件的时候，最后的二进制流中包含了多次UTF8 BOM标记，IE不能正常解析包含多个UTF8 BOM 标记的页面，直接替换成实际显示的回车，这样导致一个空行，而firefox却没有这个问题。
　　故如果模板采用包含的方法包含多个utf8文件需要用ultraedit保存时另存为功能选择utf8 无bom格式保存即可。
　　另外，如果中文页面在html head标记中将title标记放在<meta http-equiv=”content-type” content=”text/html; charset=UTF-8″ />前面会导致页面空白。
　　所以utf8页面应该使用标准顺序

复制代码代码如下:

BOM头：\xEF\xBB\xBF，PHP4、5尚对BOM无视，所以在解析前直接输出。
对此 w3.org 标准 FAQ 中对此问题有一个专门的描述：

http://www.w3.org/International/questions/qa-utf8-bom

具体如下:

在UCS 编码中有一个叫做”ZERO WIDTH NO-BREAK SPACE”的字符，它的编码是FEFF。而FFFE在UCS中是不存在的字符，所以不应该出现在实际传输中。UCS规范建议我们在传输字节流前，先传输字符”ZERO WIDTH NO-BREAK SPACE”。这样如果接收者收到FEFF，就表明这个字节流是Big-Endian的；如果收到FFFE，就表明这个字节流是Little- Endian的。因此字符”ZERO WIDTH NO-BREAK SPACE”又被称作BOM。

UTF-8不需要BOM来表明字节顺序，但可以用BOM来表明编码方式。字符”ZERO WIDTH NO-BREAK SPACE”的UTF-8编码是EF BB BF。所以如果接收者收到以EF BB BF开头的字节流，就知道这是UTF-8编码了。

Windows就是使用BOM来标记文本文件的编码方式的操作系统: WindowsXP Professional , 缺省字符集：中文

1） notepad ：可以自动识别出没有带 bom 的 utf-8 编码格式文件，但不可以控制保存文件时是否添加 bom ，如果保存文件，那么会统一添加 bom 。

2）editplus ：不能自动识别出没有 bom 的 utf-8 编码格式文件，文件保存时，选择UTF-8 格式，不会在文件头写上 BOM header.

3） UltraEdit ：对于字符编码的功能最为强大，可以自动识别带 bom 和不带 bom 的 utf-8 文件（可以配置）；保存的时候可以通过配置选择是否添加 bom.

（特别需要注意的是，保存一个新建立的文件时，需要选择另存为 utf-8 no bom 格式）

后来发现 Notepad ++ 也对于 utf-8 bom 支持比较好，推荐大家使用。

1、Dreamweaver中除去BOM的方法：ctrl+J -> 标题/编码 -> 取消”包括Unicode签名(BOM)”选择。

BOM信息是文件开头的一串隐藏的字符，用于让某些编辑器识别这是个UTF-8编码的文件。但PHP在读取文件时会把这些字符读出，从而形成了文件开头含有一些无法识别的字符的问题。

比如用UTF-8格式保存的生成图片的PHP文件，因为文件头隐藏的BOM信息也被下发，导致生成的图片数据不对，浏览器无法识别。

要检测一个UTF-8文件是否含有BOM信息，就是检测文件开头的字三个符，是否为0xEF, 0xBB, 0xBF。下面这个小程序，用户遍历某个目录下所有文件，并检测是否加了BOM。

将以下代码另存为del_bom.php，修改需要检测的目录后运行。这样可能有助于检测是哪个文件带有了BOM信息导致所有页面开头都有那么一段空白。

<? php
//此文件用于快速测试UTF8编码的文件是不是加了BOM，并可自动移除
//By Bob Shen
$basedir="."; //修改此行为需要检测的目录，点表示当前目录
$auto=1; //是否自动移除发现的BOM信息。1为是，0为否。
//此文件用于快速测试UTF8编码的文件是不是加了BOM，并可自动移除
//By Bob Shen
$basedir="."; //修改此行为需要检测的目录，点表示当前目录
$auto=1; //是否自动移除发现的BOM信息。1为是，0为否。
//以下不用改动
if ($dh = opendir($basedir)) {
while (($file = readdir($dh)) !== false) {
if ($file!='.' && $file!='..' && !is_dir($basedir."/".$file)) echo "filename: $file ".checkBOM("$basedir/$file")." ";
}
closedir($dh);
}
function checkBOM ($filename) {
global $auto;
$contents=file_get_contents($filename);
$charset[1]=substr($contents, 0, 1);
$charset[2]=substr($contents, 1, 1);
$charset[3]=substr($contents, 2, 1);
if (ord($charset[1])==239 && ord($charset[2])==187 && ord($charset[3])==191) {
if ($auto==1) {
$rest=substr($contents, 3);
rewrite ($filename, $rest);
return ("BOM found, automatically removed.");
} else {
return ("BOM found.");
}
}
else return ("BOM Not Found.");
}
function rewrite ($filename, $data) {
$filenum=fopen($filename,"w");
flock($filenum,LOCK_EX);
fwrite($filenum,$data);
fclose($filenum);
}
?>

posted on 2012-11-04 17:30 pinocchioatbeijing 阅读(2603) 评论(0) 编辑收藏举报

刷新页面返回顶部

pinocchioatbeijing

浏览器处理由带BOM的utf-8格式的php文件输出的HTML问题

公告

导航