js处理url中的请求参数(编码/解码)

　　在处理 a 链接跳转其他页面时，总会遇到需要传递一些当前页面的信息到其他页面，然后其他页面利用这些信息进行相关操作。利用 get 请求或 hash 传递是常见的方式。

　　首先，需要对传递的参数进行编码，保证数据的安全性；之后，将参数拼接到要跳转的url后，并设置为 a 链接中的 href 属性值。

var util = {setUrlParam: function (params, targetUrl) {var url = '';if(params && targetUrl){// json系列化为字符串，并编码var enRequestParams = encodeURIComponent(JSON.stringify(params));// get拼接url = targeteUrl + '?rq=' + enRequestParams;// 或hash拼接// targeteUrl = targeteUrl + '#rq=' + enRequestParams;
        }return url;}
}
// 假设需要传递的数据如下
var requestParams = {'id': '1001','time': '2017-04-21'
};
// 要跳转的页面url
var targeteUrl = 'http://www.baidu.com';// 获取html中id=target的a链接,并设置href
var ndTargetLink = document.querySelector('a#target');
ndTargetLink.href = util.setUrlParam(requestParams, targeteUrl);

　　完成了地址拼接，接下来就是在目标页面中解析请求参数了。

var util = { // 获取参数getUrlParam:function(url, param) {var reg = new RegExp(param + "=([^&]*)(&|$)");var num = url.match(reg);if (num != null)return num[1];return null;},// 解码,try处理多次编码的情况decodeUrl:function(str){str=decodeURIComponent(str);var json=null;try{json=JSON.parse(str);return json;}catch(e){return  util.decodeUrl(str);}}
}
var loadPage = {data:(function(){var json=util.decodeUrl(util.getUrlParam(hash,'rq')); return json;})()
}
var data = loadPage.data;
console.log('data',data);

转载于:https://www.cnblogs.com/EnSnail/p/6744869.html

js处理url中的请求参数(编码/解码)相关推荐

Js的Url中传递中文参数乱码的解决
一:Js的Url中传递中文参数乱码问题,重点:encodeURI编码,decodeURI解码: 1.传参页面 Javascript代码: 2. 接收参数页面:test02.html 二:如何获取Url ...
JS获取URL中GET的参数
对于 URL,我们需要了解更多,因为我们的开发中可能会需要提取URL的部分信息来做不同的事情,事实上这也是与后端交互的一种独特的方式,当然这肯定是安全的,当请求被返回,关于 url 的信息就被记录在了 ...
Js获取URL中的指定参数
平时项目中页面跳转需要携带参数,为方便获取URL中指定参数整理了两个方法方法1:URLSearchParams() URLSearchParams对象定义了操作 URL传递参数的方法 //获取ur ...
javascript从url中获取请求参数
function getUrlParam(name) {var reg = new RegExp("(^|&)" + name + "=([^&]*)(& ...
JS提取URL中的各个参数
例: URL:http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e 将其按key-value形式返回到一个json结构中 ...
解决JS在url中传递参数时参数包含中文乱码的问题
解决JS在url中传递参数时参数包含中文乱码的问题参考文章: (1)解决JS在url中传递参数时参数包含中文乱码的问题 (2)https://www.cnblogs.com/xushengguan/ ...
openresty获取nginx请求url中的所有参数
获取请求url中的所有参数:vi test.lua b传两个值:
js获得URL中的参数
js获得URL中的参数 function GetQueryString(name) {var reg = new RegExp("(^|&)" + name + " ...
http的get请求中的url中添加Object参数
一直以来http的get请求中,都没有尝试带过复杂对象参数,最新在写grpc时, 使用了框架自动转化rpc请求到http请求,参数定义时没有注意复杂度,定义了个对象嵌套对象的请求参数,所以尝试了下载请 ...

js处理url中的请求参数(编码/解码)

js处理url中的请求参数(编码/解码)相关推荐

最新文章

热门文章