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字符集并没有规定具体的编码格式。

本文来自投稿,不代表展天博客立场,如若转载,请注明出处:https://www.me900.com/459771.html

(0)

相关推荐

  • 营销软文怎么写 营销软文高效撰写技巧

    营销软文怎么写 营销软文高效撰写技巧 随着互联网的不断发展,营销软文已经成为了各行各业推广产品和服务的重要手段之一。营销软文需要具备吸引力、可读性和说服力,同时还需要遵循一些撰写技巧,以确保文章的高效传播和有效推广。本文将会介绍营销软文的撰写技巧,让读者了解营销软文的特点和对读者的吸引力,从而让文章能够更好地实现营销目标。 一、关注主题的重要性 一个好的营销…

    2023-05-21
  • 电子商务推广怎么做,我花了100万试错总结出来的经验

    电子商务推广怎么做,我花了100万试错总结出来的经验 大家好,我是老胡。 做电商这么多年,花在推广上的钱,保守估计有100万了。有过一天赚十万的高光时刻,也有过一天赔五万的至暗时刻。踩过无数坑,也总结了很多经验。 今天就把这些经验分享给大家,希望能帮做电商的朋友少走点弯路,少花点冤枉钱。 最常见的几个推广误区 先说几个大家最容易踩的坑,也是我当年花了几十万真…

    2026-06-07
  • 淘宝 描述加载中到底怎么回事,做淘宝 描述加载中的延伸问题怎么避坑

    淘宝 描述加载中这事,99% 的玩家都站在了分水岭上——依然在用旧方法论打新仗。这不是危言耸听,是行业供需关系反转后的必然结果。供给端迅速饱和,需求端审美疲劳到了临界点,旧玩法的爆量能力被大大削弱——这是规律,不是观点。理解了这一层,才能看清淘宝 描述加载中为什么会从 1.0 迈入 2.0。 01 淘宝 描述加载中这事,99% 的精力都用错了地方 接下来按这…

    2026-09-01
  • 搓泥宝贝哪个最值得选,遇到搓泥宝贝的问题怎么解决最稳

    聊搓泥宝贝之前,得先把三件事摆在台面上:一,这事的目标是什么;二,达成目标的约束在哪;三,用什么方法切入。三件事不说清,后面写得再细也没用。很多人愿意花时间看具体步骤,却不愿意花十分钟想这三件事,本末倒置。这一节不解决任何具体问题,但这一节是后面六节能不能看懂的前提。 Step 1|聊搓泥宝贝之前,先把三件事说清楚 接下来我们按这五个维度把搓泥宝贝拆开:坑、…

    2026-09-10
  • 什么是信息漏斗 信息漏斗分析法

    信息漏斗是指在线营销中把观众或用户分层,只留下真正对产品或服务有兴趣的用户。通过信息漏斗分析法,可了解目标受众的流动情况,帮助分析用户吸引度和购买转化率。本文将介绍什么是信息漏斗和信息漏斗分析法,包括定义、优点和缺点、使用场景和具体操作方法。 一、什么是信息漏斗? 信息漏斗是指在线营销中根据访客的来源、行为和特征等进行过滤和筛选,只留下真正对产品或服务有兴趣…

    2023-05-23
  • 长沙百度推广公司有哪些公司招聘(长沙推广公司招聘信息速览)

    随着网络营销的广泛应用,长沙推广公司在市场中可以说是一支不可或缺的力量。本文将以长沙推广公司招聘信息速览为中心,从四个方面进行详细阐述。 一、公司背景 长沙推广公司隶属于湖南省创新创业育人实践基地,成立于2016年,是一家综合性的推广公司。公司以专业、专注、高效为理念,以为客户创造价值为目标,拥有一批富有创新精神和创业激情的精英。公司主营业务为网络营销推广、…

    2023-05-12
  • 1688诚信通怎么用效果最好,诚信通一年能赚多少钱

    说到1688,做电商的人应该都知道。它是阿里巴巴旗下的批发平台,也是国内最大的货源采购平台。很多做淘宝、拼多多、抖音的卖家,都是从1688拿货的。而诚信通,就是1688的会员服务。很多人都会问:1688诚信通怎么用效果最好?开通诚信通,一年能赚多少钱?今天我就给大家详细讲讲。 先搞清楚:诚信通到底是什么,有什么用 很多人对诚信通有误解,觉得只要开通了诚信通,…

    2026-06-02
  • 一个论坛应该具备哪些基本条件(「建立一个优质的论坛:从基本条件到用户体验」)

    在当今社交媒体越来越普及的背景下,论坛仍然是一个非常有价值的社区平台。建立一个优质的论坛需要关注以下方面:基本条件、内容管理、互动机制和用户体验。本文将从这四个方面详细阐述建立优质论坛的方法和技巧。 正文: 一、基本条件 为了建立一个优质论坛,基本的技术和资源是必要的。首先,需要选择一个靠谱的论坛平台,如Discuz、PHPWind等。此外,还需要购买一个可…

    2023-05-02
  • 什么是sem营销 sem营销技巧改善策略

    SEM营销是一种有效的数字营销策略,可以帮助企业提高其在线曝光度,吸引更多客户并增加销售额。本文将从以下四个方面详细探讨什么是SEM营销,SEM营销技巧以及改善策略,包括优化关键词、创造有效的广告文案、提高网站质量得分以及不断测试和优化。 一、优化关键词 SEM营销的首要任务是确定适当的关键词,并将其集中在广告文案、网站和营销材料中。为了最大程度地提高点击率…

    2023-05-17
  • 淘宝时尚男装店铺怎么选,学生党如何找到性价比高的男装店

    淘宝时尚男装店铺怎么选,学生党如何找到性价比高的男装店 男生买衣服,其实是个挺头疼的问题。 很多男生要么不逛淘宝,一逛就踩坑。看着图片挺好看的,买回来质量差得要死,穿两次就变形起球。要么就是只会买那几个大众牌子,穿出去到处撞衫,尴尬得不行。 先搞清楚男装店铺的几种类型 淘宝上的男装店铺千千万,但是大体可以分成几种类型,每种都有自己的特点,适合不同的人群。 第…

    2026-06-08
  • 第三方网络销售平台有哪些 第三方网络销售平台比较、评价、推荐

    第三方网络销售平台比较、评价和推荐 随着互联网的不断发展,越来越多的企业和消费者选择使用第三方网络销售平台来完成商品交易。这些平台不仅提供了安全的交易环境,还为卖家和买家之间提供了更好的交流渠道。本文将介绍一些主流的第三方网络销售平台,并对它们进行比较、评价和推荐。 一、主流第三方网络销售平台介绍 1. 京东 京东是中国的一家知名电商平台,成立于2004年,…

    2023-05-19
  • sip服务器,sip服务器

    《关于sip服务器的深入探讨》 一、sip服务器的基本概念 sip服务器,也许可以简单理解为在通信领域中起着关键作用的一种服务器。它就像是一个通信的中转站,负责处理和协调语音、视频等多媒体通信的相关事宜。我觉得它就像是一个繁忙的交通枢纽,各种通信请求就像是来来往往的车辆,而sip服务器则负责指挥和调度这些“车辆”的通行。 在现代的通信网络中,sip服务器扮演…

    2025-09-18