`

引用外部JS文件的编码问题

    博客分类：
  • js
 
阅读更多

昨天帮同事解决的一个问题,GBK的页面(不要问我为什么GBK,因为GBK,所以GBK),引用了Google map的API, 但是由于GoogleMap API返回的js脚本是utf-8的,所以导致在IE下, 浏览器无法正确解析.

这个问题,总的来说,可以用下图描述(原谅我的美术水平):

问题图

问题图

也就是, 由于服务器中生成的HTML是基于gbk编码的, 并且由于Apache的DefaultCharset(后叙), 所以导致IE会以gbk编码去解析从外部引入的GoogleMap js,那肯定是不能正确解释的.

浏览器判断一个页面的编码有俩个途径, 一种是通过HTTP响应头,

    

  1. HTTP/1.x 200 OK
    2. 

  2. Date: Sat, 18 Oct 2008 21:53:51 GMT
    3. 

  3. Server: Apache/2.0.52 (Red Hat)
    4. 

  4. X-Powered-By: PHP/5.3.0alpha2
    5. 

  5. Connection: close
    6. 

  6. Transfer-Encoding: chunked
    7. 

  7. Content-Type: text/html; charset=GB2312
    8.

注意最后一行, 这个是由HTTP头部指明的页面编码格式.
另外一种就是我们常见的, 也会另很多初学者困惑的meta:

    

  1.   <head>

    2. 

  2.   <meta
 http-equiv
=
"Content-Type"
 content
=
"text/html; charset=UTF-8"
 />

    3. 

  3.   <title>
风雪之隅 </title>

    4. 

  4.   </head>

    5. 

  5.  
    6.

问题就在于,没有一个统一的标准,来指明这俩中方式的优先级, 不同的浏览器有着不同的优先级策略.这也就是为什么,我们在FF下正常浏览的页面,在IE下会乱码的原因.
我之前的文章Apache的Charset设置 中已经介绍过了在Apache下设置DefaultCharset以后产生的影响,

这个问题已经遇到过俩次了，就是页面中明确指明了编码是UTF8,但是显示是乱码。

虽然知道解决方法，也知道是Apache的原因，但是一直没有去找其所以然，今天趁机，就研究了一下。

1. 页面没有指定charset ， Apache配置defaultcharst gbk , 页面文件编码是utf-8

结果: 乱码，使用wireshark抓包，发现服务器返回的header中指明了:

    

  1. 
Content-Type
:
text/html
;
charset
=
GBK
    2.

结论：当页面没有指明charset的时候，Apache的defaultcharset起作用

2. 页面指定charset为utf-8, Apache配置defaultcharset gbk. 页面文件是utf-8

    

  1. 
<head>

    2. 

  2.         <meta
 http-equiv
=
"Content-Type"
 content
=
"text/html; charset=utf-8"
 />

    3. 

  3. 
</head>

    4. 

  4. 
<body>

    5. 

  5.         <div
 id
=
"page-header"
>

    6. 

  6.          测试Apache DefaultCharset
    7. 

  7.         </div>

    8. 

  8. 
</body>

    9. 

  9. 
</html>

    10.

结果还是出现乱码。

结论：当Apache配置了DefaultCharset, 将忽略页面的charset申明。

3 PHP header申明charset为utf8, Apache配置defaultcharst gbk,页面文件编码是utf8

    

  1. 
header
(
"Content-Type:text/html; charset=utf-8"
);

    2.

结果 ： 页面显示正常。

4 Apache设置DefaultCharset off

结果，页面显示正常。

翻阅了下Apache2的手册：

    

  1. AddDefaultCharset指令
    2. 

  2. 说明当应答内容是text/plain
或text/html
时，在HTTP应答头中加入的默认字符集
    3. 

  3. 语法AddDefaultCharsetOn|
Off|
charset
    4. 

  4. 默认值AddDefaultCharsetOff
    5. 

  5. 作用域serverconfig,
virtualhost,
directory,.
htaccess
    6. 

  6. 覆盖项FileInfo
    7. 

  7. 状态核心(
C)

    8. 

  8. 模块core
    9. 

  9.  
    10. 

  10. 当且仅当应答内容是text/plain
或text/html
时，此指令将会在HTTP应答头中加入的
    11. 

  11. 默认字符集。理论上这将覆盖在文档体中通过<
meta>
标 签指定的字符集，但是实际
    12. 

  12. 的行为通常取决于用户浏览器的设置。AddDefaultCharsetOff将会禁用此功能。 
    13. 

  13.  
    14. 

  14. AddDefaultCharsetOn将启用Apache内部的默认字符集iso-8859-1
。您
    15. 

  15. 也可以指定使用在IANA注册过的字符集名字 中的另外一个charset。
    16. 

  16. 比如说：
    17. 

  17. AddDefaultCharsetutf-8

    18.

也就是说，当Apache不指定defaultcharset的时候，页面编码由页面自己的meta标签指定。

当Apache指定的时候，将忽略页面中的meta标签指定的编码. 但是容许脚本直接header编码方式给客户端

最后，还有一个问题没有得出结果：

当Apache和页面都没有指定的时候， 又如何？

我在自己的机器上，如果都不指定， 默认还是utf8

在服务器端生成response内容以后, 如果脚本没有显示的调用header发送编码申明,那么Apache就会根据DefaultCharset生成响应HTTP头部的Content-type中的charset字段;
反之如果脚本显示申明了,那么就会按照脚本header申明中的charset设置.

这样到了浏览器端以后, 浏览器就可以根据HTTP头的charset申明来按照特定的编码格式解析获取到的HTML代码,但现在的问题是, 页面是GBK的,但是引用的外部js文件是utf8编码的,这样的情况, 我们可以使用一个script的属性来解决:

    

  1.   <script
 language
=
'javascript'
 
src
=
'....'
  
charset
=
'utf-8'
></script>

    2.


分享到：
| linux学习笔记-近期整理的linux命令
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    引用外部js乱码问题分析及解决方案

    在web开发中我们一般都会不可避免的使用js。...所以我们只需要同意页面和js编码就可以解决乱码问题： 对于GBK页面引用编码为UTF-8编码的JavaScript文件如果出现乱码问题，可以使用下面的代码来解决 代码如下: ＜s

    ASP.NET javascript时间乱码问题

    2. **设置JavaScript文件编码**：如果你的JavaScript代码是在外部文件中，需要确保该文件的编码与ASP.NET页面一致。你可以通过编辑器（如Notepad++或Visual Studio）的“另存为”选项将文件编码转换为UTF-8。 3. **...

    asp.net后台代码动态引用添加JS和css文件

    与动态添加CSS类似，我们也可以创建一个`HtmlGenericControl`对象来表示`&lt;script&gt;`标签，并通过设置`src`属性引用外部的JavaScript文件。同样，利用`AddAt()`方法将`myJs`控件添加到页面头部，确保在页面加载时能够...

    解决JS请求服务器gbk文件乱码的问题

    在JavaScript（JS）中，当从服务器获取编码格式为GBK（Chinese Internal Code Specification，也称为GB2312）的文件时，可能会遇到乱码问题。这是因为默认情况下，AJAX（Asynchronous JavaScript and XML）请求通常...

    从外部的js文件中获取ASPX页面的控件ClientID

    在ASP.NET开发中，有时我们需要在外部JavaScript文件中操作ASPX页面上的控件。由于ASP.NET自动生成的ClientID机制，当控件位于MasterPage或UserControl中时，它们的ClientID可能会变得复杂，如“ctl00_...

    如何解决页面和脚本其中一个是乱码的问题

    2. **脚本文件的编码**：对于外部JavaScript文件（如`test.js`），确保其保存时的编码格式与网页一致。大多数IDE都支持设置文件编码，例如在Eclipse中，可以通过“Properties”-&gt;“Resource”-&gt;“Text File Encoding...

    js国际化、读取preperties文件信息

    在JavaScript中，读取`.properties`文件通常是通过异步方式完成的，因为这些文件通常不会被嵌入到HTML或JavaScript源代码中，而是作为外部资源加载。下面我们将深入探讨如何使用JavaScript以及相关的库（如jQuery和`...

    js直接调用exe传参

    ### js直接调用exe传参 #### 背景与目的 在Web开发过程中，有时候我们需要从HTML页面通过JavaScript（简称JS）来调用本地的应用程序，并传递参数给这些应用程序。这种需求通常出现在需要与本地资源进行交互或者执行...

    html页面乱码问题总结

    4. **外部资源编码问题**：HTML页面可能引用了外部资源，如JavaScript文件、CSS文件或图片的alt标签。如果这些资源的编码与HTML页面不一致，也可能引发乱码。 5. **浏览器兼容性**：不同浏览器对编码的处理可能存在...

    关于asp.net中中文产生乱码问题

    解决 ASP.NET 中的中文乱码问题，关键在于确保服务器端和客户端的编码设置一致，同时也要注意外部资源文件的编码格式。通过上述方法的综合运用，可以有效避免中文乱码现象的发生，确保用户能够正常浏览含有中文内容...

    bpmn-js汉化文件.zip

    汉化BPMN-JS主要涉及到用户界面的文本和提示信息，通常这些信息存储在JavaScript文件或外部资源中。在这个压缩包中，包含了`PaletteProvider.js`和`ContextPadProvider.js`两个关键文件，它们分别负责工具箱...

    htm 问题 打不开 文件

    如果文件编码与浏览器期望的编码不匹配，内容可能会显示为乱码。检查文件的编码格式（例如UTF-8、GBK等），并在浏览器中设置相应的编码。 3. **文件损坏**：如果HTML文件在传输或存储过程中受损，可能导致文件无法...

    js手写签名源代码含js文件

    JavaScript代码可以直接嵌入HTML中，也可以通过外部.js文件引用。此项目中的"js手写签名"就是JavaScript实现的一个功能模块。 2. ECMAScript：ECMAScript是JavaScript的标准化规范，由欧洲计算机制造商协会（ECMA）...

    引入JS文件IE6报语法错误或缺少对象问题的解决方法

    这个问题在于文件编码上，如果JS文件编码与当前页面的编码不一致，就可能导致在IE6中页面不能正常获取和解析JS文件中的内容，在IE6中，默认引入的文件和页面的编码是一致的。在IE6+以上的浏览器中，一般浏览器会自动...

    js 日历 js日历 例子 javascript日历

    因此，在编写JavaScript和HTML时，需要确保文件编码与页面声明的字符集相匹配，以避免乱码问题。 在提供的压缩包中，有三个文件： 1. **用法demo.html**：这很可能是展示日历组件如何在实际网页中使用的示例。在这...

    JSFinder js文件中提取URL，子域名的工具。

    JSFinder 是一款强大的工具，专为网络安全专家和渗透测试人员设计，用于在JavaScript（js）文件中高效地搜索和提取URL以及子域名信息。这款工具的出现极大地简化了在黑盒测试过程中对网站架构和潜在漏洞的分析工作。...

    Js,alert出现乱码问题的解决方法

    这种做法可以确保在引用外部JavaScript文件时，告诉浏览器该文件使用的字符编码，从而正确地解析文件中的中文字符。这一点对于防止在包含alert()函数的JavaScript文件加载时出现乱码至关重要。需要注意的是，早期的...

    pdf.js预览pdf文件流（base64)pdf源码已更改 带测试

    在这个场景中，"pdf.js预览pdf文件流（base64）"指的是利用PDF.js库来处理以Base64编码的PDF文件数据，而不是传统的文件路径方式。 Base64是一种编码方法，可以将二进制数据转换为ASCII字符串，方便在网络上传输。...

    js 拼音输入法，欢迎指正

    2. **JavaScript文件编码**：检查并确保所有JavaScript文件本身也是用UTF-8编码的。如果你使用文本编辑器打开这些文件，通常可以在保存选项中选择编码类型。 3. **服务器配置**：如果你的网页是从服务器上加载的，...

    文件编码转换/Screnc加解密/简繁转换 1.0

    文件编码转换/Screnc加解密/简繁转换 1.0 作者：Lael QQ：63778683 E-mail：xian_001@hotmail.com 使用注意： 1、使用前请备份，使用本软件造成的损失自负； 2、进行编码转换前请确认所有文件的源编码一致并选择...

Magicbox
Global site tag (gtag.js) - Google Analytics