Monday 13 February 2012

Calling Drupal WebService through Titanium using Json


In this tutorial I will tell you how to call a drupal webService using Json with and without any parameter.

So lets start with Calling a webService without any parameter.

If you are not aware then let me tell you that for calling a drupal webService, w have an endpoint or we can say it as a url to which you will point and call a specific method (which will be your webService name).




The most common webService that is called in drupal is system.connect, lets call that.

To call any webService we neet to create an httpClient.

var xhr = Titanium.Network.createHTTPClient({
    
    onload : function(e) {         //1

       Titanium.API.info(this.responseText);
         },
     
     onerror : function(e) {         //2
         Ti.API.debug(e.error);
         alert('error');
     },
     timeout : 5000
});
xhr.open("POST","http://myTestUrl.net/services/json"); //3
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8"); //3
xhr.send("method=system.connect"); //4
}

Lets understand the commented lines:
1. onload : This Function to be called upon a successful response.
In that function this.responseText will Log your response that you got from the server.
2. onerror : This Function to be called upon a error response.
3. xhr.open() : This Opens the request and readies the connection. here I am sending a POST request and my endpoint is http://myTestUrl.net/services/json
4. xhr.setRequestHeader() : Sets the value for the specified request header. This function must be called after open but before send.
5. xhr.send () : This method sends the request, as you can see the method name which is system.connect which I am passing.
So the above code will call the webService name "system.connect" and this webService does not accepts any parameter.
You can get your server response in onload() function. You can parse the response using "JSON.parse".
Calling webService with parameter
Now what if you want to send some parameter to the webService that you want to call.
We will follow the same step as above but the only difference will be that we will pass the parameter with our send() request.
here how we do it:
var xhr = Titanium.Network.createHTTPClient({
   
   onload : function(e) {
       Titanium.API.info(this.responseText);
       
       //do whatever you want to do with your response
   }, 
   
   onerror : function(e) {
       alert('error');
   },
   timeout : 5000
    
});

xhr.open("POST","http://myTestUrl.net/services/json");
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=utf-8");
var param = {          //1
  "method" : "getData.list",
  "dataID" : "243"
  
};
xhr.send(param);


Here you can see that the only difference you can see is in the send() function.
As now we dont have to send only our API name i.e method name, but we are passing an extra parameter here i.e "dataID".
NOTE: The names of your parameter should be same as you define in your webService API.
Hence In the above code we are calling a webService named "getData.list" which accepts one parameter "dataID".
we can send as many parameter by this way as required by our API.

11 comments:

  1. Does this works on Mobile web ? as there are issues in cross domain policy

    ReplyDelete
  2. Hi Jibaran, This code can be used in Apps build with titanium. This code runs on both iOS and android devices.
    I havent tried it for mobile web apps.

    ReplyDelete
  3. can you please show the code sample of webservice.

    ReplyDelete
  4. Hi Mridu,

    The above code is the sample code or the code you will use to call a service.
    Do you want to know how to use this code?

    ReplyDelete
    Replies
    1. Hi Ajeeb,
      The problem what am facing is while passing parameter value to web service getting internal server error. So i just want to make sure that am inserting data correctly or not in the web service method.
      please help

      Delete
    2. What error are you getting can you paste your code.. ?

      Delete
  5. if (Ti.Network.online == true) {
    var client = Titanium.Network.createHTTPClient({autoEncodeUrl:false});
    client.onerror = function(e){
    alert(e.source);
    Ti.API.info('error message'+e);
    }
    client.open('POST', 'http://192.168.21.123/imageUpload/ImageUpload.asmx/uploadImageService');
    client.setRequestHeader('Content-Type','application/json');
    client.setRequestHeader('Content-Type', 'JPEG/png');
    client.setRequestHeader('Content-type', 'multipart/form-data');
    var blogPost =new Object({
    title : 'OverBrook',
    body : 'sdf#17!'
    });
    //alert(blogPost);
    var test = [];
    test.push({title : 'OverBrook'});
    var testData = 'attrs='+JSON.stringify(test);
    alert(testData);
    client.send({data:testData});
    client.onload = function() {
    alert('entered');
    Ti.API.info('This is the response'+this.responseText);
    };
    }

    ReplyDelete
  6. Replies
    1. I think the problem is with your API, as it is not reachable and one more thing while sending complex JSON, stringify it and then send, for simple JSON structure you can directlt send
      As for now in your JSON you are using "=" which is not allowed.
      Make sure your JSON structure that you send is following JSON standard.

      Delete
  7. ok.i will check. i tried with ur sample code also not working. So can you please show me your web service method.

    ReplyDelete
  8. I am using the above code in almost all of my project to call a service.
    I advise you to follow JSON standard and make sure your API is working, try calling your API using poster tool and check whether you are getting any response or not.

    ReplyDelete

Pages