钛合金和Google Cloud Endpoint

Question

I would like to know how (the right way) to work with Google Cloud Endpoint in an Alloy Titanium application. And I would like to use the library that Google has for the API endpoints.

I am new to Alloy and CommonJS, therefore trying to figure out the right way to do this.

From my understanding Alloy prefers (or only allows) including javascript via modules (CommonJS - exports...).

var module = require('google.js');
google.api.endpoint.execute();

This would be the way CommonJS would expect things to work. Although in the google javascript library it just creates a global variable called "gapi".

• Is there a way, I can include this file ?
• Is there a way, I can create global variables ?
• Should I stay away from creating them in first place ?

Thanks !

Answer 1

The client.js library that Google has for the API endpoints can be run only from browsers (Titanium.UI.WebView in this case), it can't be run directly from Titanium code since it contains objects not available in Titanium Appcelerator.

Also, using a Google Cloud Endpoint into an Alloy Titanium application requires having the js code available into the project at compile time, as it is used by Titanium to generate the native code for the desired platforms.

To anwser your questions:

• Is there a way, I can include this file ?

  1. No, if you plan to run the code as Titanium code, for the reasons mentioned above. Instead you could use the following code snippet to connect to a Google Cloud Endpoint:

   var url = " https://1-dot-projectid.appspot.com/_ah/api/rpc "; var methodName = "testendpoint.listGreetings"; var apiVersion = "v1"; callMethod(url, methodName, apiVersion, { success : function(responseText) { //work with the response }, error : function(e) { //onerror do something } }); function callMethod(url, methodName, apiVersion, callbacks) { var xhr = Titanium.Network.createHTTPClient(); xhr.onload = function(e) { Ti.API.info("received text: " + this.responseText); if (typeof callbacks.success === 'function') { callbacks.success(this.responseText); } }; xhr.onerror = function(e) { Ti.API.info(JSON.stringify(e)); //Ti.API.info(e.responseText); if (typeof callbacks.error === 'function') { callbacks.error(e); } }; xhr.timeout = 5000; /* in milliseconds */ xhr.open("POST", url, true); xhr.setRequestHeader('Content-Type', 'application/json-rpc'); //xhr.setRequestHeader('Authorization', 'Bearer ' + token); var d = [{ jsonrpc: '2.0', method: methodName, id: 1, apiVersion: apiVersion, }]; Ti.API.info(JSON.stringify(d)); // Send the request. xhr.send(JSON.stringify(d)); } 

  2. Yes, if you use the embeded device's browser like this (as can be found in web client GAE samples)

      webview = Titanium.UI.createWebView({ width : '100%', height : '100%', url : url // put your link to the HTML page }); 

     , to call your server HTML page which should contain:

      script src="https://apis.google.com/js/client.js?onload=init"> 

• Is there a way, I can create global variables ?

Yes, insert into the app/alloy.js file the global variables, see the default comments in the file:

    // This is a great place to do any initialization for your app
    // or create any global variables/functions that you'd like to
    // make available throughout your app. You can easily make things
    // accessible globally by attaching them to the Alloy.Globals
    // object. For example:
    //
    Alloy.Globals.someGlobalFunction = function(){};
    Alloy.Globals.someGlobalVariable = "80dp";
    

• Should I stay away from creating them in first place ?

I suppose you are reffering to global variables containing the module code for connecting to GAE enpoind methods. It's your call, here is how you can use them.

a) Create a file named jsonrpc.js in the app/lib folder of your Titanium project, put the following code into it, and move the function code from above as the function body:

JSONRPCClient = function () {
};
JSONRPCClient.prototype = {
    callMethod : function (url, methodName, apiVersion, callbacks) {
      // insert the function body here
    }
};
exports.JSONRPCClient = JSONRPCClient;

b) Into app/alloy.js file define your global variable:

Alloy.Globals.JSONRPCClient = require('jsonrpc').JSONRPCClient;

c) Use it (eg. from your controller js files):

var client = new Alloy.Globals.JSONRPCClient();
var url = "https://1-dot-projectid.appspot.com/_ah/api/rpc";
var methodName = "testendpoint.listGreetings";
var apiVersion = "v1";

client.callMethod(url, methodName, apiVersion,
    {success: function(result) {
        //result handling
        Ti.API.info('response result=', JSON.stringify(result));
        //alert(JSON.stringify(result));
    },
    error: function(err) {
        Ti.API.info('response out err=', JSON.stringify(err));
        //error handling
    }
});