IOS调起H5中文参数乱码问题（不是简单编码）

最新推荐文章于 2023-10-11 19:12:31 发布

MosumLucifer

最新推荐文章于 2023-10-11 19:12:31 发布

阅读量3.2k

点赞数

分类专栏： javascript 文章标签： ios H5 乱码

本文链接：https://blog.youkuaiyun.com/YPJMFC/article/details/81476294

版权

javascript 专栏收录该内容

35 篇文章

订阅专栏

本文针对iOS环境下H5页面因中文参数导致无法加载的问题，介绍了一种通过两次encodeURI编码来解决的方法，并提供了具体实现代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题情景

有一个H5项目涉及到打开新窗口时地址中存在中文参数的情况，经过测试，在android中时可以的，但是在ios中会存在webview都无法打开的情况，也就是说连H5的页面都没有进入窗口就已经卡住了。

基础知识

encodeURI()

把URI字符串采用UTF-8编码格式转化成escape各式的字符串。
encodeURI不编码字符有82个：!，#，$，&，'，(，)，*，+，,，-，.，/，:，;，=，?，@，_，~，0-9，a-z，A-Z

encodeURIComponent()

把URI字符串采用UTF-8编码格式转化成escape格式的字符串。与encodeURI()相比，encodeURI()将对更多的字符编码，比如 / 等字符。所以假如字符串里面包含了URI的几个部份的话，不要用进行编码，否则 / 字符被编码之后URL将呈现错误。
encodeURIComponent不编码字符有71个：!， '，(，)，*，-，.，_，~，0-9，a-z，A-Z

思考

碰到这种情况，立即想到的绝对是乱码问题，经过尝试，把中文参数换成英文，页面可以正常打开，确定了问题原因，自然就是对这个中文参数进行encodeURI编码，ok编码后重新打包，上传，测试，没有效果。。。炸了，怎么办？找ios开发去问，说是编码的问题，你转一下码，我已经转过了，没用。。。后面就陷入一遍遍的尝试中，大多数的网上资料都没有针对性的解决，只强调encodeURI和encodeURIComponent的编码。

解决办法

解决办法就是对url进行两次编码，第一次编码，中文会被转码成16进制，但是每个字符前面会有一个%号，这个%号会被看成转义字符影响浏览器的解析，所以还需要再编码一次。就是这么简单，不懂的话就怎么也解决不了，白白浪费几个小时去做无意义的尝试。

实例

let url = 'https://1234.com.cn/#/?param=中文';
let tempUrl = encodeURI(url);
let encodeUrl = encodeURI(tempurl)