前台向后台传参,一般有如下几种方式:
一、URL方式传参
使用这种方式时,参数接在url后面,用?分隔,如果有多个参数,各参数间用&连接。get方式请求时可以使用URL方式传参。
巴特URL传参在应用时也有缺陷:
1、参数长度限制:
(1)IIS 7 对 Query String 有长度限制;默认:2048
(2) IE浏览器对URL的长度现限制为2048字节(自己测试最多为2047字节)。
(3)360极速浏览器对URL的长度限制为2118字节。
(4)Firefox(Browser)对URL的长度限制为65536字节。
(5) Safari(Browser)对URL的长度限制为80000字节。
(6)Opera(Browser)对URL的长度限制为190000字节。
(7) Google(chrome)对URL的长度限制为8182字节。
2、传递bean时很麻烦:
有种劣质方法可以办到,就是将bean的属性均需作为一个参数连接到url里传递。
比如要传递一个人这个类(有身高和性别)到后台, 前台:var pepole = {age:22,sex:‘male‘} 要是直接把pepole拼接到url里:url?pepole=pepole,后台在不设置struts参数解析拦截器时,以string接收将会是一个object Object。
假如后台action里声明的是这个bean类型属性,可以实现的方式是:url?pepole.age=22&pepole.sex=male
注:URL里点后面的age和sex最好跟pepole的age和sex大小写相同!
这样后台就直接接收到了一个bean。
想想看,如果bean属性很多,这让前台情何以堪? 所以,这种方法适合bean属性少的情况,且不追求优雅的代码规范下写。
二、JQuery Ajax 方式传递
jquery中ajax只需配置相应的参数即可传参到后台页面。这种方式可传递大数值的数据。
1、get方式
$.ajax({ type: "get", //数据发送的方式 url: "", //要发送的后台地址 data: {val1:"1",val2:"2"}, //要发送的数据(参数)格式为{‘val1‘:"1","val2":"2"} dataType: "json", //后台处理后返回的数据格式 success: function (data) { //ajax请求成功后触发的方法 alert(‘请求成功‘); }, error: function (msg) { //ajax请求失败后触发的方法 alert(msg);//弹出错误信息 } });
后台接收数据(参数):
<?php val1 = $_GET[‘val1‘]; //1 val2 = $_GET[‘val2‘]; //2 ?>
data必须是对象类型,比如data:{"name":"zhangsan"},后台通过 request.getParameter("name")就能接收到name的值。
2、post方式
$.post(url,data,success(data, textStatus, jqXHR),dataType)
url :必需。规定把请求发送到哪个 URL。
data :可选。映射或字符串值。规定连同请求发送到服务器的数据。
success(data, textStatus, jqXHR):可选。请求成功时执行的回调函数。
dataType :可选。规定预期的服务器响应的数据类型。默认执行智能判断(xml、json、script 或 html)。
例:
$.post( "demo_test_post.asp", //传递到服务器的值 { name:"Donald Duck", city:"Duckburg" }, //回调函数 function(data,status){ alert("Data: " + data + "\nStatus: " + status); });
三、form的post方式
post请求,一般用于提交数据,例如提交用户发表的留言,用户订单等,其数据量可能比较大。
var frm = document.getElementById("xxform"); frm.action=path+‘/abc/abcAction!pramaTest.action‘; frm.submit();
xxform里预置一个hidden的标签,在submit之前可以把veryLongJsonStr赋值给这个隐藏的控件。这样,form的post方式也是可以传递大参数的。不过,可能会存在安全问题。
一般,我们处理这样的前后台交互,还是使用Ajax、jquery这样的成熟的框架来做这些细微的事情,比较妥当。
四、通过form表单传递。
<form action="Handler1.ashx" method="get"><!--注意action里面的连接不能带参数的-->> <input type="text" name="id" value="3" /> <input type="text" name="name" value="abc" /> <input type="submit" value="通过传递参数" /> </form>
五、通过js方法传递:点击button按钮,触发onClick事件,执行Go()方法,跳转到localhost:21811/Handler1.ashx页面,同时传递了id,和name两个参数过去。
<input type="button" onclick="Go()" value="通过js方法传递参数" />
<script type="text/javascript"> function Go() { window.location.href="localhost:21811/Handler1.ashx?id=1&name=‘abc‘" } </script>
六、用超链接的方法传递参数:当点击超链接的时候,首先会跳转到localhost:21811/Handler1.ashx页面,然后还会传递id 和name 两个参数过去。
<a href="localhost:21811/Handler1.ashx?id=1&name=‘abc‘">超链接传递参数</a>
总结:
1、jquery ajax 的 get 和 post 方式比较:
(1)get是把参数数据队列加到提交表单的action属性所指的URL中,值和表单内各个字段一一对应,在URL中可以看到。
post是通过 HTTP post 机制,将表单内各个字段与其内容放置在HTML header内一起传送到action属性所指的URL地址。用户看不到这个过程。
(2)对于get方式,服务器端用Request.QueryString获取变量的值。
对于post方式,服务器端用Request.Form获取提交的数据。两种方式的参数都可以用Request来获得。
(3)get传送的数据量较小,不能大于2KB(不同浏览器也有不同限制)。
post传送的数据量较大,一般被默认为不受限制。(理论上,因服务器的不同而异)
(4)get安全性非常低,post安全性较高。
(5)<form method="get" action="a.asp?b=b">跟<form method="get" action="a.asp">是一样的,
也就是说,method为get时action页面后边带的参数列表会被忽视。
而<form method="post" action="a.asp?b=b">跟<form method="post" action="a.asp">是不一样的。
2、特性:
(1)Get请求有如下特性:
它会将数据添加到URL中,通过这种方式传递到服务器,通常利用一个问号?代表URL地址的结尾与数据参数的开端,后面的参数每一个数据参数以“名称=值”的形 式出现,参数与参数之间利用一个连接符&来区分。
(2)Post请求有如下特性:
数据是放在HTTP主体中的,其组织方式不只一种,有&连接方式,也有分割符方式,可隐藏参数,传递大批数据,比较方便。
即:get在 URL 请求里面附带了表单参数和值,post在 HTTP 请求的消息实体中。
3、无论是get还是post,当 dataType: "json", 时,如果用的是jQuery之类的框架,只要是符合Json格式的字符串就会自动转换为Json对象,就不用 使用eval() 或者 JSON.parse() 方法将字符串转换为 json 对象了。