溫故而知新，本文為一時興起寫出，如有錯誤還請指正

本文後臺介面基於SpringBoot2.5.6編寫，前端基於Vue2 + asios和微信小程式JS版分別編寫進行聯調測試，用於理解前後端分離式開發的互動流程

如果你沒有學過SpringBoot也不要緊，把他看做成SpringMVC即可，寫法完全一致（其實我不說你也發現不了）

本文主要講前後端互動流程，力求幫助新人快速入門前後端分離式開發，不會講關於環境搭建部分的內容

SpringMVC接收引數的方式

在文章開頭快速的過一遍SpringMVC接收引數的幾種方式，一定要記住這幾種方式，看不懂或不理解都沒關係，後續會結合前端程式碼過一遍，這裡就不過多解釋了，直接上程式碼

1.【正常接收引數】

/**
 * 正常接收引數
 * 注意：本Controller為了演示同時寫了三個路徑相同的GetMapping，不要直接複製，啟動會報錯
 */
@RestController
public class IndexController {

    /** 通過變數接收引數 */
    @GetMapping("/index")
    public String index(String username, String password) {
        System.out.println(username);
        System.out.println(password);
        return "index";
    }
    
    /** 通過實體類接收引數 */
    @GetMapping("/index")
    public String index(UserEntity userEntity) {
        System.out.println(userEntity.getUsername());
        System.out.println(userEntity.getPassword());
        return "index";
    }
    
    /** 通過Map集合接收引數 */
    @GetMapping("/index")
    public String index(Map<String, Object> param) {
        System.out.println(param.get("username"));
        System.out.println(param.get("password"));
        return "index";
    }

    /** 通過基於HTTP協議的Servlet請求物件中獲取引數 */
    @GetMapping("/index")
    public String index(HttpServletRequest req) {
        System.out.println(req.getParameter("username"));
        System.out.println(req.getParameter("password"));
        return "index";
    }

    /** 變數接收引數還可以使用@RequestParam完成額外操作 */
    @GetMapping("/index")
    public String index(@RequestParam(value = "username", required = true, defaultValue = "zhang") String username) {
        System.out.println(username);
        return "index";
    }

}
 

2.【路徑佔位接收引數】

/**
 * 路徑佔位接收引數，接收引數的mapping需要使用{}括起來
 */
@RestController
public class IndexController {

    /** 路徑佔位接收引數，名稱相同 */
    @GetMapping("/user/{id}")
    public String index(@PathVariable Integer id) {
        System.out.println(id);
        return "index";
    }

    /** 路徑佔位接收引數，名稱不同 */
    @GetMapping("/user/{id}")
    public String index(@PathVariable("id") Long userId) {
        System.out.println(userId);
        return "index";
    }

}
 

3.【請求體接收引數】

@RestController
public class IndexController {
    
    /** 使用實體類接收引數 */
    @GetMapping("/index")
    public String index(@RequestBody UserEntity userEntity) {
        System.out.println(userEntity.getUsername());
        System.out.println(userEntity.getPassword());
        return "index";
    }
    
    /** 使用Map集合接收引數 */
    @GetMapping("/index")
    public String index(@RequestBody Map<String, Object> param) {
        System.out.println(param.get("username"));
        System.out.println(param.get("password"));
        return "index";
    }
    
    /** 變數接收引數 */
    @GetMapping("/index")
    public String index(@RequestBody String username) {
        System.out.println(username);
        return "index";
    }

}

細心的人應該留意到了，最後使用變數接收引數的時候只接收了username這一個值，並沒有接收password，作為擴充套件在這裡解釋一下，不看也可以，看了不理解也沒關係，知道這個事兒就夠了，以後接觸多了就理解了

如果請求引數放在了請求體中，只有引數列表第一個變數能接收到值，這裡需要站在Servlet的角度來看：

/** 通過基於HTTP協議的Servlet請求物件獲取請求體內容 */
@GetMapping("/index")
public String index(HttpServletRequest req) {
    ServletInputStream inputStream = req.getInputStream();
    return "index";
}

可以看到獲取請求體的程式碼其實是獲取到一個InputStream的輸入流物件，想要知道請求體中資料是什麼必須讀流中的資料，讀取到資料後會將值給第一個變數，而流中的資料讀取一次之後就沒了，當第二個變數讀流時發現流是空的，自然就接收不到引數了

前後端分離式互動流程

好睏 後續內容待更新.......

跨域請求的處理

傳參-路徑佔位引數

傳參-路徑引數

傳參-表單型別引數

傳參-請求體引數

AJAX請求的會話機制(sessionID)

擴充套件：ApiPost介面除錯工具