Using Jelastic for the Internet of Things Guest Post and How-to by Charalampos Doukas, author of Arduino, Sensors

and the Cloud. In the last few decades, especially in the last 10 years, the ability to not only tag and monitor but also control uniquely identifiable objects has grown at a tremendous pace. Everything generates data, from natural networks to human networks to computer networks. Up until recently, it really wasnt possible to keep track of all this data and then on top of that, actually do something with it. This new, all encompassing networkThe Internet of Things (IoT) is now possible due to the emergence of Cloud computing. Within the IoT, objects in the real world also have virtual representations, allowing us to interact with them through the Internet. The IoT relies on Cloud computing for provisioning the appropriate resources. Connecting devices with each other and with the Internet, allowing users to manage their data online and programming them remotely, requires web applications that a) expose lightweight, open and easy to use interfaces for data exchange with the devices, b) can handle the frequent requests by numerous devices that participate in the IoT network, c) can be easily extended to provide new functionality and also be able to accept new device members of the IoT network. I consider Jelastic (PaaS) one of the most appropriate platforms for hosting Web applications that serve IoT networks. It provides web developers all they need to quickly and easily deploy scalable applications that can manage sensor data online. For me, as a developer working with Java, Jelastic is the best solution since it provides complete access to the application server environment, the option to create and use your own database and even access to the local file system (as opposed to the Google App Engine), which was quite essential, especially in one of the projects presented in my book (reprogramming your Arduino remotely). To demonstrate how easy it is to use Jelastic for managing a sensor data, let's consider a very simple example of creating and deploying a web application that receives and visualizes sensor data. Step 1: Create the Jelastic Environment The very first step is to create and configure the Jelastic environment for our application. For the purpose of receiving and visualizing sensor data, we will need an application server (Tomcat 6) and a Database server (MySQL 5.0).

In the main Jelastic console, click on the Create Environment

button and then configure your new environment by selecting the Tomcat 6.0 application server, MySQL 5.0 Database and add two servers, as in the following image.

Give your new environment whatever name you like, I chose sensorcloud for this project. Once done, click on Create and wait until Jelastic runs its magic in the background and sets up your environment. In a couple of minutes the environment will be up and running and you will also receive an email notification about it, followed by an email that contains your login credentials for the MySQL environment and the URL to the phpmyadmin page for managing databases. Next comes the setup of the database. Use the link in the emailit will look like http://mysql-sensorcloud.jelastic.servint.net if you are using Servint as the hosting providerand the credentials to log into phpmyadmin. Go to the Databases tab and create a new database for handling the sensor data.

Add sensordata as a name for your new database and click Create (dont worry about the collation, we will use the database to handle simple data). For this simple project we will need 2 database tables, one to handle the sensor information (like name and id) and another for the sensor data. To create the tables, simply click on the name of your new database. Add sensor as the name for the first table and enter 2 for the number of columns and click Go.

A popup window will come up that will allow you to edit the properties of the 2 columns for the sensor table. Add the information in each column like in the following figure and click Save. Make sure you have ticked the AUTO_INCREMENT option for the column named id:

Our first table in the database is ready to accept data, lets create the second one. On the same page use the same text fields and enter data and 3 for name and number of columns and the click Go.

Just like you did with the first table, set the attributes of the table in the pop-up window like in the following figure and click Save:

You might also want to create a new user with data privileges on the new database, but for demo purposes it is okay to use the default root user. When done, you will be directed to the database structure view where you can view the two tables you have just created. Click the Insert icon on the sensor table and add some custom value for sensor name (e.g., temp). Dont worry about the ID, it will automatically get an incremental value.

Now your Jelastic environment is complete and configured to host your application and your data!

Step 2: Create the Java Servlet The second step involves the development of the Java Application that will receive the sensor data and allow you to visualize it. For this purpose we will need two servlets, one for receiving the data from the sensors and another for visualizing them to the user (the latter will be actually a Java Server page). For this step, I am assuming that you are familiar with Java and servlet programming, as well as the Eclipse environment. Open your Eclipse IDE and create a new Dynamic Web Project. Add any name you like (I have used JelasticSensorArduino) for your

