用JavaScript实现PHP的urlencode与urldecode函数

2023-12-27 09:38

本文主要是介绍用JavaScript实现PHP的urlencode与urldecode函数,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

本文介绍了php函数urlencode的js实现方法并比较js和php各编码函数的区别。

通常form表单的enctype类型为 application/x-www-form-urlencoded, 当表单提交后,提交的数据自动被编码, 规则为" 除了 -_. 之外的所有非字母数字字符都将被替换成百分号(%)后跟两位十六进制数,空格则编码为加号(+)。", php的urlencode函数与其功能相同。

  1. js编码方法

js编码方法:escape, encodeURI, encodeURIComponent。
escape可以对大多数符号进行编码,但是对unicode字符无效。

2.php编码方法

php编码方法:urlencode, rawurlencode, htmlentities。
urlencode和rawurlencode唯一的区别是对空格的编码方式不同,rawurlencode遵循RFC 1738编码将空格转换为
%20。

如何用js实现php的urlencode功能,从网上找了两种方法,在这里整合出来

  1. 方法一
export default {// public method for url encodingencode : function (clearString) {var output = '';var x = 0;clearString = utf16to8(clearString.toString());var regex = /(^[a-zA-Z0-9-_.]*)/;while (x < clearString.length){var match = regex.exec(clearString.substr(x));if (match != null && match.length > 1 && match[1] != ''){output += match[1];x += match[1].length;}else{if (clearString[x] == ' ')output += '+';else{var charCode = clearString.charCodeAt(x);var hexVal = charCode.toString(16);output += '%' + ( hexVal.length < 2 ? '0' : '' ) + hexVal.toUpperCase();}x++;}}function utf16to8(str){var out, i, len, c;out = "";len = str.length;for(i = 0; i < len; i++){c = str.charCodeAt(i);if ((c >= 0x0001) && (c <= 0x007F)){out += str.charAt(i);}else if (c > 0x07FF){out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));out += String.fromCharCode(0x80 | ((c >>  6) & 0x3F));out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));}else{out += String.fromCharCode(0xC0 | ((c >>  6) & 0x1F));out += String.fromCharCode(0x80 | ((c >>  0) & 0x3F));}}return out;}return output;},// public method for url decodingdecode : function (encodedString) {var output = encodedString;var binVal, thisString;var myregexp = /(%[^%]{2})/;function utf8to16(str){var out, i, len, c;var char2, char3;out = "";len = str.length;i = 0;while(i < len){c = str.charCodeAt(i++);switch(c >> 4){case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7:out += str.charAt(i-1);break;case 12: case 13:char2 = str.charCodeAt(i++);out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F));break;case 14:char2 = str.charCodeAt(i++);char3 = str.charCodeAt(i++);out += String.fromCharCode(((c & 0x0F) << 12) |((char2 & 0x3F) << 6) |((char3 & 0x3F) << 0));break;}}return out;}while((match = myregexp.exec(output)) != null&& match.length > 1&& match[1] != ''){binVal = parseInt(match[1].substr(1),16);thisString = String.fromCharCode(binVal);output = output.replace(match[1], thisString);}//output = utf8to16(output);output = output.replace(/\\+/g, " ");output = utf8to16(output);return output;}
}
  1. 方法二
export default {// public method for url encodingencode : function (string) {return escape(this._utf8_encode(string));},// public method for url decodingdecode : function (string) {return this._utf8_decode(unescape(string));},// private method for UTF-8 encoding_utf8_encode : function (string) {string = string.replace(/\r\n/g,"\n");var utftext = "";for (var n = 0; n < string.length; n++) {var c = string.charCodeAt(n);if (c < 128) {utftext += String.fromCharCode(c);}else if((c > 127) && (c < 2048)) {utftext += String.fromCharCode((c >> 6) | 192);utftext += String.fromCharCode((c & 63) | 128);}else {utftext += String.fromCharCode((c >> 12) | 224);utftext += String.fromCharCode(((c >> 6) & 63) | 128);utftext += String.fromCharCode((c & 63) | 128);}}return utftext;},// private method for UTF-8 decoding_utf8_decode : function (utftext) {var string = "";var i = 0;var c = c1 = c2 = 0;while ( i < utftext.length ) {c = utftext.charCodeAt(i);if (c < 128) {string += String.fromCharCode(c);i++;}else if((c > 191) && (c < 224)) {c2 = utftext.charCodeAt(i+1);string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));i += 2;}else {c2 = utftext.charCodeAt(i+1);c3 = utftext.charCodeAt(i+2);string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));i += 3;}}return string;}
}

