用JavaScript实现PHP的urlencode与urldecode函数


Posted in Javascript onAugust 13, 2015

很多朋友说JavaScript的decodeURI函数也可以实现,但有bug所有呢,下面看下下面的函数,经过测试使用暂时没什么问题,我在之前的文章说过,这个和php的urldecode函数根本不是一回事。下面是我根据高人的代码改写的JavaScript版的urldecode函数,参考的链接在开头提到的文章中有,就不一一列举了。和之前的urlencode函数一样,只实现了utf-8版的。

1、urlencode

使用方法: urlencode(str);

function urlencode(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;
}

2、urldecode

使用方法:urldecode(url);

function urldecode(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;
}

当服务器端通过php的urlencode转码的就可以使用js的urldecode进行解析即可。

Javascript 相关文章推荐
JavaScript 嵌套函数指向this对象错误的解决方法
Mar 15 Javascript
jquery 操作DOM案例代码分享
Apr 05 Javascript
实用的Jquery选项卡TAB示例代码
Aug 28 Javascript
框架页面高度自动刷新的Javascript脚本
Nov 01 Javascript
angularJS中router的使用指南
Feb 09 Javascript
JavaScript获取当前网页标题(title)的方法
Apr 03 Javascript
Bootstrap轮播图的使用和理解4
Dec 14 Javascript
简单介绍react redux的中间件的使用
Apr 06 Javascript
详解angular应用容器化部署
Aug 14 Javascript
layui select获取自定义属性方法
Aug 15 Javascript
vue的style绑定background-image的方式和其他变量数据的区别详解
Sep 03 Javascript
Vue 解决通过this.$refs来获取DOM或者组件报错问题
Jul 28 Javascript
asp.net中oracle 存储过程(图文)
Aug 12 #Javascript
JavaScript的jQuery库插件的简要开发指南
Aug 12 #Javascript
JavaScript中的call方法和apply方法使用对比
Aug 12 #Javascript
详细解读JavaScript的跨浏览器事件处理
Aug 12 #Javascript
基于jQuery实现动态数字展示效果
Aug 12 #Javascript
jQuery中$.ajax()和$.getJson()同步处理详解
Aug 12 #Javascript
深入解读JavaScript中的Hoisting机制
Aug 12 #Javascript
You might like
php 图片加水印与上传图片加水印php类
2010/05/12 PHP
使用Linux五年积累的一些经验技巧
2013/06/20 PHP
修改destoon会员公司的伪静态中的com目录的方法
2014/08/21 PHP
php 实现Hash表功能实例详解
2016/11/29 PHP
PHPstorm激活码2020年5月13日亲测有效
2020/09/17 PHP
jQuery渐变发光导航菜单的实例代码
2013/03/27 Javascript
解决IE6的PNG透明JS插件使用介绍
2013/04/17 Javascript
jquery获取焦点和失去焦点事件代码
2013/04/21 Javascript
IE下写xml文件的两种方式(fso/saveAs)
2013/08/05 Javascript
在JavaScript中操作时间之getMonth()方法的使用
2015/06/10 Javascript
Jquery+Ajax+PHP+MySQL实现分类列表管理(上)
2015/10/28 Javascript
NodeJS创建基础应用并应用模板引擎
2016/04/12 NodeJs
Node.js实现文件上传
2016/07/05 Javascript
JavaScript中的Reflect对象详解(ES6新特性)
2016/07/22 Javascript
vue组件如何被其他项目引用
2017/04/13 Javascript
Node.JS文件系统解析实例详解
2017/05/15 Javascript
NodeJS 实现手机短信验证模块阿里大于功能
2017/06/19 NodeJs
Vim快速合并行及vim 将文件所有行合并到一行
2017/11/27 Javascript
详解Vue SPA项目优化小记
2018/07/03 Javascript
es6 symbol的实现方法示例
2019/04/02 Javascript
浅谈v-for 和 v-if 并用时筛选条件方法
2019/11/07 Javascript
js实现文字头像的生成代码
2020/03/07 Javascript
Python使用logging结合decorator模式实现优化日志输出的方法
2016/04/16 Python
利用python程序帮大家清理windows垃圾
2017/01/15 Python
python中is与双等于号“==”的区别示例详解
2017/11/21 Python
pandas使用get_dummies进行one-hot编码的方法
2018/07/10 Python
使用Django清空数据库并重新生成
2020/04/03 Python
利用pyecharts读取csv并进行数据统计可视化的实现
2020/04/17 Python
详解pyinstaller生成exe的闪退问题解决方案
2020/06/19 Python
python3 简单实现组合设计模式
2020/07/02 Python
乌克兰在线药房:Аптека24
2019/10/30 全球购物
大学生简历中个人的自我评价
2013/10/06 职场文书
差生评语大全
2014/05/04 职场文书
安全伴我行主题班会
2015/08/13 职场文书
2015年美容师个人工作总结
2015/10/14 职场文书
2019年最新感恩节祝福语(28句)
2019/11/27 职场文书