[081015] 为 Firebug 修复外部编辑器的乱码 Bug……
屈超(沙滩凉鞋) 发表于 2008 年 10月 15 日 20 时 13 分
如果你看过我的上一篇文章……
应该已经了解我要解决的这个 Bug 究竟是怎么一回事儿……
很不幸 Firefox 和 Firebug 都有类似 Bug ……
也即在外部编辑器中查看网页 HTML 源码的乱码问题……
该 Bug 在 Firebug 的历代版本中均存在……
除了 Windows 我也在 Mac 版上发现了该 Bug ……
但与 Firefox 本身的问题不同……(见我前一篇文章)
Firebug 采取的另外一种方式来处理……
但显然也没能够逃脱产生乱码的“厄运”……
Bug 具体的描述如下……
如果你通过 Firebug 的菜单命令配置过外部编辑器……
(Tools -> Firebug -> Open With Editor -> Configure Editors)
那么配置完毕后将在你的右键上下文菜单中显示 Open With Editor 命令组……(如下图)

通过这个命令组……
你可以选择不同的编辑器对当前的网页源码进行查看和编辑……
确实非常便捷……
但是……
当你想用 Firebug 的这一功能查看任何包含有非 ASCII 字符的网页时……
你则可能遇到下面两种问题……
第一种……
当你想要查看任何包含非 ASCII 字符的线上页面源码时……
你可以正常打开它……(因为 Firebug 用 ascii 字符命名 tmp 文件)
但你看到的内容将是存在乱码的……(如下图)

第二种……
当你把一个文件名中包含非 ASCII 字符的文件拖进 Firefox ……
并想要查看其源码时……
你的编辑器却连文件都无法打开……(如下图)

研究 Firebug 源码后得知……
对于第一种情况……
是由于 Firebug 没有对 Unicode 的源码进行转码所致……
而第二种情况……
则是因为 Firebug 在向编辑器发送命令行参数时没有对文件名进行转码……
(如果你还想追问我为何 Firebug 的源码面板没有乱码……
我可以顺便告诉你:因为这些流程都在 Firefox 内部……)
知道了造成 Bug 的原因……
我们就可以操刀开始解决了……
对于第一种情况……
只需要将其转为 UTF-8 编码即可……
打开 profile\extensions\firebug@software.joehewitt.com\content\firebug\firebug.js 文件……
搜索:
- temporaryFiles.push(file.path);
在其下方添加代码:
- // Hacked by Chappell.Wat @ QuChao.com on 2008-10-14 start
- data = convertFromUnicode('UTF-8', data);
- // Hacked by Chappell.Wat @ QuChao.com on 2008-10-14 end
对于第二种情况……
则稍微复杂一点……
因为通过命令行发送参数到系统时需要根据系统的 non-unicode 默认编码来转码……
(由于条件所限我这里仅针对 Windows 进行修改)
比如我虽然使用英文系统……
但是为了完美支持中文我将字符集改成了 936 ……
那么我就需要将那个“乱码”文件名转为 GB2312 或 GBK……
其它语言的用户请按情况修改……(如果你看得懂的话)
同样是打开 profile\extensions\firebug@software.joehewitt.com\content\firebug\firebug.js ……
搜索:
- args.push(localFile);
在其下方添加代码:
- // Hacked by Chappell.Wat @ QuChao.com on 2008-10-14 start
- if ('WINNT' === getPlatformName()) {
- localFile = convertFromUnicode('GB2312', localFile);
- }
- // Hacked by Chappell.Wat @ QuChao.com on 2008-10-14 end
这样就大功告成了……
自动判断系统 non-unicode 默认编码的方法我已经找到……
有待我测试后更新……
在此之前请各位还是手动修改吧……
@081015 更新:
我今天测试的时候发现……
某些情况下 Firebug 的代码并不能完全处理 UTF8 的 BOM 头……
所以我们再写一段代码来自己清除它……
打开 profile\extensions\firebug@software.joehewitt.com\content\firebug\lib.js ……
搜索:
- var segments = [];
在其下方添加代码:
- // Hacked by Chappell.Wat @ QuChao.com on 2008-10-15 start
- var fileLen = stream.available();
- if ('UTF-8' === charset && fileLen > 3) {
- var bom = sis.readBytes(3);
- if (String.fromCharCode(239, 187, 191) !== bom) {
- segments.push(bom);
- }
- }
- // Hacked by Chappell.Wat @ QuChao.com on 2008-10-15 end
不过这样做是否会有什么副作用我暂时还不知道……
是否修改就看你个人选择了……
最后……
为懒人们提供修改完成的版本……(v1.2.1)
不堪乱码困扰的你一定要下载……
Bug 我也会提交到 Firebug 的官方讨论组……
希望以后不用劳烦我们自己修改就能避开这种恼人的问题……
国外: http://www.quchao.com/projects/mozilla/firefox/extension/firebug-1.2.1-fx_fixed_by_quchao.xpi
国内: http://vip.yyjoy.com/chappell/mozilla/firefox/extension/firebug-1.2.1-fx_fixed_by_quchao.xpi


時計坂一刻館三号室 » 部落格存档 » [081011] View Source in External Editor Bugfixer 0.9b …… 的评论内容:
2008 年 10月 15 日 20 时 21 分
[…] [080725] SingletonFox 1.2 -Firefox Extension-单实例运行 [081015] 为 Firebug 修复外部编辑器的乱码 Bug…… […]
陈成的博客 — 前端开发大众手册(包括工具、网址、经验等) 的评论内容:
2008 年 10月 25 日 20 时 25 分
[…] Firebug —— 这个不用介绍了吧,附空帏的外部编辑器乱码修正版 […]