html中汉字乱码怎么解决,如何解决前端页面中文乱码

场景说明

假设需要劫持http响应并在html页面中注入一段js代码后再传回浏览器,实现在浏览器出现一个弹框消息提醒。

 

由于原始html页面编码格式存在UTF-8、GBK等多种编码格式,如果注入的js包含中文消息的话,那么在UTF-8或GBK编码的页面就会有一个出现乱码。有没有办法做到不管是针对GBK、UTF-8编码的页面都能做到正常显示而不会出现乱码哪?

产生乱码的原因

首先来分析一下产生乱码的原因,我们在浏览器看到的信息都是通过图形学手段在显示器上呈现出来的,而实际保存在计算机硬件上的都是0和1(因为计算机实现是基于二进制),那么计算机要显示、传递信息就需要依靠一套规则把一串串的0和1识别为正确的字符,这就是编码。

例如01000001在ASCII编码规则下对应字母A。相同的0/1串,不同的编码解析出的字符一般是不同的,因此如果html页面按照UTF-8的编码解析正常,那么按照GBK的编码解析就会是乱码了。根据上面的示意图,假设注入的js代码为utf-8编码格式,而原始html编码格式也为UTF-8编码格式,那么最终注入这部分中的中文就能正常显示,但是如果原始html为GBK编码,那注入的这部分js代码的中文就会显示乱码。

解决办法

有一种unicode统一编码字符集,目标是把所有文字、字符统一编码,也就是一串0/1组合在unicode字符集下对应的字符是唯一的,不会存在歧义。而js是支持解析unicode字符的,那么就可以在注入js中把要显示的消息统一转换为unicode编码,浏览器端去解析这个unicode编码,这样不管原始html是UTF-8还是GBK,都能正常显示中文。

原始注入js代码关于中文字符的部分

// utf-8编码格式
let message = "中文";

解决乱码的注入js代码关于中文字符的部分

// utf-8编码格式
let message = "\\u4e2d\\u6587";  // 这个编码对应上面的message"中文"

注意:

  1. 注入的js代码仍然是utf-8编码格式,只是消息内容转换为unicode编码的形式;
  2. unicode中0x4e2d表示的0/1串对应汉字”中”,0x6587对应的0/1串对应汉字”文”;
  3. message其实也不是真正的unicode编码,它只是普通的字符串,只是使用了unicode对应的码点(也就是二进制对应的数值),因为可以利用这个码点在浏览器中恢复出正确的字符,事实上unicode字符集并没有规定具体的编码格式。
本站部分内容由互联网用户自发贡献,该文观点仅代表作者本人,本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。

如发现本站有涉嫌抄袭侵权/违法违规等内容,请联系我们举报!一经查实,本站将立刻删除。

(0)

