码迷,mamicode.com
首页 > 其他好文 > 详细

奇怪!post提交 地址栏参数竟然可见

时间:2017-05-04 21:54:21      阅读:220      评论:0      收藏:0      [点我收藏+]

标签:为什么   module   cli   source   限制   知识   function   get   check   

转:    http://blog.csdn.net/yuebinghaoyuan/article/details/7727802   

在做项目中,form标签中method="post",并且在提交的方法中,也显示声明method="post".但是地址栏参数依然可见。

       地址栏参数可见,最大的弊端暴露信息,网站没有安全性。另外一个缺点是,当地址栏参数很长,导致页面无法运行。

       为什么地址栏参数会可见呢?不是使用method的提交了。首先来看一下我的提交方式。

       js某一函数的提交代码如下:

[javascript] view plain copy
 
 print?
  1. with(document.forms[0])     {  
  2.     action="roleAuthoriedManager!getModuleOperateBySystem?roleId="  
  3.             +document.getElementById("roleId").value  
  4.             +"&systemId="+document.getElementById("systemId").value  
  5.             +"&pageNo="+<%=pageModelModule.getPreviousPageNumber()%>  
  6.             +"&queryString="+document.getElementById("searchById").value  
  7.             +"&ids="+checkedIds;  
  8.     method="post";  
  9.     submit();  
  10. }  

   看见代码,你明白了为什么了吗?

   若是看明白了,说明你对get与post提交有深入了解;若有点迷惑的,先不用着急,小弟继续分析。

   首先解释一下,为什么地址栏参数可见。

   因为,我的action转向中已经明显滴传参数了。只要action中明显的传参数,无论get或post,这些参数一定会出现在地址栏中。

  那get提交与post提交区别是如何的呢?

  大家都知道,get提交,地址栏参数是可见的;而post提交,地址栏参数是不可见的;所以post提交比get提交更安全。

  这句话,没有错。我也是常常跟别人这么讲的,但是这句话很模糊,参数可见与否,到底是指那些参数?为什么我action传入的参数使用post提交,依然可见额?

   详细的说法是:get提交,是把表单上的input的name以及value值作为参数传递过去。(这里必须设置name值,若只有id,没有name,则地址栏不会显示其参数)。

   而post提交,同样也是把表单上的input的name以及value提交过去了。但是地址栏中没有表单上的参数以及值。

   这个是两者之间明显的区别。当然由这个区别的原理继续进行区分:

   get,地址栏参数显示,所以传递的参数是个数限制的。字符太长,导致页面无法运行。而post无参数限制。所以表单上input比较多,可以考虑post。

   有时在特殊的情况,只能使用post提交。这个不必担心,到时候直接查查即可。

    知道了原因以及区别后,那如何解决这个办法呢?action后面的参数是必须要传的。那如何办呢?

    第一种办法:根据get与post本质原因,我们可以想到,把action后面紧跟的参数做成隐含域,这样作为表单上的一部分传递过去。

     这个办法是可行的,并且大部分也是这么执行的。

    我没有采用第一种办法,为啥呢?因为我参数不符合第一种,action后面的参数如ids不能做成隐含域,因为他是时时更新的。我这块肯定不能在action后面传递参数,因为参数太长,导致页面无法运行,第一种隐含域的办法,又不可行。那怎么解决呢?

     第二种办法:提交时根据action后面的参数创建菜单,隐含域。

     其实,第二种是在第一种的基础上扩展的,还是利用隐含域。只不过是重新定义了提交类。

     第二种办法:js代码如下:  

[javascript] view plain copy
 
 print?
  1. function submitForm(url,data) {  
  2.            var eleForm=document.body.appendChild(document.createElement(‘form‘));  
  3.  eleForm.action=url;  
  4.  for(var property in data)  
  5.      {  
  6.       var hiddenInput=document.createElement(‘input‘);  
  7.       hiddenInput.type=‘hidden‘;  
  8.       hiddenInput.name=property;  
  9.       hiddenInput.value=data[property];  
  10.       eleForm.appendChild(hiddenInput);  
  11.      }  
  12.  this.eleForm=eleForm;  
  13.  if(!submitForm._initialized)  
  14.      {  
  15.        
  16.      submitForm.prototype.post = function()  
  17.         {  
  18.              this.eleForm.method = ‘post‘;  
  19.              this.eleForm.submit();  
  20.         };           
  21.         submitForm._initialized = true;  
  22.         }  
  23.   
  24. }  

    参数解释:url,即form表单转向。data,即action后面参数。这里是用json字符串表示。

      json,全名JavaScript object notation,一种轻量级的资料交换语言,主要应用javascript与服务器打交道。json具有两种表达方式。

     一个是对象,用{},花括号里面是名称值对,表示方式:名称:值,其中每对用逗号隔开。

    一个是值序列表,用[],中括号里面是字符串,每个字符串,用逗号隔开。

    常用的是第一种,若是想进一步了解json,可以自己自主学习哈。

    定义了上述提交的方式。提交方式解释如下:

    首先定义了form表单;

    然后定义了表单上的隐含域。

    把action后面的参数付给隐含域的名称以及值。

    然后重新定了post方式提交。

   应用如下:

[html] view plain copy
 
 print?
  1. new submitForm(‘userAuthoriedManager!selectRole‘,         
  2.                     {userId:userId.value,  
  3.          pageNo:‘<%=pageModel.getNextPageNumber()%>‘,  
  4.          queryString:document.getElementById("searchById").value,  
  5.          checkedIds:checkedIds}).post();  

  传参问题已经解决啦。

  其实,认识是随着时间以及阅历不断加深的。但是每次把对事物的认识都记录或装在脑子中,也许某一天的实践or问题,就是擦出新的认识。最终,其实这种认识就是一种经验,项目的经验就是如此一点一滴积累起来的,不因其小而丢弃。滴水穿石,非一日之功

奇怪!post提交 地址栏参数竟然可见

标签:为什么   module   cli   source   限制   知识   function   get   check   

原文地址:http://www.cnblogs.com/ceshi2016/p/6809395.html

(1)
(1)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!