Re: [問題] 在Spring,回傳物件給JQuery Ajax回調函數

作者: TKB5566 (我們的元首阿道夫希特勒)   2024-08-14 17:05:19
※ 引述《lueichun (= =)》之銘言:
: ※狀況概述:
: 就是我寫的一段測試CODE,可以回傳Map或是JSON格式的字串,透過HttpResponse的Body
: 回傳,然後Map和字串被jQuery Ajax的回調函數取得,進而取出Map和字串裡面的value。
: ※程式碼:
: 以下是透過servlet回傳一個map:
: @RequestMapping(value = "/search/api/getSearchResult.do")
: public Map<String,Object> getSearchResultViaAjax(HttpServletRequest request)
: {
: Map<String,Object> map = new HashMap<>();
: String username = request.getParameter("username");
: String email = request.getParameter("email");
: map.put("username", username);
: map.put("email", email);
: return map;
: }
: 以下是透過servlet回傳json格式字串:
: @RequestMapping(value = "/search/api/getSearchResult1.do")
: public String getSearchResultViaAjax1(HttpServletRequest request) {
: //透過ajax傳送query string,直接用getParameter取值
: Map<String,Object> map = new HashMap<>();
: String username = request.getParameter("username");
: String email = request.getParameter("email");
: map.put("username", username);
: map.put("email", email);
: String json = new Gson().toJson(map);
: return json;
: }
: 然後map跟json格式字串回傳回前端的回調函數:
: $.getJSON(
: "/TestSpring4Ajax2/search/api/getSearchResult1.do",
: $.param(search),
: function(data) {
: var json = "<h4>Ajax Response</h4><pre>"
: + data.email + "</pre>";
: $('#feedback').html(json);
: });
: ※補充說明:
: 以上的code沒有問題可正常執行,但我不懂的是為何java物件傳回去後,可以直接當成
: JavaScript物件來使用,是jQuery有做甚麼轉換?或是javaScript本身支援這種用法??
: 我目前知道的是上面那個data物件是JavaScript物件,所以才可以直接用
: 屬性名稱來取值(data.email)。然後從servlet回傳的又是java物件,看起來就很像是
: java物件在回傳過程中轉換成對應的JavaScript物件,可是這樣理解感覺很怪,
: 請問有更好的理解方式嗎??或是說為何可以直接把回調函數的參數,當成一般的
: JavaScript物件來使用??
目前我的理解,是在後端若回傳Map物件、且透過某些方法
例如添加@ResponseBody註釋在方法開頭,或使用gson套件將物件轉為json格式......
的話,這個Map物件就會自動被後端轉成json格式物件然後才回傳前端;
jQuery接收到這個json格式物件,會將其自動解析成原生JS物件。
再將其交給JQuery AJAX回呼函數之參數。
那如果從後端回傳的不是map物件,而是arraylist物件,
後端透過@ResponseBody註釋,一樣會將這arraylist物件,自動轉型成json格式物件。
然後這個arraylist版本的json格式物件回到前端,
會被自動解析成js array物件,再轉交給回呼函數的參數。
作者: GGing (小軒軒)   2024-09-01 15:35:00
其實在 class level 加@RestController 就會自動轉 json了,效果等同於@Controller + @ResponseBody

Links booklink

Contact Us: admin [ a t ] ucptt.com