陳新龍

前端與后端是如何進行數(shù)據(jù)交互的呢？登錄網(wǎng)站時系統(tǒng)是如何將我們輸入的用戶名和密碼數(shù)據(jù)傳輸?shù)椒?wù)器進行登錄校驗的呢？這就涉及JSON 數(shù)據(jù)格式的知識了。

JSON是一種非常重要的數(shù)據(jù)格式，它并不是編程語言，而是一種可以在服務(wù)器和客戶端之間傳輸?shù)臄?shù)據(jù)格式。因為XML 整合到HTML 中各個瀏覽器實現(xiàn)的細節(jié)不盡相同，所以道格拉斯·克羅克福特和奇普·莫寧斯達一起從JS 的數(shù)據(jù)類型中提取了一個子集，作為新的數(shù)據(jù)交換格式，因為主流的瀏覽器使用了通用的JavaScript 引擎組件，所以在解析這種新數(shù)據(jù)格式時就不存在兼容性問題，于是他們便將這種數(shù)據(jù)格式命名為“JavaScriptObject Notation”，簡稱JSON。

我們需要了解JSON 的結(jié)構(gòu)形式、數(shù)據(jù)類型、使用場景以及注意事項。

這個簡單的前端頁面中有一個提交表單，表單中包含用戶名輸入框（username）和密碼輸入框（password），以及登錄按鈕（如圖1）。

輸入用戶名和密碼后點擊登錄按鈕，頁面會向“l(fā)oginDemo/login”發(fā)起一個POST 請求；請求發(fā)出后，需要Java 寫的后端程序來接受該請求。請求會打印出賬號和密碼，F(xiàn)12 打開瀏覽器控制臺觀察傳過去的值，username= 小陳老師&password=123456，其中中文經(jīng)過編碼處理。其實這是QueryString 的一種格式，并不是我們所希望獲得的JSON格式（如圖2）。

JSON 有雨刷兩種結(jié)構(gòu)形式，鍵值對形式和數(shù)組形式。鍵值對形式比較簡單：

{"username"：" 小陳老師"，"age"：23，"password"："123456}

這種結(jié)構(gòu)的JSON 數(shù)據(jù)規(guī)則是：一個無序的“名稱/ 值”集合。對象以大括號表示開始和結(jié)束。每一組鍵值對之間使用逗號分隔，每組名稱和值之間用冒號分隔。這種key-value 形式使用較普遍。

JSON 的數(shù)組形式：

["one"， 18， "two"， " 浙江省寧波市"]

這和Python 中的list 列表有點相似。數(shù)組形式的JSON數(shù)據(jù)就是值（value）的有序集合。數(shù)組以左中括號開始右中括號結(jié)束，值之間用逗號分隔。

我們通過Postman工具演示將賬號和密碼以JSON 的形式傳送至服務(wù)端。在Postman 工具中將默認的QueryString格式調(diào)整為JSON 數(shù)據(jù)格式，可以看到一對大括號中包含了賬號和密碼。后端的代碼正確接收到了數(shù)據(jù)（如圖3）。

JSON較多應(yīng)用在接口返回數(shù)據(jù)和序列化，WEB 應(yīng)用中大部分數(shù)據(jù)接口以JSON格式返回（也存在XML 格式），還有AJxa異步訪問數(shù)據(jù)，RPC 遠程調(diào)用，前后端分離后端返回的數(shù)據(jù)，開發(fā)API 接口（百度、高德）等。