預備知識
- SpringMVC
- Controller
- springmvc組態檔
- web.xml
- JavaScript
- 引入javaScript ,(script)
- 函式
Web1.0時代
- 早期登陸一個網頁的時候，如果失敗需要重繪界面，才能重新登陸，不點擊提交的按鈕，就不知道自己密碼輸錯了，
- 現在大多數的網站都是區域重繪，不重繪整個界面的情況下，實作頁面更新，（像注冊的時候，發現手機已經注冊過了，但是你只是輸入了，沒有提交，然后他就提示了，
- 這就是Ajax，這是時我們就要先了解json格式，
- Web2.0時代最重要的一個因素就是Ajax
Json
JSON (JavaScript Object Notation,JS物件標記)是一種輕量級的資料交換格式，目前使用特別廣泛，
采用完全獨立于編程語言的文本格式來存盤和表示資料，簡潔和清晰的層次結構使得JSON成為理想的資料交換語言，易于人閱讀和撰寫，同時也易于機器決議和生成，并有效地提升網路傳輸效率，
在JS語言中，一切都是物件，因此，任何JS支持的型別都可以通過JSON來表示，例如字串、數字、物件、陣列等，詳情見JSON
看看他的要求和語法格式 :
- 物件表示為鍵值對
- 資料由逗號分隔
- 花括號保存物件
- 方括號保存陣列
JSON鍵值對是用來保存JS物件的一種方式，和JS物件的寫法也大同小異，鍵/值對組合中的鍵名寫在前面并用雙引號""包裹，使用冒號∶分隔，然后緊接著值:
{"name":"zhengzheng"}
{"age":"20"}
{"sex":"男"}
很多人搞不清楚JSON和Js物件的關系，甚至連誰是誰都不清楚，其實，可以這么理解: JSON是JS物件的字串表示法，它使用文本表示一個JS物件的資訊，本質是一個字串，
var obj = {a: 'Hello', b: 'world '};//這是一個物件，注意鍵名也是可以使用引號包裹的
var json = '[" a":"Hello", "b":"World"} ';//這是一個JSON字串，本質是一個字串
Json與JS物件的互轉
要實作從JSON字串轉換為JS物件，使用JSON.parse()方法:
var obj = JSON.parse('{"a":"Hello","b":"World"}';//結果是{a: 'Hello'，b: 'World'}
要實作從JS物件轉換為JSON字串，使用JSON.stringify()方法:
var json = JSON.stringify({a:'Hello',b: 'World'});//結果是 '{"a":"Hello","b":"World"}'
現在大部分都是前后端分離，資料互動變得例外重要
JSON就是王者！
現在我們就是想用Java把這種字串轉化出來，并且使得前端能獲取到，
使用Controller實作回傳Json資料
創建一個普通的maven工程，配置相關的pom.xml和其他組態檔，
創建物體包pojo和控制器包controller，其中創建一個用戶物體類User，增加其部分屬性，無參和全參構造方法以及相應的get和set方法，創建UserController，增加注釋@Controller，
我們創建一個方法
@RequestMapping("/json1")
public String json1() {
return null;
}
我們正常回傳，走的是視圖決議器，而json需要回傳的是一個字串，市面上有很多的第三方jar包可以實作這個功能，比如jackson，fastjson，這里我們使用jackson，它只要一個簡單的注解就可以，我們需要去到maven倉庫中找到他，將其加到我們的maven依賴庫中，
Jackson
選擇其中使用人數最多的一個，將其加到我們的pom.xml中
<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.9.8</version>
</dependency>
我們就可以用@ResponseBody注解將服務器端回傳的物件轉成JSON物件回應回去，
首先它需要一個jackson物件映射器，就是一個類，使用它可以直接將物件轉成json字串，
ObjectMapper mapper = new ObjectMapper();
然后創建用戶一個物件，之后就可以用mapper中的writeValueAsString()方法將其轉成字串str，
我們最后回傳的內容在之前是直接跳視圖決議器，而在我們加上@ResponseBody注解后他就不會回傳到視圖決議器了，
由于@ResponseBody注解，這里會將字串str以json格式的字串回傳，十分方便，這也是我們以后作業中使用較多的，
@RequestMapping("/json1")
@ResponseBody
public String json1() throws JsonProcessingException {
ObjectMapper mapper = new ObjectMapper();
User user = new User("zhengzheng",20,"男");
String str = mapper.writeValueAsString(user);
return str;
}
//精簡版
@RequestMapping("/json1")
@ResponseBody
public String json1() throws JsonProcessingException {
User user = new User("zhengzheng",20,"男");
return new ObjectMapper().writeValueAsString(user);
}
我們可以運行Tomcat后訪問這個地址 http://localhost:8080/jsonTester/json1
其中jsonTester是我的工程名，
我們就可以在界面上看到服務器給我們回傳的json字符，
{"name":"zhengzheng","age":20,"sex":"?"}
但是可以看到其中的中文字符決議不出來，我們需要解決這個亂碼問題，這其實是@RequestMapping的問題，要給@RequestMapping加一個屬性，我們需要設定一下他的編碼格式為utf-8，以及它回傳的型別，通過@RequestMapping的produces屬性來實作，produces它就是用來指定回應體回傳型別和編碼，修改下代碼
@RequestMapping(value="https://www.cnblogs.com/json1",produces="application/json;charset=utf-8")
這樣我們的回傳到界面的就不是亂碼了，我們還可以用一個一勞永逸的方法，更改組態檔，在其中加上
<mvc:annotation-driven>
<!--JSON格式亂碼處理方式-->
<mvc:message-converters register-defaults="true">
<bean >
<constructor-arg value="https://www.cnblogs.com/Plokit/p/UTF-8"/>
</bean>
<bean >
<property name="objectMapper">
<bean >
<property name="failOnEmptyBeans" value="https://www.cnblogs.com/Plokit/p/false" />
</bean>
</property>
</bean>
</mvc:message-converters>
</mvc:annotation-driven>
像這樣的我們根本不用去記它，只要在需要的時候拿來用就行，
我們這次用List來實驗一下
@RequestMapping("/json3")
@ResponseBody
public String json3() throws JsonProcessingException {
List<User> list = new ArrayList<User>();
list.add(new User("張三",20,"男"));
list.add(new User("李四",20,"女"));
list.add(new User("趙五",18,"男"));
return new ObjectMapper().writeValueAsString(list);
}
我們去到：http://localhost:8080/jsonTester/json3
可以看到我們解決了亂碼問題，并且可以看到我們陣列在json中的樣式
[{"name":"張三","age":20,"sex":"男"},{"name":"李四","age":20,"sex":"女"},{"name":"趙五","age":18,"sex":"男"}]
將其格式化就是這樣：
[
{
"name": "張三",
"age": 20,
"sex": "男"
},
{
"name": "李四",
"age": 20,
"sex": "女"
},
{
"name": "趙五",
"age": 18,
"sex": "男"
}
]
我們再了解下有時候會用到關于日期Date的處理
@RequestMapping("/time1")
@ResponseBody
public String json4() throws JsonProcessingException {
Date date = new Date();
return new ObjectMapper().writeValueAsString(date);
}
我們來到相應的地址：http://localhost:8080/jsonTester/time1
可以看到一個時間串，我們當前的時間，各不相同
1611574850169
此時如果我們加個System.out，我們可以看到我們的控制臺也會相應的輸出格林威治時間格式
Mon Jan 25 19:40:50 CST 2021
我們的時間默認回傳的json格式變成了時間戳（Timestamp）的格式
- 如何讓他不回傳時間戳的問題
我們需要關閉ObjectMapper的時間戳功能，
mapper.configure(SerializationFeature.WRITE_DATES_AS_TIMESTAMPS, false);
- 時間格式化問題
自定義日期格式物件
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH-mm-ss");
- 讓mapper指定時間日期格式為SimpleDateFormat
mapper.setDateFormat(sdf);
我們寫好一個例子測驗一下
@RequestMapping("/time2")
@ResponseBody
public String json5() throws JsonProcessingException {
Date date = new Date();
ObjectMapper mapper = new ObjectMapper();
mapper.configure(SerializationFeature.WRITE_DATES_AS_TIMESTAMPS, false);
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");
mapper.setDateFormat(sdf);
return mapper.writeValueAsString(date);
}
運行后來到 http://localhost:8080/jsonTester/time2
這時他就是我們所定義的樣式了，
"2021-01-25 20:19:24"
封裝與總結
我們可以發現整個程序中有很多的重復的代碼，我們可以將其封裝成一個工具類，
新建一個utils的包其中新建一個JsonUtils類，在這里面將我們想封裝的東西做成一個個的方法，
public class JsonUtils {
public static String getJson(Object object) { return getJson(object,"yyyy-MM-dd HH:mm: ss");}
public static String getJson(Object object,String dateFormat){
ObjectMapper mapper = new ObjectMapper();
mapper.configure(SerializationFeature.WRITE_DATES_AS_TIMESTAMPS, false);
SimpleDateFormat sdf = new SimpleDateFormat(dateFormat);
mapper.setDateFormat(sdf);
try {
return mapper.writeValueAsString (object);
}catch (JsonProcessingException e) {
e.printStackTrace();
}
return null;
}
}
我們在需要的時候直接呼叫即可，比如
@RequestMapping("/time3")
@ResponseBody
public String json6() throws JsonProcessingException {
return JsonUtils.getJson(new Date());
}
上面都是用的是@ResponseBody注解，它就是把后臺的物件轉換成json物件，回傳到頁面，和它對應的當然就是@RequestBody，一般用來負責接收前臺的json資料，把json資料自動封裝到pojo中，我們之后Ajax來測驗這一塊，這兩個注解一般都會在異步獲取資料中使用到，
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/253802.html
標籤：Java