使用js向後臺發送數據，並且使用postman四種發送數據的方式進行模擬（前後端分離）

postman

Postman是一款功能強大的網頁調試與發送網頁HTTP請求的軟件，能模擬前端請求的發送

對於postman發送請求的方式，有下圖的這幾種（下面我們主要挑四個常用的說說）

1.form-data

就是我們上傳文件時使用的multipart/form-data，它將表單的數據組織成Key-Value形式，用分隔符boundary將表單的數據處理成一條消息。這種方式的數據發送，所以既可以上傳文件，也可以上傳參數，只能是POST請求。（分割方式如下圖）

用postman模擬請求的發送

在js文件中獲取表單中的數據（包含文件），用ajax技術發送到後臺中

// $("#shop-img")[0]把jQuery對象轉換成javascript對象，.files[0]表示可能上傳多個文件，獲取第一個文件流
var shopImg = $("#shop-img")[0].files[0];//獲取文件
// 把shop信息和shopImg文件流存進FormData中，FormData是手動創建的表單，以key/value的形式傳到後臺中，可以通過request獲取
// value可以是字符串、File、Blob，如果不是File和Blob會自動轉換成字符串
var formData = new FormData();
formData.append("name", "張三");
formData.append("shopImg", shopImg);
$.ajax({
	url : isEdit?modifyShopUrl:registerShopUrl,
	type : 'POST',
	// 不設置內容類型
	contentType : false,
	// 如果要發送 DOM 樹信息或其它不希望轉換的信息，請設置爲 false。默認情況下，
	// 通過data選項傳遞進來的數據，如果是一個對象(技術上講只要不是字符串)，都會處理轉化成一個查詢字符串
	processData : false,
	cache : false,
	data : formData,
	dataType : "json",
	success : function(data) {
		//處理返回的數據
	})
});

注意

在使用了springmvc的項目中，如果需要使用form-data（即multipart/form-data）上傳數據，那麼一定要配置文件解析器。

2.x-www-form-urlencodeed

就是application/x-www-from-urlencoded（我們平常使用最多的表單上傳，其中不包含文件上傳項），會將表單內的數據轉換爲鍵值對，可以是GET請求，也可以是POST請求。

用postman模擬請求的發送

在js文件中獲取表單中的數據（不包含文件），用ajax技術發送到後臺中

//用js對象或者josn對象封裝數據，再通過ajax技術傳到後臺中，其實就等同於傳一個個鍵值對
$(function () {
    var obj={};
    obj.name=$("name").val();//obj.name="張三";
    $.ajax({
        url: "/param/test1",
        type:"POST",
        contentType:"application/x-www-form-urlencoded",
        data:obj,//obj={name="張三"}
        dataType:"json",
        success:function(data){
        }
    })
})

3.raw

可以上傳任意格式的文本，可以上傳text、json、xml、html等。但我們使用最多的是發送json字符串，傳輸時content-type爲application/json。

用postman模擬請求的發送

在js文件中獲取表單中的數據，用ajax技術發送到後臺中

//用js對象或者josn對象封裝數據，再轉換成json字符串，通過ajax技術傳到後臺中
$(function () {
    var obj={};
    obj.name="張三";
    obj.age=10;
    $.ajax({
        url: "/param/test1",
        type:"POST",
        contentType:"application/json",//contentType必須爲application/json
        data:JSON.stringify(obj),//把json對象轉換爲json字符串
        dataType:"json",
        success:function(data){
        }
    })
})

注意

如果後臺使用springmvc來接收數據，那麼參數必須用@RequestBody標識，並且參數類型必須爲實體類或者Map集合。

	@RequestMapping(value = "/test1", method = RequestMethod.POST)
    @ResponseBody
    private String Test1(@RequestBody User user) {
        System.out.println(user);
        return "success";
    }

4.binary

相當於content-type:application/octet-stream,從字面意思得知，只可以上傳二進制數據，通常用來上傳文件，由於沒有鍵值，所以，一次只能上傳一個文件。