zoukankan      html  css  js  c++  java
  • 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);

     

  • 相关阅读:
    MySQL:逻辑库与表管理
    MySQL:初识数据库
    MySQL:安装与配置
    C语言之指针
    C语言之二维数组
    C语言之冒泡排序
    C语言之数组
    C语言之函数的声明
    C语言之带有返回值的函数
    C语言之全局变量和局部变量
  • 原文地址:https://www.cnblogs.com/EnSnail/p/6744869.html
Copyright © 2011-2022 走看看