TelePort
I’ve said before that Javeline Platform is an Ajax framework. TelePort is the part of Platform that actually makes it that. TelePort is the Asynchronous communication library that uses Javascript And Xml(=Ajax) to communicate to a server without refreshing the page. For a basic breakdown of what Ajax is see this article.
Web services
The first RPC protocol I’ve come in touch with was XML-RPC. It is the brainchild of Dave Winer. Back in 2001 I wrote a JavaScript library called vcXMLRPC which used the xmlHttpRequest Object to send the XML-RPC messages from a webpage to the server without refreshing the page. RPC stands for Remote Procedure Calling. In essence this means you call a function on one computer and it will be executed on another computer. XML-RPC describes how the call is encoded in XML.
Microsoft, IBM and others thought this was a very good idea. It could solve the very difficult IT problem of integrating different services. Within large organizations many different systems exists of all sorts of vendors. It’s very difficult to connect these proprietary interface to eachother (i.e. a CRM application on Linux and an oracle system on windows). If they both use some form of RPC using an agreed format then suddenly it becomes a simple problem; they speak the same language. These big companies together with Dave and the W3C among others started working on a standard called SOAP, which is basically an enterprise version of XML-RPC.
Well, over time several other protocols were created. A group of people doing a lot of javascript based RPC thought it would be nicer to encode the messages using javascript itself. So they created JSON-RPC. With all the hype around web services the PHP developers felt it was too bloated. Why not just use REST to get the xml. If you want to call the method getUsers. Just call http://www.example.com/rpc.php?func=getUsers and you are done. No extra protocol needed. In particular for non-enterprise solutions this is a very easy way.
Javeline TelePort is esentially a communication library that can speak all these protocols. The way you specify the RPC definition is such that you can easily change the protocol or interface without your application being affected.
So how does it work?
The first example is a small Javeline application that calls the Flickr API and requests pictures based on a search keyword. Flickr uses the XML-RPC protocol. The API from Flickr is not the simplest, but I thought it to be a nice first example of Ajax in Platform.
Javeline Markup Language
<j:teleport>
<j:rpc id="flickr"
protocol="XMLRPC"
url="http://www.flickr.com/services/xmlrpc/"
receive="flickrResult">
<method name="flickr.photos.search" />
</j:rpc>
</j:teleport>
This is the JML definition of the web service. The basic structure is always the same. The RPC tag tells Platform which protocol to use and to which url to post. The receive attribute specifies which function is called when one of the method calls return. We have specified a single method called flickr.photos.search.
JavaScript
//Call the Flickr API
flickr["flickr.photos.search"]({
api_key : '5258414d2df91d81b106d9170b980821',
text : search_value,
per_page : 50,
page : 1
});
//Receive the result
function flickrResult(data, status, extra){
if(state == __RPC_ERROR__){
alert("Sorry, we were unable to get a result");
}
else if(state == __RPC_TIMEOUT__){
if(extra.retries < RETRY)
return flickr.retry(extra.id);
else alert("Sorry, www.flickr.com timed out");
}
else{
//Process the data
}
}
In javascript we call the RPC method with the search value from the textbox. When it returns the function is called. This function is called in three cases. The call can be successfull, timed out or have an error. Processing the data is outside the scope of this section (see SmartBindings). The extra object contains all sorts of information about the call. It has a reference to the xmlHttpRequest object as well as the call id. TelePort can retry a call for you automatically using the retry method.
As you might have noticed, the XML-RPC protocol doesnt use named variables. Other protocols like SOAP, POST and JSON do:
Javeline Markup Language
<j:rpc id="comm" protocol="POST"
url-eval="HOST_PATH+'/webapp.php'"
method-name="func" autoroute="true">
<j:method name="login">
<j:variable name="username" />
<j:variable name="password" />
<j:variable name="status" />
</j:method>
<j:method name="getUsers" />
<j:method name="renameUser">
<j:variable name="name" />
</j:method>
</j:rpc>
This TelePort definition calls the methods using the POST protocol. It will call the specified url with ?func=method_name as specified in the method-name attribute.
JavaScript
comm.setCallback("login", function(data){
alert(data);
});
comm.login("ruben", "passwd", "online");
The setCallback method can be used to specify a callback function other than doing that using a receive attribute on the TelePort definition. Other features of TelePort include combining multiple calls in one call and rerouting calls to circumvent certain security features of the browser.