project, select a target runtime (like Tomcat) and click Finish. A new web project will be created and listed under the Project Explorer of your Eclipse IDE. Expand the project and right click on the Java Resources: src to create the appropriate servlet class (I suggest you also create a package hierarchy first). Create a new class named JelasticArduinoServlet and add the following code: [code]
import import import import import import import java.io.IOException; java.util.Date; javax.servlet.http.*; java.sql.Connection; java.sql.DriverManager; java.sql.ResultSet; java.sql.Statement;

@SuppressWarnings("serial") public class JelasticArduinoServlet extends HttpServlet { public void doGet(HttpServletRequest req, HttpServletResponse resp) throws IOException { resp.setContentType("text/plain"); //Retrieve the sensor name and value from the GET requests String SensorName = req.getParameter("sensor"); String value = req.getParameter("value"); //Create a new date object for retrieving date values from the server Date date = new Date(); //Create the connection string to the MySQL DB hosted on Jelastic String url="jdbc:mysql://mysql.arduinocloud.jelastic.servint.net:3306/sensor"; //User your credential for connecting to the DB String user = "DBUSERNAME"; String password = "DBPASSWORD"; Connection con = null; Statement st = null; ResultSet rs = null; boolean exists = false; int id = 0; //Make the connection to the server try { con = DriverManager.getConnection(url, user, password); st = con.createStatement(); //Execute the query for retrieving the sensor id rs = st.executeQuery("SELECT id from sensor where name='"+SensorName+"';"); if (rs.next()) { exists = true; id = rs.getInt(1); } //If there is an ID for the given sensor name update the value if(exists) { st.executeUpdate("Insert into data(sensorid, date, value) VALUES ('"+id+"','"+date+"','"+value+"');"); } resp.getWriter().println("Sensor data updated!"); con.close(); }catch (Exception ex) { resp.getWriter().println(ex.toString()); } } }

[/code]

The latter code is the servlet that handles the sensor value update. It can be invoked by the Arduino or your browser simply as: http://server.ip/servletname? sensor=sensorname&value=sensorvalue First it looks into the database of the given sensor and retrieves its ID. Then ID updates the data table accordingly. Lets move on to the jsp file that will visualize the sensor data. The jsp file needs to be created under the WebContent folder of your projects structure. Create a new file and name it after sensorgraph.jsp and add the following code. [code]
<%@ <%@ <%@ <%@ <%@ <%@ page page page page page page contentType="text/html;charset=UTF-8" language="java" %> import="java.util.List" %> import="java.sql.Connection" %> import="java.sql.DriverManager" %> import="java.sql.ResultSet" %> import="java.sql.Statement" %>

<html> <head> <link type="text/css" rel="stylesheet" href="/stylesheets/main.css" /> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("visualization", "1", {packages:["corechart"]}); google.setOnLoadCallback(drawChart); function drawChart() { var data = new google.visualization.DataTable(); data.addColumn('string', 'Time'); data.addColumn('number', '<%=request.getParameter("sensor")%>'); <% int counter=1; String SensorName = request.getParameter("sensor"); if (SensorName == null) { SensorName = "temp"; } String url = "jdbc:mysql://mysql.arduinocloud.jelastic.servint.net:3306/sensor"; String user = "DBUSERNAME"; String password = "DBPASSWORD"; Connection con = null; Statement st = null; ResultSet rs = null; boolean exists = false; int id = 0; try { con = DriverManager.getConnection(url, user, password); st = con.createStatement(); rs = st.executeQuery("SELECT id from sensor where name='"+SensorName+"';"); if (rs.next()) { exists = true; id = rs.getInt(1); } if(exists) {

rs = st.executeQuery("SELECT value from data where sensorid="+id); while (rs.next()) { counter++; } %> data.addRows(<%=counter%>); <% rs = st.executeQuery("SELECT date, value from data where sensorid="+id); counter = 0; while (rs.next()) { %> data.setValue(<%=counter%>, 0, '<%= rs.getString(1) %>'); data.setValue(<%=counter%>, 1, <%= rs.getString(2) %>); <% counter++; } } con.close(); }catch (Exception ex) {ex.printStackTrace();} %> var chart = new google.visualization.LineChart(document.getElementById('chart_div')); chart.draw(data, {width: 600, height: 240, title: 'My Arduino <%=SensorName%> Sensor Readings'}); } </script> </head> <body> <p></p> <div id="chart_div"></div> </body> </html>

[/code] The jsp uses the Google Chart API in order to visualize data on a div element called chart_div. To do so, it needs to fill the chart data for the chart by retrieving the values for the given sensor from the database. You may have noticed in the begging of the html code that it uses a specific CSS style included in a file called main.css. To include such a file in your project, simply create a new folder named stylesheets under the WebContent folder of your project. Create a main.css inside the stylesheets folder and add the following content:
body { font-family: Verdana, Helvetica, sans-serif; background-color: #FFFFFF; }

Feel free to change fonts and background color to whatever you like. Last, but not least, you need to edit the web.xml file (under WEBINF) and create the appropriate servlet name-mapping so that you can link url paths with the servlet and the jsp file. Replace the content of web.xml with the following:
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-

app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5"> <display-name>JelasticSensorArduino</display-name> <servlet> <servlet-name>JelasticArduino</servlet-name> <servlet-class>doukas.jelastic.arduino.JelasticArduinoServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>JelasticArduino</servlet-name> <url-pattern>/jelasticarduino</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>sensorgraph.jsp</welcome-file> </welcome-file-list> <servlet> <servlet-name>add</servlet-name> <servlet-class>doukas.jelastic.arduino.JelasticArduinoServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>add</servlet-name> <url-pattern>/add</url-pattern> </servlet-mapping> </web-app>

Make sure you enter the correct servlet class name according to the package hierarchy you have used in your project setup. Step 3: Deploy and test your application You are just a small step away from seeing your application receive and visualize sensor data. First you need to export the servlet as a .war archive so that you can deploy it on your Jelastic Environment. To do so, right-click on your project name and select Export. Then select Web->WAR file from the popup window and click Next. Make sure the correct project is selected in the next window and then browse to a destination folder for the .war file to be saved. Finally click Finish. Next go to your Jelastic environment and click Upload under the Deployment Manager.

Browse to the location of the .war file and add a comment for your new application in the popup window and click Upload:

As soon as the uploading process finishes, you will se your application archive listed under the Jelastic Deployment Manager. In order to deploy your application on the running instances of the Tomcat servers you have configured for your environment, simply

hover the mouse over the .war filename so that the deploy icon appears and select your environments name from the list:

Click Deploy on the popup dialog (assuming that we want our application to be accessible from the default root path of our environment). You will notice the Deploying message next to your environments name. After a short time it will change to Deployed. Thats it! Your application is up and running, ready to accept your sensor data through the web service interface you have previously created! Well, almost readywe need to take care a small detail first: your Java Application, in order to connect to the MySQL database, needs a proper jdbc driver. This is simply the mysql-connector jar library file you are using when developing mysql-based java applications locally. You need to upload such a library to the Tomcat environment so that the library is accessible from your application environment. To do so, select the Tomcat configuration icon under your environment, to the right of the Tomcat icon:

The configuration option reveals a new window with access to the Tomcat directory. There you need to upload the jar file under the lib folder. Once you are done with the uploading, restart Tomcat so that the library can be loaded by the servers running instance. Let's do a test then! In your browser select the following url: http://sensorcloud.jelastic.servint.net/add?sensor=temp&value=20 Changing sensorcloud to whatever you chose for your environment name. You should see the Sensor data updated! message. If not (highly unlikely if you followed the steps exactly as presented) you will see the Java exception message that will tell you what is wrong. Keep adding some values to the temp sensor using the previous URL. Then visit the URL for visualizing the sensor data, remembering to define the sensor name as a URL parameter: http://sensorcloud.jelastic.servint.net/?sensor=temp You should get a graph something like the following:

The importance of Jelastic in making applications like this is that it provides all the scalability and extensibility the application needs with just a few clicks: you dont need to worry about the frequency number of simultaneous requests for updating the sensor values. You only have to focus on the functionality of the application itself. You dont even have to worry about setting up the server environment for backing up your data. The importance of having such a web application for managing sensor data online is that it provides you with a direct and accessible way for uploading sensor readings. All you need is a network-enabled microcontroller like the Arduino that can easily access the URL (http://sensorcloud.jelastic.servint.net/add? sensor=temp&value=20). Jelastic eliminates all the extra hassle and work on the backend and allows you to focus on your application. As we have shown in this example, Jelastic makes it easy to host and scale your application.