Soa development using javascript

SOA Development Using Javascript
An alternative approach to web development

Carl Domingue
IBM Certified Solution Developer
carl.domingue@dsixe.com

http://dsixe-wpf.blogspot.com/


Typical web application: AJAX requests
Browser HTML fragments from servlet.
Asks servlet for HTML

Data

Servlet Web Service
Invokes WS and creates Business logic and calls
HTML for browser to data repositories

Subsystem


Javascript web application: AJAX requests
Browser
Asks servlet for HTML
data directly from web service, manipulate
Invokes web services HTML using javascript.

HTML with templates Data

Servlet Web Service
Creates HTML for Business logic and calls
browser to data repositories

Subsystem


Why do it this way?
• Serving HTML from a back end server to a browser is an
antiquated design that predates modern browsers

• Cut out the middle man, more like developing
traditional thick client applications

• Simplify AJAX – dynamic portions of user interface are
built entirely with javascript, not with servlet

• Easier when implementing rich user interface which
requires extensive manipulation of the DOM


Why do it this way?
• Improved performance - load distributed on many
clients instead of single server

• Follows SOA approach
• Presentation/UI layer – browser
• Business logic – reusable web services
• Data – database/subsystems

• Short learning curve, most developers know some
javascript

• No need to render the whole page when user action is
requested


Arguments for not using this approach

• Performance - dojo is too big/slow
• Dojo is already being used in WPS 7 and has been
load tested with excellent results, little additional
overhead is required
• Dojo classes are about 1k after compression

• No IDE for javascript
• RAD offers extensive support for dojo, even custom
classes

• Javascript is not an ideal language for enterprise
development, easy to turn code into an unmaintainable
mess


Arguments for not using this approach
• Security
• Retrieve user id from web service using @Resource
instead of request
• Secure web service URL with group permissions at
servlet level
• Needs more thought

• Browser incompatibilities
• Use dojo when possible to isolate code
• Traditional approach faces same issues


Java bean class

package com.dsixe.evaluation.operations;

public class Evaluation {
private static int DAYS_TO_SUBMIT = 10; // ???

private String evaluationID = "";
private String teacherID;
private String startDate;
private String savedDate;
private String completedDate;
private String evaluatorName;


Javascript bean class

dojo.provide(“com.dsixe.evaluation.operations.Evaluation");
dojo.require(“com.dsixe._BeanBase");

dojo.declare(“com.dsixe.evaluation.operations.Evaluation",
com.dsixe._BeanBase, {

// By default all fields are private
_evaluationID : null,
_teacherID : null,
_startDate : null, Javascript generated with
_savedDate : null, Fast Code eclipse plugin
_completedDate : null, using custom template,
_evaluatorName : null, minimal hand coding


UI.htm Controller.js

Dojo
Service proxy
Custom code

Generated javascript Generated javascript Generated javascript
bean class bean class bean class

goGetSubjects(“600”, “02”, updateUISubjects); Controller

goGetSubjects : function(schoolID, gradeID, callback){
var params = new dojox.wire.ml.XmlElement("getSubjects");
params.setPropertyValue("SchoolID", schoolID);
params.setPropertyValue("GradeID", gradeID);
var deferred = myService.getSubjects(params); Service proxy

// ajax callback Javascript bean
deferred.addCallback(function(xmlData){ class
var info = new com.dsixe.commonListService.objects.subject.Subject();
var subjList = info.createFromXML(xmlData);
callback(subjList);
});
}

function updateUISubjects(/* com.dsixe.commonListService.objects.subject.Subject */oSubjects){
var selector = dojo.byId("subject");
selector.options.length = 0; // wipe out list Controller

for (var x=0; x < oSubjects.length; x++){
var opt = new Option(oSubjects[x].getDeptDesc(), oSubjects[x].getDeptCode());
selector.options[x] = opt;
}
}

Using ibm_soap dojo module
<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/"
xmlns:gcp="http://k12.gcps.ga.us/GCPSCommonListServices">
<soapenv:Header/>
<soapenv:Body>
<gcp:getSubjects>
Raw XML from SoapUI
<SchoolID>600</SchoolID>
<GradeID>02</GradeID>
</gcp:getSubjects>
</soapenv:Body>
</soapenv:Envelope>

myService = new ibm_soap.rpc.SoapService(gcpsCommonService);
myService.serviceUrl = "http://localhost:81/MyListServices_WS/MyListServices";

goGetSubjects : function(schoolID, gradeID, callback){
var params = new dojox.wire.ml.XmlElement("getSubjects"); Service proxy
params.setPropertyValue("SchoolID", schoolID);
params.setPropertyValue("GradeID", gradeID);
var deferred = myService.getSubjects(params);

// ajax callback
deferred.addCallback(function(xmlData){
var info = new k12.gcps.commonListService.objects.subject.Subject();
var subjList = info.createFromXML(xmlData);
Pass in XML
callback(subjList);
Array of Subject response
});
} classes

Soa development using javascript

Recommended

More Related Content

What's hot (20)

Viewers also liked (20)

Similar to Soa development using javascript (20)

Recently uploaded (20)

Soa development using javascript