这篇关于用JavaScript实现PHP的urlencode与urldecode函数的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/542697

相关文章

SpringBoot 获取请求参数的常用注解及用法

《SpringBoot获取请求参数的常用注解及用法》SpringBoot通过@RequestParam、@PathVariable等注解支持从HTTP请求中获取参数,涵盖查询、路径、请求体、头、C... 目录SpringBoot 提供了多种注解来方便地从 HTTP 请求中获取参数以下是主要的注解及其用法:1

HTTP 与 SpringBoot 参数提交与接收协议方式

《HTTP与SpringBoot参数提交与接收协议方式》HTTP参数提交方式包括URL查询、表单、JSON/XML、路径变量、头部、Cookie、GraphQL、WebSocket和SSE,依据... 目录HTTP 协议支持多种参数提交方式,主要取决于请求方法(Method)和内容类型(Content-Ty

深度解析Java @Serial 注解及常见错误案例

《深度解析Java@Serial注解及常见错误案例》Java14引入@Serial注解,用于编译时校验序列化成员,替代传统方式解决运行时错误,适用于Serializable类的方法/字段,需注意签... 目录Java @Serial 注解深度解析1. 注解本质2. 核心作用(1) 主要用途(2) 适用位置3

QT Creator配置Kit的实现示例

《QTCreator配置Kit的实现示例》本文主要介绍了使用Qt5.12.12与VS2022时,因MSVC编译器版本不匹配及WindowsSDK缺失导致配置错误的问题解决,感兴趣的可以了解一下... 目录0、背景:qt5.12.12+vs2022一、症状:二、原因:(可以跳过,直奔后面的解决方法)三、解决方

深入浅出Spring中的@Autowired自动注入的工作原理及实践应用

《深入浅出Spring中的@Autowired自动注入的工作原理及实践应用》在Spring框架的学习旅程中,@Autowired无疑是一个高频出现却又让初学者头疼的注解,它看似简单,却蕴含着Sprin... 目录深入浅出Spring中的@Autowired:自动注入的奥秘什么是依赖注入?@Autowired

Spring 依赖注入与循环依赖总结

《Spring依赖注入与循环依赖总结》这篇文章给大家介绍Spring依赖注入与循环依赖总结篇,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧... 目录1. Spring 三级缓存解决循环依赖1. 创建UserService原始对象2. 将原始对象包装成工

Java中如何正确的停掉线程

《Java中如何正确的停掉线程》Java通过interrupt()通知线程停止而非强制,确保线程自主处理中断,避免数据损坏,线程池的shutdown()等待任务完成,shutdownNow()强制中断... 目录为什么不强制停止为什么 Java 不提供强制停止线程的能力呢?如何用interrupt停止线程s

MySQL中On duplicate key update的实现示例

《MySQL中Onduplicatekeyupdate的实现示例》ONDUPLICATEKEYUPDATE是一种MySQL的语法,它在插入新数据时,如果遇到唯一键冲突,则会执行更新操作,而不是抛... 目录1/ ON DUPLICATE KEY UPDATE的简介2/ ON DUPLICATE KEY UP

Python中Json和其他类型相互转换的实现示例

《Python中Json和其他类型相互转换的实现示例》本文介绍了在Python中使用json模块实现json数据与dict、object之间的高效转换,包括loads(),load(),dumps()... 项目中经常会用到json格式转为object对象、dict字典格式等。在此做个记录,方便后续用到该方

SpringBoot请求参数传递与接收示例详解

《SpringBoot请求参数传递与接收示例详解》本文给大家介绍SpringBoot请求参数传递与接收示例详解,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋... 目录I. 基础参数传递i.查询参数(Query Parameters)ii.路径参数(Path Va