JayRock and JQuery

[Matt Penner]

While we're talking about Java Script frameworks, I have updated the
proxy for our projects that use JQuery.

The JSON reference from either json.org or in the JayRock download
causes an infinite loop when combined with JQuery.

Rather, I just updated the JayRock proxy generator with a new function
that uses the built-in JQuery JSON functions. So I'm using $.toJSON
instead of JSON.stringify and $.parseJSON instead of JSON.eval.

Works out great.

Thanks for the great product Atif.
Matt

[Gavin Joyce]

Matt,

Would you care to share this code? I am looking to use a jQuery proxy
to Jayrock services too.

Thanks,
Gavin

[Atif Aziz]

Hi Gavin,

I managed to find a few minutes this weekend to pull together a simple channel for jQuery. Here's the code for it (lacking in there are the error cases):

function jQueryChannel() {
this.rpc = function(call) {
if (!call.callback)
throw new Error('Synchronous calls not supported.');
$.ajax({
type: "POST",
url: call.url,
data: JSON.stringify(call.request),
beforeSend: function(xhr) {
xhr.setRequestHeader("X-JSON-RPC", call.request.method);
},
success: function(s) {
call.callback(JSON.eval(s));
}
});
}
}

With this in place and included on your web page, you can then use it as follows with the demo service that ships with Jayrock (assuming you've included a script reference to the demo.ashx proxy):

window.onload = function()
{
var demo = new DemoService();
demo.channel = new jQueryChannel();
demo.sum(12, 34, function(response) { alert(response.result); });
}

What this code does is replace the default channel with your own on the proxy object. All requests and responses are then serviced through the channel. The channel has to support only a single method called rpc that takes a single parameter representing a call object. The call object has three interesting properties: url, callback and request. These represent the target URL, the callback function and the JSON-RPC request object, respectively.

Two thing to note:

- Use the daily build of Jayrock (post release 0.9.8316) available off ftp://ftp.berlios.de/pub/jayrock to get the new style of channel support. This was supported in 0.9.8316 as well but the mechanics have changed a bit (in the interest of simplicity) going forward.

- The jQueryChannel implementation above uses the JSON API (json.js) shipping with Jayrock and which is based on the reference implementation available from www.json.org. You're free to use the one from jQuery if you like.

Hope this helps for now.

- Atif

[Matt Penner]

I'll have to check this out. Channel support wasn't available (as far
as I knew) when we started our project.

Again, using the json.js class both from json.org or bundled with
Jayrock gave us an infinite loop. Since jquery has it's own Ajax
plugin I just used that and it's worked great.

Gavin, what I simply did is update the JsonRPCProxyGenerator.cs with
this in the WriteProxy method:
if (version.Equals("jquery"))
JQuery(Service.GetClass(), url, writer);
else if (version.Equals("2"))
Version2(Service.GetClass(), url, writer);
else
Version1(Service.GetClass(), url, writer);

I then simply duplicated the Version2 method renamed to JQuery with
the following changes:
function callSync(method, request)
{
var http = newHTTP();
http.open('POST', url, false, self.httpUserName,
self.httpPassword);
setupHeaders(http, method);
http.send($.toJSON(request));
if (http.status != 200)
throw { message : http.status + ' ' + http.statusText,
toString : function() { return message; } };
var response = $.parseJSON(http.responseText);
if (response.error != null) throw response.error;
return response.result;
}

function callAsync(method, request, callback)
{
var http = newHTTP();
http.open('POST', url, true, self.httpUserName,
self.httpPassword);
setupHeaders(http, method);
http.onreadystatechange = function()
{ http_onreadystatechange(http, callback); }
http.send($.toJSON(request));
return request.id;
}

This was just for quick testing. I am planning on refactoring this
out to its own proxy and simply adding it in the web.config under
jayrock/jsonrpc/features.

If the channels work out then maybe we'll just do that rather than
having to write our own proxy class.

I'll test it out when I have time and report back. Gavin, if you try
it out first you can let us know how it worked out.

Matt Penner

On Sep 23, 6:52 am, Atif Aziz <Atif.A...@skybow.com> wrote:
> Hi Gavin,
>
> I managed to find a few minutes this weekend to pull together a simple channel for jQuery. Here's the code for it (lacking in there are the error cases):
>
> function jQueryChannel() {
> this.rpc = function(call) {
> if (!call.callback)
> throw new Error('Synchronous calls not supported.');
> $.ajax({
> type: "POST",
> url: call.url,
> data: JSON.stringify(call.request),
> beforeSend: function(xhr) {
> xhr.setRequestHeader("X-JSON-RPC", call.request.method);
> },
> success: function(s) {
> call.callback(JSON.eval(s));
> }
> });
> }
>
> }
>
> With this in place and included on your web page, you can then use it as follows with the demo service that ships with Jayrock (assuming you've included a script reference to the demo.ashx proxy):
>
> window.onload = function()
> {
> var demo = new DemoService();
> demo.channel = new jQueryChannel();
> demo.sum(12, 34, function(response) { alert(response.result); });
>
> }
>
> What this code does is replace the default channel with your own on the proxy object. All requests and responses are then serviced through the channel. The channel has to support only a single method called rpc that takes a single parameter representing a call object. The call object has three interesting properties: url, callback and request. These represent the target URL, the callback function and the JSON-RPC request object, respectively.
>
> Two thing to note:
>

> - Use the daily build of Jayrock (post release 0.9.8316) available offftp://ftp.berlios.de/pub/jayrockto get the new style of channel support. This was supported in 0.9.8316 as well but the mechanics have changed a bit (in the interest of simplicity) going forward.
>
> - The jQueryChannel implementation above uses the JSON API (json.js) shipping with Jayrock and which is based on the reference implementation available fromwww.json.org. You're free to use the one from jQuery if you like.

[Atif Aziz]

Hi Matt,

> Again, using the json.js class both from json.org or bundled with
> Jayrock gave us an infinite loop.

Can you help to reproduce this with a simple test page?

Thanks,

[Penner, Matthew]

I'll try and let you know. I think I'll actually get back to work on
this project today.

Matt Penner
Database Engineer II
GIS Support
mpe...@valverde.edu
(951) 940-6108 x10709

[Penner, Matthew]

I can’t seem to reproduce it now in a simple page.  I’ll assume it’s not much of an issue anymore unless I run across it again. 

 

Matt Penner

---