相关推荐

  • 网店如何备案 如何备案网店信息

    随着电子商务的发展,越来越多的网店在互联网上开张营业。但是,对于这些网店来说,备案是一项重要的任务。本文将说明网店如何备案以及如何备案网店信息的必要性。 备案是指向管理机构报备涉及到公共利益或社会稳定的信息,以允许政府机构对其进行监管。对于网店来说,备案可以帮助其建立良好的信誉,保护消费者的权益,遵守法规等。因此,备案是一项必要的步骤,尤其是对于网店来说更是…

    网站建设 2023-05-20
  • 网页设计 最好的公司有哪些(网页设计行业最佳公司排名及评价汇总)

    随着互联网的发展,网页设计成为一个重要的行业。各个公司都在努力进入该市场,以提供更好的服务和吸引更多的客户。鉴于此,这篇文章介绍了网页设计行业最佳公司排名及评价汇总。文章主要从以下四个方面进行详细的阐述:公司排名概述、设计质量评价、顾客反馈和价格对比。 一、公司排名概述 在网页设计行业,有许多公司都有自己独特的风格和方式。这些公司的质量因各种因素而异,但有些…

    网站建设 2023-05-19
  • 怎么在一个城市快速占领市场,企业占领目标市场的方式

    在激烈的市场竞争中,寻求新的发展机遇与玩法成为了品牌突破的关键。 不少品牌借助新的传播方式、渠道以及新商业模式,成功获得了用户的青睐,助力品牌快速占领市场份额。   今天我们就从营销的角度,去探寻新兴品牌快速占领市场之道。 一、聚焦年轻消费者 聚焦年轻消费者,并非流于表面,而是对年轻受众的洞察,去输出那些能够触动年轻人的内容,并与之建立起一种有效的…

    2023-09-07 网站建设
  • 怎么引导初二男生背单词,初中生怎样背单词更容易记住

    学习英语,最头疼的莫过于背诵单词。单词记不住,记不牢、记不稳,英语成绩就无法起来! 解决单词,就是解决英语的根本问题! 英语最大最基础最基层的重点就是单词,基础又普遍又是重中之重,依然是单词! 今天为大家分享【八年级上册单词速记&全脑同步单词《一见@记牢》】系列课程 完整版资料,在文末获取 八年级上册单词速记&全脑同步单词《一见@记牢》 Un…

    2023-09-05
  • 设计师分为哪些(拟定标题:探索设计师职业发展路径及技能要求)

    本文探索设计师职业发展路径及其所需的技能要求。随着时代的发展,设计行业的需求和标准不断变化,设计师需要不断地学习和提高自己的技能,以适应市场的需求,实现个人职业发展的目标。本文主要从四个方面进行阐述:设计师的工作职责及职业发展概述、所需的专业技能、市场需求与趋势、未来职业发展方向和建议。 一、设计师的工作职责及职业发展概述 设计师是负责创造或改善产品、服务或…

    网站建设 2023-05-04
  • 如何配置域名(以域名配置为中心,如何优化网站SEO?)

    作为一个网站拥有者或者管理员,在优化SEO的时候,域名配置是不可或缺的重要因素。正确的域名配置可以为网站带来更好的可访问性和排名。本文将从HTTP/HTTPS协议的选择、域名选择、子域名和www的选择以及域名与目录结构的配置等四个方面出发,详细阐述以域名配置为中心,如何优化网站SEO。 正文: 一、HTTP/HTTPS协议的选择 随着互联网信息时代的发展,人…

    网站建设 2023-05-02
  • 网站域名注册如何填写(《网站域名注册,一步步教你填写正确的信息》)

    本文介绍了一篇名为《网站域名注册,一步步教你填写正确的信息》的文章,该文章详细介绍了如何填写正确的域名注册信息,旨在为读者提供相关背景信息,引起读者的兴趣。 一、成功注册域名的重要性 域名是一个网站的重要组成部分,可以帮助网站打造品牌形象,提升搜索引擎排名,增加网站流量和曝光率。因此,成功注册一个优秀的域名是非常重要的。 在本部分,我们将介绍以下三个方面的内…

    网站建设 2023-05-01
  • 源码交易有哪些(源码交易:探究区块链技术的价值交换方式)

    随着区块链技术的不断发展,源码交易已成为一种新型的价值交换方式。本文将探究区块链技术下的源码交易,介绍其概念、特点和应用,希望引起读者的兴趣。 一、源码交易的概念 源码交易是指在区块链技术下,用于交换编写代码的行为。在传统软件开发中,开发者编写源代码后,会经过编译变成可执行代码。但是,在区块链技术下,源代码本身就具有了价值,可以被交易或转让。 通过区块链技术…

    网站建设 2023-05-22
  • 网站备案信息真实性核验单 如何填写(网站备案真实性核验单填写指南及注意事项)

    网站备案是建立一个符合国家法律规定的网站必须完成的过程。网站备案真实性核验单是在已备案的基础上对网站信息认证的一种方式。本文将为读者介绍网站备案真实性核验单的填写指南及注意事项。内容从四个方面展开,包括核验单的基本内容、填写要求、注意事项及常见问题。 一、基本内容 1、核验单号码:备案管理机构颁发的编号。 2、网站/APP信息:网站/APP的名称、域名、备案…

    网站建设 2023-05-09
  • 163邮箱如何在foxmail使用(如何在Foxmail中设置163邮箱?)

    Foxmail是一款非常受欢迎的邮件客户端软件,而163邮箱是国内最大的免费邮件服务提供商之一。本文将详细介绍如何在Foxmail中设置163邮箱,并提供一些常见问题的解决方案。 一、选择“添加账户”选项 在Foxmail主界面左上角,选择“邮件账户”——“添加账户”,进入设置界面。 二、填写账户信息 在“账户信息”选项卡中,填写你的163邮箱账户信息,包括…

    网站建设 2023-05-05
  • 怎么样攻击百度网站,入侵百度服务器有多难

    在“主页”设置区域中的“地址”文本框中输入自己需要的主页,如这里输入百度的网址为在左侧窗格中选择HKEY_LOCAL_MACHINESOFTWAREMicrosoftInternetExplorer/ Main选项。单击“是”按钮,即可完成数值删除操作,关闭“注册表编辑器”,然后重新启动计算机。当再次使用IE浏览器浏览网页时,就会发现标题栏中的广告等信息已经…

    2023-08-30 网站建设
  • 建站教程02,域名和服务器选择注意事项

    做网站赚钱之前首先我们要学会建设网站,一般建设一个网站需要域名,服务器,和源码程序。   这篇文章视频就简单介绍一下,做一个网站之前我们应该知名样选择域名,服务器和源码程序。     视频教程地址:   视频中服务器购买地址: 腾讯云服务器:   阿里云服务器: 觉得看着不方便,也可以直接下载原视频反复观看。…

    2020-08-02