前端請求後端資料的三種方式!

千鋒武漢發表於2021-05-31

      在前後端分離的開發專案中,前後端聯調的時候會出現這樣那樣的問題,尤其是在調取資料的程式上面,有時候前端給的前端給到後端的明明是正確的但就是無法拿到正確的資料,下面小千就來給大家詳解一下常見的三種資料傳輸方式。

       1、位址列傳輸資料

      1)、query string Parameters:

      當請求方式是get時,瀏覽器會使用查詢字串的方式進行傳遞資料,即:query string Parameters

      查詢字串的規則:請求引數使用 URL地址和“問號傳參“ 的方式進行傳遞----用問號把url和請求引數分開。

      請求引數的格式:以鍵值對的方式體現,多個鍵值對之間用&隔開。

      假設:請求地址為 newsList.php。請求引數是pageIndex和pageCount。 那麼,請求的格式為:newsList.php?pageIndex=1&pageCount=10;如下圖,請求方式為get,在chrome瀏覽器的network裡看到的是:query string Parameters

1

       2、 請求體中傳輸資料

      當請求方式不是get(大部分情況是post或put)時,那麼請求的資料不是在url上,而是在請求體裡。請求體的英文就是:request payload。但是chrome瀏覽器針對不同的content-type有做了區分,分別是formData和request payload。

      1)、formData

      content-type的值是" application/x-www-form-urlencoded"或者 multipart/form-data; boundary=----WebKitFormBoundaryBoMA1XQDUpwpxKQg 時,那麼,就是用的是formData的格式傳遞資料

2

3

      2)、request payload

      content-type的值是" text/plain"或者"application/json" 時,那麼,就是用的是request payload的格式傳遞資料

4

5

      附:預設的資料格式

      1、傳統的ajax請求時候,Content-Type預設為"文字"型別。

      2、傳統的form提交的時候,Content-Type預設為"Form"型別( application/x-www-form-urlencoded )

      3、axios傳遞字串的時候,Content-Type預設為"Form"型別( application/x-www-form-urlencoded )

      4、axios傳遞物件的時候,Content-Type預設為"JSON"型別(( application/json)

      以上就是前端三種傳輸資料的方式了


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/31548651/viewspace-2774633/,如需轉載,請註明出處,否則將追究法律責任。

相關文章