SpringMVC ajax傳值問題

標籤：ica   tag   發送資訊   中文亂碼   sys   etag   int   ret   har   

 

 

AJAX前端請求資料處理

SpringMVC後台接受請求資料

SpringMVC對返回給前端資料處理

AJAX前端處理後台返回的資料

 

注意點：

1.ajax提交的參數說明

Datatype:

預期伺服器返回的資料類型。如果不指定，jQuery將自動根據

HTTP包MIME資訊來智能判斷

"json": 返回 JSON 資料

"text": 返回純文字字串

ContentType:

預設值: "application/x-www-form-urlencoded"。發送資訊至伺服器時內容編碼類別型。

Async:

預設值: true。預設設定下，所有請求均為非同步請求。如果需要發送同步請求，請將此選項設定為 false。

Success:

請求成功後的回呼函數。Function(a,b,c)有3個形參，a是返回的資料，b是”success”,c未知。形參的數目可以任意填寫，按順序載入實參

 

2.使用@ResponseBody註解的同時要匯入

  jackson-core-asl-1.8.8.jar

  Jackson-mapper-asl-1.8.8.jar

該註解的功能才會生效

 

方式1：

ajax資料為url尾碼的格式

 

注意：

這種方式，

提交方式使用POST時

contentType: "application/json; charset=utf-8",後台無法擷取值

contentType:"application/x-www-form-urlencoded",後台可以擷取值

當提交方式使用get時

兩者都可以擷取值

 

前台：

function ajaxTest1(){ 

     $.ajax({ 

     data:"name=小紅&age=12", 

     type:"POST", 

     dataType: ‘json‘, 

     url:"ajax/test1", 

     success:function(data){ 

        alert("success");

        alert(data.name);

        alert(data.age);

      },

     error:function(data){ 

         alert("fail"); 

     }

}); 

} 

 

後台：

@RequestMapping(value="ajax/test1") 

    public @ResponseBody Map<String,Object> login1(HttpServletRequest     request,HttpServletResponse response) throws IOException{ 

        System.out.println(request.getParameter("name")); 

        System.out.println(request.getParameter("age"));

        Map<String,Object> map = new HashMap<String,Object>(); 

        map.put("name",request.getParameter("name")); 

        map.put("age",request.getParameter("age"));

        return map; 

}

 

 

方式2：

Ajax資料為json格式

注意：

這種方式，

提交方式使用POST時

contentType: "application/json; charset=utf-8",後台無法擷取值

contentType:"application/x-www-form-urlencoded",後台可以擷取值。且中文不亂碼

當提交方式使用get時

兩者都可以擷取值，但是中文亂碼

 

前台：

 function ajaxTest2(){ 

  

        $.ajax({ 

        data:{"name":"小紅","age":21},

        type:"POST", 

        dataType: ‘json‘,

        url:"ajax/test2", 

        success:function(data){ 

          alert("success");

          alert(data.name);

          alert(data.age);

        },

         error:function(data){ 

            alert("fail"); 

        }

        }); 

    } 

 

後台：

    @RequestMapping(value="ajax/test2") 

    public @ResponseBody Map<String,Object> login2(HttpServletRequest     request,HttpServletResponse response) throws IOException{ 

        System.out.println(request.getParameter("name")); 

         System.out.println(request.getParameter("age"));

         Map<String,Object> map = new HashMap<String,Object>(); 

         map.put("name",request.getParameter("name")); 

         map.put("age",request.getParameter("age"));

         return map; 

} 

 

方式3：

Ajax資料為json轉字串

 

注意：

1.前台json資料的key必須和後台bean對應

所以以下清空會報錯

var data = {"name":"小紅","age":12,"sex":"女"};

var data = {"name":"小紅","sex":"女"};

前台的json資料中key可以預設

所以以下情況正確

var data = {"name":"小紅"};

[email protected] 不需要匯入額外的jar包

3.contentType必須聲明為"application/json;charset=utf-8",不然會報錯

 

 

前台：

 function ajaxTest3(){ 

       var data = {"name":"小紅","age":12};

       $.ajax({

         url: "ajax/test3",

         data: JSON.stringify(data),

         contentType: "application/json;charset=utf-8",

         type: "POST",

         success:function(data){ 

          alert("success");

          alert(data.name);

          alert(data.age);

        },

         error:function(data,b,c){ 

            alert("fail"); 

            alert(b);

        }

       });

  } 

 

 

後台：

@RequestMapping(value="ajax/test3") 

    public @ResponseBody Person  login3(@RequestBody  Person aa ) throws IOException{       

       System.out.println(aa);

        return aa;   

}

 

自訂一個Person類：

public class Person {

     private String name;

     private int age;

     public String getName() { return name;    }

     public void setName(String name) { this.name = name;    }

     public int getAge() { return age;    }

     public void setAge(int age) { this.age = age;    }

} 

 

方式4：

後台使用hashmap接受前段的值

 

方式5：

後台不使用@Respone自動轉換json資料，而使用respone,write方法寫入

SpringMVC ajax傳值問題