作者lueichun (= =)
看板java
標題[問題] 在Spring,回傳物件給JQuery Ajax回調函數
時間Mon Mar 28 12:37:54 2022
※狀況概述:
就是我寫的一段測試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物件來使用??
--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 101.10.6.169 (臺灣)
※ 文章網址: https://webptt.com/m.aspx?n=bbs/java/M.1648442276.A.373.html
1F:推 LPH66: 注意到中間的 .toJson 方法, 它幫你把 Java 物件 map 轉成 03/28 13:11
2F:→ LPH66: 中介的 JSON 格式, 在網路上傳遞的是這個格式的物件 03/28 13:12
3F:→ LPH66: 前端的 javascript 收到這個格式後再將其轉成 js 的物件 03/28 13:12
4F:→ LPH66: $.getJSON 即是前端接收用的函數, 它把 JSON 解碼後傳進 03/28 13:13
5F:→ LPH66: 你的 callback 的 data 參數上 03/28 13:13
6F:→ LPH66: 也就是說, 你的問題在不知道中間有一層中介的 JSON 格式 03/28 13:14
7F:→ LPH66: 以為是後端的 Java 物件直接變成前端的 JavaScript 物件 03/28 13:14
我剛剛又測試了以下CODE,將$.getJSON改成$.get、$.post:
$.post(
"/TestSpring4Ajax2/search/api/getSearchResult2.do",
$.param(search),
function(data) {
//第一種獲得javascript物件的方法
//var obj = eval('(' + data + ')');
//第二種獲得javascript物件的方法
var obj = JSON.parse(data);
var json = "<h4>Ajax Response</h4><pre>"
+ obj.email + "</pre>";//javascript物件
$('
#feedback').html(json);
}
);
---------------------------------------
使用$.get、$.post時,回調函數的參數必須先另外轉成javascript物件,才可以直接使用
所以這是因為$.get、$.post沒有將中介的json格式的物件,轉成javascript物件,
所以必須回調函數接收到參數,另外轉成javascript物件??
9F:→ ssccg: 文件寫的很清楚,data是用$.parseJSON()解析response而來 03/28 14:52
10F:→ ssccg: $.get、$.post這些都一樣是$.ajax的捷徑版,重點在dataType 03/28 14:57
11F:→ ssccg: 設為'json',不過預設的Intelligent Guess只要server有回適 03/28 14:59
12F:→ ssccg: 當的content-type header,也是會自動parseJSON 03/28 14:59
13F:→ ssccg: 你可以試看看$.get(url, function(data) {...}, 'text')和 03/28 15:02
14F:→ ssccg: $.get(url, function(data) {...}, 'json') data是什麼型別 03/28 15:03
謝謝,講得真是清楚。
※ 編輯: lueichun (101.10.6.169 臺灣), 03/28/2022 15:19:52
15F:→ ssccg: server端的spring如果是@RestController/@ResponseBody,回 03/28 15:22
16F:→ ssccg: 傳值會經過HttpMessageConverter轉換,預設的有byte[] → 03/28 15:23
17F:→ ssccg: application/octet-stream、String → text/plain 03/28 15:24
18F:→ ssccg: Resource → 看resource檔案種類 03/28 15:25
19F:→ ssccg: 其他各種物件 → application/json (看classpath上有哪個 03/28 15:26
20F:→ ssccg: json library會有不同的預設converter) 03/28 15:27
21F:→ ssccg: Map會變成JSON字串是因為有converter,String不會再轉換 03/28 15:28
22F:推 Benny327: 簡單講就是中間有一個 “JSON格式的字串” 當作中介格 08/28 19:36
23F:→ Benny327: 式 08/28 19:36
24F:→ Benny327: JS和Java都可以轉換解析這種字串成為自己的物件 08/28 19:36