Consume Spring HATEOAS Rest API using JQuery Ajax example | Spring Boot
Tags: springboot, consume, hateoas, restapi
Published: 2021-05-04 12:17:29

https://grokonez.com/spring-framework/spring-mvc/consume-spring-hateoas-rest-api-using-jquery-ajax-example-spring-boot

Consume Spring HATEOAS Rest API using JQuery Ajax example | Spring Boot

In this tutorial, <strong>JavaSampleApproach</strong> shows you a Spring Boot example that consumes Spring HATEOAS Rest API using JQuery Ajax.

Related Post: <a href="https://grokonez.com/spring-framework/spring-boot/spring-hateoas-rest-api-jquery-ajax-example-spring-boot">Spring HATEOAS Rest API + JQuery Ajax POST/GET example | Spring Boot</a>

<!--more-->
<h2>I. Overview</h2>
<h3>1. Goal</h3>
We'll build a Spring Boot Application in that:
- <strong>HATEOAS REST Service</strong> provides interface for interacting with <strong><em>Customer</em></strong> Database.
- Client calls API by using <strong>JQuery Ajax GET</strong>, retrieves and displays:
+ <em><strong>Customer</strong></em> Data (Id, Name) with HATEOAS <strong>Links</strong> by <em><strong>CustomerId</strong></em>.
+ <em><strong>Order</strong></em> Data for <em><strong>Customer</strong></em> above.
<h3>2. Technology</h3>
- Java 1.8
- Maven 3.3.9
- Spring Tool Suite – Version 3.8.4.RELEASE
- Spring Boot: 1.5.4.RELEASE
<h3>3. Project Structure</h3>
<img src="https://grokonez.com/wp-content/uploads/2017/06/consume-spring-hateoas-ajax-structure.png" alt="consume-spring-hateoas-ajax-structure" width="364" height="510" class="alignnone size-full wp-image-6108" />

- <strong>HATEOAS REST Service</strong>:
+ <code>Customer</code> class extends Spring HATEOAS <code>ResourceSupport</code>.
+ <code>CustomerRepository</code> provides repository methods and custom finder methods for <code>CustomerController</code> to interact with <code>Customer</code> database.
+ <code>CustomerController</code> is a REST Controller which has request mapping methods for RESTful requests such as:
/{id}, /{id}/orders, /getcustomer/{id}
+ <code>Response</code> class defines structure for returned data of HTTP GET.

<div class="jsa-quote">
For more details about creating HATEOAS REST Service, please visit:
<a href="https://grokonez.com/spring-framework/spring-boot/how-to-start-spring-hateoas-restapi-with-spring-boot">How to start Spring HATEOAS RestAPI with Spring Boot</a> 
</div>
- <strong>JQuery Ajax</strong>:
+ <strong>home.jsp</strong> contains elements for GET request and display results.
+ <code>ajax()</code> GET methods in <strong>get.js</strong> Javascript file.
+ <code>WebController</code> maps url to <strong>home.jsp</strong> page.

More at:

https://grokonez.com/spring-framework/spring-mvc/consume-spring-hateoas-rest-api-using-jquery-ajax-example-spring-boot

Consume Spring HATEOAS Rest API using JQuery Ajax example | Spring Boot

In this tutorial, <strong>JavaSampleApproach</strong> shows you a Spring Boot example that consumes Spring HATEOAS Rest API using JQuery Ajax.

Related Post: <a href="https://grokonez.com/spring-framework/spring-boot/spring-hateoas-rest-api-jquery-ajax-example-spring-boot">Spring HATEOAS Rest API + JQuery Ajax POST/GET example | Spring Boot</a>

<!--more-->
<h2>I. Overview</h2>
<h3>1. Goal</h3>
We'll build a Spring Boot Application in that:
- <strong>HATEOAS REST Service</strong> provides interface for interacting with <strong><em>Customer</em></strong> Database.
- Client calls API by using <strong>JQuery Ajax GET</strong>, retrieves and displays:
+ <em><strong>Customer</strong></em> Data (Id, Name) with HATEOAS <strong>Links</strong> by <em><strong>CustomerId</strong></em>.
+ <em><strong>Order</strong></em> Data for <em><strong>Customer</strong></em> above.
<h3>2. Technology</h3>
- Java 1.8
- Maven 3.3.9
- Spring Tool Suite – Version 3.8.4.RELEASE
- Spring Boot: 1.5.4.RELEASE
<h3>3. Project Structure</h3>
<img src="https://grokonez.com/wp-content/uploads/2017/06/consume-spring-hateoas-ajax-structure.png" alt="consume-spring-hateoas-ajax-structure" width="364" height="510" class="alignnone size-full wp-image-6108" />

- <strong>HATEOAS REST Service</strong>:
+ <code>Customer</code> class extends Spring HATEOAS <code>ResourceSupport</code>.
+ <code>CustomerRepository</code> provides repository methods and custom finder methods for <code>CustomerController</code> to interact with <code>Customer</code> database.
+ <code>CustomerController</code> is a REST Controller which has request mapping methods for RESTful requests such as:
/{id}, /{id}/orders, /getcustomer/{id}
+ <code>Response</code> class defines structure for returned data of HTTP GET.

<div class="jsa-quote">
For more details about creating HATEOAS REST Service, please visit:
<a href="https://grokonez.com/spring-framework/spring-boot/how-to-start-spring-hateoas-restapi-with-spring-boot">How to start Spring HATEOAS RestAPI with Spring Boot</a> 
</div>
- <strong>JQuery Ajax</strong>:
+ <strong>home.jsp</strong> contains elements for GET request and display results.
+ <code>ajax()</code> GET methods in <strong>get.js</strong> Javascript file.
+ <code>WebController</code> maps url to <strong>home.jsp</strong> page.

More at:

https://grokonez.com/spring-framework/spring-mvc/consume-spring-hateoas-rest-api-using-jquery-ajax-example-spring-boot

Consume Spring HATEOAS Rest API using JQuery Ajax example | Spring Boot