常用的前端和服务器数据的传输方式

古城微笑少年丶 2022-03-20 08:54 502阅读 0赞

前端和服务器数据的传输方式常用的有两种：

一、一种是以表单的形式提交，此时可以利用jquery的serialize()方法将表单内容转为a=11&b=22这样的格式传输过去，接收端则可以用javabean直接接收。   
二、另一种是以json格式传输，接收时若直接用bean接收则接收不到，此时后端也可以有两种接收方式：

1.后端用httpServletRequest中request.getParament("字段名")一个一个接收前端传过来的数据

2.用@RequestBody方式，需要注意的是接收的需要是json串，而不是json对象，可以在发送前使用JSON.stringify函数进行处理。（对于表单提交到后台的，需要将表单格式的数据转换为json字符串格式，需要引入组件“jquery.serializejson.js”，具体请看文章“前端：[form表单转换为Json数据][form_Json]

使用@RequestBody接收的例子如下：

//获取表单数据
    function onGetParam() {
        var data = liger.get("form2").getData();
       //alert(JSON.stringify(data));
       return JSON.stringify(data);
    }

$.ajax({
        url:"mainRole/main_role_add",
        contentType:"application/json;charset=UTF-8",
        data:onGetParam(),
        dataType:"json",
        type:"post",
        success:function(data){

@RequestMapping("/main_role_add")
        @ResponseBody
        public Map<String, Object> insertMainFlowRole(@RequestBody MainRole mainRole){
            Map<String, Object> resultMap = new HashMap<String, Object>();
            try {
                mainRoleService.insertMainFlowRole(mainRole);
                resultMap.put("status", 1);
            } catch (Exception e) {
                e.printStackTrace();
                resultMap.put("errMsg", e.getMessage());
            }
            return resultMap;
        }

此时并不是万事大吉了，很大的可能会报错，我就出现了，报错内容如下：

the server responded with a status of 415 (Unsupported Media Type)  
出现这样的错误从以下几个方面去寻找错误原因：

1.在前端ajax中是否加了contentType:"application/json;charset=UTF-8",这一项  
2.在xml配置中加入<mvc:annotation-driven />  
3.带入包jackson-mapper-asl-1.9.13.jar

[form_Json]: https://blog.csdn.net/londa/article/details/87060322