PDA

View Full Version : How to GET from and POST data to an XML-RPC Server using extjs?



Exceeder
9 Jul 2009, 4:48 AM
Hi,

I'm new to extjs. I spend 2 work days figuring out how extjs can interact with a standard xml-rpc server. I have a full working application server and a functioning native windows application which makes use of it. Now I want to write some of the native windows client parts using html and extjs. The html pages and all javascript code is served by my XML-RPC Server in another url handler, so I'll not need any proxy for my Ajax commands.

The problem I have is the high abstraction that's used by extjs. You define a data store, call a url and put the result inside a combobox for example (You can see this here: http://extjs.com/deploy/dev/examples/form/forum-search.html). The problem for me is, that I want to call an url with an correct XML-RPC Request and want to get a correct XML-RPC Response, which have to be parsed in some way by extjs.

A second thing is the authentication method the XML-RPC Server is using: It uses HTTP Basic authentication and SSL encryption. I don't know, how I can tell extjs to make this authentication for me.

The examples I found that are getting data just making a HTTP GET with some URL parameters, but that's not what I want.

Can you please help me and give me an example? Is there any extension needed for extjs to get this working? I'm using the brand new extjs 3.0.

Exceeder

Exceeder
9 Jul 2009, 10:32 AM
Hi again,

does nobody know something about this?

Exceeder

tryanDLS
9 Jul 2009, 11:10 AM
Please don't bump your thread hours after posting. Someone may answer if they understand what you're asking for.

Have you looked at just using Ext.Connection to make your requests without putting data into a store?

mjlecomte
9 Jul 2009, 11:54 AM
Hi.

Have you had a look at any of the direct examples yet? IIRC most of the Direct examples use JSON at the moment.

If I were you I would suggest posting some simple example proof of concept code. With that post some simple sample XML that would be returned from your server -- let's try to remove as many unknowns from your question as possible shall we?!

I'd also recommend starting from one of the sample forms that utilizes Ext Direct (there's 3 or 4 in the demos), and using that as more common starting ground for someone to help you.

Exceeder
9 Jul 2009, 11:35 PM
Hello,

sorry for bumping my thread.

This is the request send by xml:


POST /xmlrpc HTTP/1.1
Host: localhost
Content-Type: text/xml
Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==

<?xml version="1.0" encoding="ISO-8859-15"?>
<methodCall>
<methodName>RpcInfo.GetServerInfo</methodName>
<params>
<param><value><boolean>0</boolean></value></param>
</params>
</methodCall>And this is the response of the server:



HTTP/1.1 200 OK
Connection: close
Content-Type: text/xml

<?xml version="1.0"?>
<methodResponse>
<params>
<param>
<value>
<struct>
<member><name>OnlineSince</name><value><dateTime.iso8601>20090710T09:04:44</dateTime.iso8601></value></member>
<member><name>Connections</name><value><i4>1</i4></value></member>
<member><name>HttpPort</name><value><i4>81</i4></value></member>
<member><name>RpcpPort</name><value><i4>9000</i4></value></member>
<member><name>KeepAlive</name><value><boolean>1</boolean></value></member>
<member><name>MethodCount</name><value><i4>352</i4></value></member>
<member><name>ElementsPerPage</name><value><i4>1000</i4></value></member>
<member><name>Win32ClientVersion</name><value>4.0.0.640</value></member>
</struct>
</value>
</param>
</params>
</methodResponse>
Can you tell my which example you mean? I cannot find it in the examples folder which is shipped together with extjs 3.0. However, I played around with some sample code I found by google.



Ajax.defaultHeaders = {
"Authentication": "Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ=="
}

Ext.Ajax.request({
url: '/xmlrpc',
method: 'POST',
xmlData: '<?xml version="1.0" encoding="ISO-8859-15"?><methodCall><methodName>RpcInfo.GetServerInfo</methodName><params><param><value><boolean>0</boolean></value></param></params></methodCall>',
success: function(response, opts) {
var obj = Ext.decode(response.responseText);
console.dir(obj);
},
failure: function(response, opts) {
console.log('server-side failure with status code ' + response.status);
}
});
The problem is, that I did not find a way to encode and decode the request/response from and to xml-rpc code. I don't know, wheater there does code exist in extjs or not. Additionally I don't know, if it's a good practice to add the authentication headers to the Ajax.defaultHeaders or not.

I hope this claryfies some things and you or someone else can better help me. In the meantime I'll try to find the ext direct samples myself and play a little with it. But I think encodeing and decoding xml-rpc will be the problem.

Exceeder

mjlecomte
10 Jul 2009, 4:44 AM
There's 3 examples here:
http://extjs.com/deploy/ext-3.0.0/examples/#sample-13

Exceeder
10 Jul 2009, 7:12 AM
Hi again,

thank you. I didn't see them, because there is more than one location for samples.

However, I extended my Application server so it can directly speak JSON. It seems so, that JSON is better implemented in ajax ui frameworks like extjs.

Just for interest, because I cannot find the documentation for the

Ext.Direct.addProvider(Ext.app.REMOTING_API); call. It seems so, that this in not document in any way. Does this add an application provider for xml-rpc or how can I understand this?

Exceeder

mjlecomte
10 Jul 2009, 9:52 AM
Have you looked at these:

http://extjs.com/deploy/ext-3.0.0/docs/?class=Ext.Direct&member=addProvider

and bottom of:
http://extjs.com/products/extjs/direct.php

If you have suggestions to supplement the API docs for missing information please feel free to post here.

Exceeder
14 Jul 2009, 7:53 AM
Hallo,

I looked at the information you gave me. I implemented a solution working with the Ext.Ajax function. Here is my code:



Ext.util.jsonRpc = new (function(){
var username, password, clientId, authorizationRealm = '';
var timeout = 30000;

this.init = function() {
this.clientId = Ext.util.MD5(Math.random());
this.authorizationRealm = Ext.util.base64.encode(this.clientId + '-' + this.username + ':' + this.password);
}

this.request = function(method, params, success) {
Ext.Ajax.defaultHeaders = {'Authorization' : 'Basic ' + this.authorizationRealm};
Ext.Ajax.timeout = this.timeout;
Ext.Ajax.method = 'POST';
Ext.Ajax.url = '../json/';

Ext.Ajax.request({
jsonData: {
version: "1.1",
method: method,
params: params
},

success: function(result, request) {
var decodedResponse = Ext.decode(result.responseText);

if(decodedResponse.error) {
Ext.MessageBox.alert(
'RPC-Error',
'Failed to call method ' + request.jsonData.method + '. ' +
'Error: ' + decodedResponse.error.message + ' ' +
'(Code: ' + decodedResponse.error.code + ')'
);
}
else {
success(decodedResponse.result);
}
},

failure: function(result, request) {
Ext.MessageBox.alert('HTTP-Error', result.responseText);
}
});
}
})();And here is my onReady function calling a remote procedure via this class:


Ext.onReady(function() {

Ext.util.jsonRpc.username = 'demo';
Ext.util.jsonRpc.password = 'demo';
Ext.util.jsonRpc.init();

Ext.util.jsonRpc.request('Test.Demo', [], function(result) {
Ext.MessageBox.alert('Success', 'Data return from the server: ' + result);
});
});
The result (behind "Data return from the server") contains all data that's returned by the server. This may be a string, integer, an object or array.

The base64 and md5 functions are posted somewhere in this forum.

Any improvements for this code are welcome.

Exceeder

Animal
14 Jul 2009, 7:57 AM
Looks like you should implement a custom Ext.form.Action subclass to perform loading and submitting.