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);

巴特西

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

最新文章

热门文章