前端与后台交互的方式

前台向后台传参,一般有如下几种方式:
1)URL方式传参
这种方式传参时,首个参数置于url的后面,用“?”连接;形式:url?param=value
如:http://zhidao.baidu.com/q?word=%D6%BD%B1%D2+%CB%BA%BB%D9
多个参数时,参数间用“&”连接,
例如:http://zhidao.baidu.com/q?word=%D6%BD%B1%D2+%CB%BA%BB%D9&lm=0&fr=search&ct=17&pn=0&tn=ikaslist&rn=10

URL传参很方便,但是在应用时,有2个缺陷:
1)单个参数的value不能超过1920000个字节。本文这里暂时定义为大参数。
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属性少的情况,且不追求优雅的代码规范下写写。

2)jQery或Ajax方式传递
先说Ajax方式,这种方式手册上用法多的是,这里只讲讲大字串参数时,例如
Ext.Ajax.request( {
url : path+'/abc/abcAction!pramaTest.action',
success: function(response) {//这里要处理pramaTest的返回service
},
failure: function(response) {
},
params: {
data : this.veryLongJsonStr,
data2 : Ext.encode(this.veryLongJsonStr)
}

});
this.veryLongJsonStr是个长度超过1920000字节的JSON字符串。
可有清楚一点是:Ajax可有传递大数值参数

再说jQery方式,比如API上的一个例子:
$.post(url,
{ name: "John", time: "2pm" },
function(data){
alert("Data Loaded: " + data);
}
);
jquery方式也是可以处理传递大数值参数的。

3)form的post方式
var frm = document.getElementById("xxform");
frm.action=path+'/abc/abcAction!pramaTest.action';
frm.submit();

xxform里预置一个hidden的标签,在submit之前可以把veryLongJsonStr赋值给这个隐藏的控件。这样,form的post方式也是可以传递大参数的。不过,可能会存在安全问题。

一般,我们处理这样的前后台交互,还是使用Ajax、jquery这样的成熟的框架来做这些细微的事情,比较妥当。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,049评论 19 139
  • 1. Java基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法,线程的语...
    子非鱼_t_阅读 31,785评论 18 399
  • 一. Java基础部分.................................................
    wy_sure阅读 3,845评论 0 11
  • (18岁) 又过了一段许久的许久,似欣喜,似哀伤的看着自己成长。近似与世隔绝的童年是导致我内心一片空白的罪魁祸首,...
    Sandra海跃阅读 266评论 0 0
  • 很喜欢手写体好看的那些图片,有写字好看的可以写出来拍下发给我吗,真的很喜欢
    木啦啦啦阅读 208评论 0 0