Writing a Hello World Client

The Mashup Server supports the quick and easy creation of Web services clients written in HTML and Javascript. You can use the Javascript stubs (?stub) generated by the Mashup Server to invoke the mashup services from your web page.

Mashup server also has the concept of bundling a custom UI along with the service. Follow these simple steps to write & expose a simple client for the helloworld service (Assuming the author of the helloworld service is bob):

Note: The Mashup server should be running the helloworld service for this to work.

Step 1:

In Notepad or your favorite html editor, type the following text:

<html>
    <head>
        <META http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Hello World Client</title>
        <script type="text/javascript" src="js/wso2/WSRequest.js"></script>
        <script type="text/javascript" src="/services/bob/helloworld?stub"></script>
    </head>
    <body>
        <p>  
            <script>
                <!-- use the generated stub to call the mashup service -->
                var response = helloworld.hello();

                <!-- write the response to the browser -->
                document.write(response);
            </script> 
        </p>   
    </body>
</html>

Step 2:

Save the above as "index.html" in the directory "scripts/bob/helloworld.resources/www" within the Mashup Server directory. Now you'll be able to see the newly created page when browse to the service endpoint (eg: http://localhost:7762/services/bob/helloworld).

Thats it, its so simple.

Or, not simple enough for you? You can also get a template for a service, similar to the one above but customized to the service, by clicking on the "Source Code template" for HTML link (e.g. http://localhost:7762/services/bob/helloworld?template&flavor=html) on each Mashup's page and saving it as "index.html". This template invokes the first operation in the service asynchronously, and illustrates how to invoke all the other services as well. Start adding parameter values and building a unique and dynamic Mashup interface!

© 2007-2008 WSO2 Inc.