Spring MVC + rest.js

This post is about building a RESTfull client using rest.js which belongs to cujo.js family.

If you want to build SPRING MVC REST application without using rest.js look at these posts

Objective:

  • Build RESTfull HTTP “browser” client using rest.js! “it is interesting how javascript made it out of the browsers!”

Environment:

  • Eclipse
  • Firefox (or Chrome)
  • Jetty (or any java server)

Libraries:

Refer to .classpath file for complete list of jar files

We will build a rest service using spring mvc which returns json object. Then we will use rest.js library to make the call.

( 1 ) Java Projector Spring Project

( 2 ) Java Code & XML Configuration

  • MyController.java
  • Person.java
  • springmvc-servlet.xml
  • web.xml

Here I will show MyController.java code other java and xml files can be found @github

For more info on how to build Spring MVC refer to First Time Spring MVC

package com.hmkcode.controllers;

//imports...

@Controller
public class MyController {

	@RequestMapping("/view")
	public @ResponseBody Person getPerson(){
		Person person = new Person();
		person.setId(1);
		person.setName("hmk");
		return person;
	}

}

( 3 ) Test the Service

  • Once the java project is complete run the jetty or your favorite server to test the service.
  • Run your browser “Firefox or Chrome”.
  • Type: http://localhost:8080/restjs-spring-mvc/rest/view.
  • You should get the same output.

( 4 ) Time for rest.js

  • Add a new folder restjs under WebContent
  • Create new app.html file with the below content.
<!DOCTYPE html>
<html>
    <head>
        <title>Spring MVC + REST.js Sample Page</title>
        <!-- This is a special version of jQuery with RequireJS built-in -->
        <script data-main="scripts/main" src="scripts/require.js"></script>
    </head>
    <body>
        <h1>Spring MVC + REST.js</h1>
        <p></p>

        <label>ID: </label><span id="person-id"></span><br/>
        <label>Name: </label><span id="person-name"></span>

    </body>
</html>
  • Add scripts folder under restjs
  • Download rest.js from cujo.js
  • Unzip downloaded file.
  • Add rest folder under scripts folder copy the content of unzipped file.

  • Download jQuery & when.js & require.js
  • Note: JQuery file name should not include “dots” e.g. jquery-1.9.1…js, just rename it to jquery.js
  • Create main.js with the below content
require(["rest/rest","rest/interceptor/mime","jquery"], function(rest,mime,$) {

	/*rest({ path: 'http://localhost:8080/restjs-spring-mvc/rest/view' }).then(function(response) {
		console.log('response: ', response);
		alert("asd");
	});*/

    client = rest.chain(mime);
    client({ path: 'http://localhost:8080/restjs-spring-mvc/rest/view' }).then(function(response) {
        console.log('response: ', response);
        $(function() {
         	$('#person-id').text(response.entity.id);
             $('#person-name').text(response.entity.name);
         });

    });
});
  • Add jquery.js, require.js, when.js & main.js under scripts folder.

( 5 ) Test

  • Run jetty
  • Open the browser
  • type: http://localhost:8080/restjs-spring-mvc/restjs/app.html

Source Code @ github

One thought on “Spring MVC + rest.js

Comments are closed.