Spring國際認證指南｜使用JQuery 使用 RESTful Web 服務
你將建造什么
您將構建一個使用基于 Spring 的 RESTful Web 服務的 jQuery 客戶端。具體來說，客戶端將使用在使用 CORS 構建 RESTful Web 服務中創建的服務。
將通過index.html在瀏覽器中打開文件來訪問 jQuery 客戶端，并將在以下位置使用接受請求的服務：
http://rest-service.guides.spring.io/greeting。
該服務將以JSON表示的問候進行響應：
{"id":1,"content":"Hello, World!"}復制
jQuery 客戶端會將 ID 和內容呈現到 DOM 中。
你需要什么
- 約15分鐘。
- 最喜歡的文本編輯器。
- 現代網絡瀏覽器。
- 互聯網連接。
創建一個 jQuery 控制器
首先，您將創建將使用 REST 服務的 jQuery 控制器模塊：
public/hello.js：
$(document).ready(function() {
$.ajax({
url: "http://rest-service.guides.spring.io/greeting"
}).then(function(data) {
$('.greeting-id').append(data.id);
$('.greeting-content').append(data.content);
});
});復制
此控制器模塊表示為一個簡單的 JavaScript 函數。它使用 jQuery 的方法來使用
http://rest-service.guides.spring.io/greeting$.ajax()上的 REST 服務。如果成功，它會將接收到的 JSON 分配給，從而有效地使其成為模型對象。和然后分別附加到和DOM 元素。
dataGreetingidcontentgreeting-idgreeting-content。
注意 jQuery 承諾的使用.then()。這指示 jQuery 在方法完成時執行匿名函數，并從完成的 AJAX 請求中$.ajax()傳遞結果。data
創建應用程序頁面
現在您有了一個 jQuery 控制器，您將創建 HTML 頁面，將客戶端加載到用戶的 Web 瀏覽器中：
public/index.html：
<!DOCTYPE html>
<html>
<head>
<title>Hello jQuery</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="hello.js"></script>
</head>
<body>
<div>
<p class="greeting-id">The ID is </p>
<p class="greeting-content">The content is </p>
</div>
</body>
</html>復制
請注意該部分中的以下兩個腳本標記<head>。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="hello.js"></script>復制
第一個腳本標簽從內容交付網絡 (CDN) 加載縮小的 jQuery 庫 (jquery.min.js)，這樣您就不必下載 jQuery 并將其放置在您的項目中。它還從應用程序的路徑加載控制器代碼 (hello.js)。
另請注意，<p> 標簽包括class屬性。
<p class="greeting-id">The ID is </p>
<p class="greeting-content">The content is </p>復制
這些class屬性幫助 jQuery 引用 HTML 元素并使用從 REST 服務接收到的 JSON的值id和屬性更新文本。content。
運行客戶端
要運行客戶端，您需要將它從 Web 服務器提供到瀏覽器。Spring Boot CLI(命令行界面)包括一個嵌入式 Tomcat 服務器，它提供了一種簡單的方法來提供 Web 內容。有關安裝和使用 CLI 的更多信息，請參閱使用 Spring Boot 構建應用程序。
為了從 Spring Boot 的嵌入式 Tomcat 服務器提供靜態內容，您還需要創建最少量的 Web 應用程序代碼，以便 Spring Boot 知道啟動 Tomcat。以下app.groovy腳本足以讓 Spring Boot 知道您要運行 Tomcat：
app.groovy：
@Controller class JsApp { }復制
您現在可以使用 Spring Boot CLI 運行該應用程序：
春季運行 app.groovy應用程序啟動后，在瀏覽器中打開http://localhost:8080 ，您會在其中看到：
每次刷新頁面時，ID 值都會增加。
概括
恭喜!您剛剛開發了一個使用基于 Spring 的 RESTful Web 服務的 jQuery 客戶端。
