SpringMVC參數傳遞方案

SpringMVC參數傳遞方案
登陸

@PostMapping("/login")
@ResponseBody
public Map login(String username, String password) {
    Map<String, Object> map = new HashMap<>();
    map.put("username", username);
    map.put("password", password);
    return map;
}

function login() {
    let param = {
        "username": "admin",
        "password": "123456"
    };
    $.ajax({
        url: "/login2",
        data: param,
        type: "post",
        dataType: "json",
        success: function(data) {
            $("#username").val(data.username);
            $("#password").val(data.password);
        }
    });
}

登陸

@PostMapping("/login2")
@ResponseBody
public Map<String, Object> login2(@RequestParam(value = "username", required = false) String username, 
                                  @RequestParam(value = "password", required = false) String password) {
    Map<String, Object> map = new HashMap<>();
    map.put("username", username);
    map.put("password", password);
    return map;
}

function login() {
    let param = {
        "username": "admin",
        "password": "123456"
    };
    $.ajax({
        url: "/login2",
        data: param,
        type: "post",
        dataType: "json",
        success: function(data) {
            $("#username").val(data.username);
            $("#password").val(data.password);
        }
    });
}

註冊

@PostMapping("/register")
@ResponseBody
public User register(User user) {
    return user;
}

function register() {
    let param = {
        "userName": $("#username").val(),
        "password": $("#password").val()
    };
    $.ajax({
        url: "/register",
        data: param,
        type: "post",
        dataType: "json",
        success: function(data) {
            console.log(data);
        }
    });
}

多參數無實體類參數爲json字符串

@PostMapping("/multiParameter")
@ResponseBody
public Map<String, Object> multiParameter(@RequestBody Map<String, Object> map) {
    return map;
}

function multiParameter() {
    let param = {
        "title": "爪哇筆記",
        "content": "一個有趣的公衆號",
        "author": "小柒2012"
    };
    param = JSON.stringify(param);
    $.ajax({
        url: "/multiParameter",
        data: param,
        type: "post",
        contentType: "application/json",
        dataType: "json",
        success: function(data) {
            console.log(data);
        }
    });
}

多參數無實體類參數爲json對象

@PostMapping("/multiParameter2")
@ResponseBody
public Map<String, Object> multiParameter2(@RequestParam Map<String, Object> map) {
    return map;
}

function multiParameter2() {
    let param = {
        "title": "爪哇筆記",
        "content": "一個有趣的公衆號",
        "author": "小柒2012"
    };
    $.ajax({
        url: prefix + "/multiParameter2",
        data: param,
        type: "post",
        dataType: "json",
        success: function(data) {
            console.log(data);
        }
    });
}

傳遞數組

@PostMapping("/array")
@ResponseBody
public Map<String, Object> array(@RequestParam(value = "ids[]") Integer[] ids) {
    Map<String, Object> map = new HashMap<>();
    map.put("ids", ids);
    return map;
}

function array() {
    let param = {
        "ids": [1, 2, 3]
    };
    $.ajax({
        url: prefix + "/array",
        data: param,
        type: "post",
        dataType: "json",
        success: function(data) {
            console.log(data);
        }
    });
}

傳遞數組

@PostMapping("list")
@ResponseBody
public Map<String, Object> list(@RequestParam(value = "ids[]") List<Integer> ids) {
    Map<String, Object> map = new HashMap<>();
    map.put("ids",ids);
    return map;
}

function array() {
    let param = {
        "ids": [1, 2, 3]
    };
    $.ajax({
        url: prefix + "/array",
        data: param,
        type: "post",
        dataType: "json",
        success: function(data) {
            console.log(data);
        }
    });
}

傳遞集合實體對象

@PostMapping("listObject")
@ResponseBody
public List<User> listUser(@RequestBody List<User> list) {
    list.forEach(user->{
        System.out.println(user.getUserName());
    });
    return list;
}

function listObject() {
    let list = [];
    list.push({
        "userName": "小柒2012",
        "phonenumber": "17762288888"
    });
    list.push({
        "userName": "小柒2013",
        "phonenumber": "17762289999"
    });
    $.ajax({
        url: prefix + "/listObject",
        data: JSON.stringify(list),
        type: "post",
        contentType: "application/json",
        dataType: "json",
        success: function(data) {
            console.log(data);
        }
    });
}

傳遞集合實體對象一對多

@PostMapping("listUserRole")
@ResponseBody
public List<User> listUserRole(@RequestBody List<User> list) {
    list.forEach(user->{
        List<Role> roleList = user.getRoles();
        roleList.forEach(role->{
            System.out.println(role.getRoleName());
        });
    });
    return list;
}

function listUserRole() {
    let roleList = [];
    roleList.push({
        "roleId": "10000",
        "roleName": "管理員"
    });
    roleList.push({
        "roleId": "10001",
        "roleName": "普通用戶"
    });
    let list = [];
    let user = {
        "userId": 1001,
        "loginName": "admin",
        "userName": "小柒2012",
        "phonenumber": "17762288888"
    };
    user.roleList = roleList;
    list.push(user);
    $.ajax({
        url: prefix + "/listUserRole",
        data: JSON.stringify(list),
        type: "post",
        contentType: "application/json",
        dataType: "json",
        success: function(data) {
            console.log(data);
        }
    });
}

restful風格

@GetMapping("article/{id}")
@ResponseBody
public Map<String,Object> article(@PathVariable("id") String id) {
    System.out.println(id);
    Map<String,Object> map = new HashMap<>();
    map.put("id",id);
    return map;
}

function Restful(id) {
    $.ajax({
        url: prefix + "/article/"+id,
        type: "get",
        dataType: "json",
        success: function(data) {
            console.log(data);
        }
    });
}

注意事項:

• @RequestBody 註解，必須與 contentType 類型 application/json 配合使用。

• @RequestParam 註解，必須與 contentType 類型 application/x-www-form-urlencoded 配合使用，其爲默認類型。

• JSON.stringify() 把對象類型轉換爲字符串類型，通常配合@RequestBody 註解和 contentType 類型 application/json 使用。

contentType: 設置你發送給服務器的格式，有如下三種常見狀況。

• application/x-www-form-urlencoded: 默認值:提交的數據會按照 key1=val1&key2=val2 這種格式進行轉換。

• multipart/form-data: 這也是一個常見的 post 數據提交的方式。咱們使用表單上傳文件時，就要讓 form 的 enctype 等於這個值。

• application/json: 服務端消息主體是序列化後的 json 字符串。

dataType: 告訴服務器，我要想什麼類型的數據，若是沒有指定，那麼會自動推斷是返回xml，json，jsonp，text，script，string，html。