Mobile-Web-App

Tuesday, June 17, 2014

Node.js + socket.io, emit events between server and client, bi-directionally.

server.js

var serverapp = require('http').createServer(handler);
var io = require('socket.io').listen(serverapp);
var fs = require('fs');

serverapp.listen(8888);

function handler (req, res) {
    fs.readFile("page.html",
        function (err, data) {
            if (err) {
                throw err; 
            }
            res.writeHead(200);
            res.end(data);
        });
}

io.sockets.on("connection", function (socket) {
    socket.on("event_button_clicked", function (data) {
        console.log(data.text);
        io.sockets.emit("event_upatetext", { value: "hello " + data.text});
    });
});

page.html

<html>
<head></head>
<body>
<h1>Hello World!</h1>
<p>from mobile-web-app.blogspot.com</p>

<form action="">
<input 
    type="text" id="intext"><br>
<input 
    type="button" 
    id="button1" 
    value="Click ME" 
    onclick="button_clicked(this);">
</form>
<p id="outtext"></p>

<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect(document.location.href);

function button_clicked(button)
{
    socket.emit(
        "event_button_clicked", 
        { text: document.getElementById("intext").value });
}

socket.on("event_upatetext", function (data) {
    console.log("event_upatetext" + ": " + data.value);
    document.getElementById("outtext").innerHTML = data.value;
});
</script>

</body>
</html>

Sunday, June 15, 2014

Node.js + socket.io, receive data from client

Example to get data from client using Node.js + socket.io.

To use socket.io, you have to install it using npm
$ npm install socket.io

server.js

var serverapp = require('http').createServer(handler);
var io = require('socket.io').listen(serverapp);
var fs = require('fs');

serverapp.listen(8888);

function handler (req, res) {
    fs.readFile("page.html",
        function (err, data) {
            if (err) {
                throw err; 
            }
            res.writeHead(200);
            res.end(data);
        });
}

io.sockets.on("connection", function (socket) {
    socket.on("event_button_clicked", function (data) {
        console.log(data.text);
    });
});

page.html

<html>
<head></head>
<body>
<h1>Hello World!</h1>
<p>from mobile-web-app.blogspot.com</p>

<form action="">
<input 
    type="text" id="intext"><br>
<input 
    type="button" 
    id="button1" 
    value="Click ME" 
    onclick="button_clicked(this);">
</form>

<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect(document.location.href);

function button_clicked(button)
{
    socket.emit(
        "event_button_clicked", 
        { text: document.getElementById("intext").value });
}
</script>

</body>
</html>

Saturday, June 14, 2014

Node.js example to handle POST method

server.js

var http = require("http");
var fs = require('fs');

fs.readFile('page.html',function (err, data){

    if (err) {
        throw err;  
    }
    var htmlBody = data;
    
    http.createServer(function(request, response){
        
        console.log("request.method: " + request.method);

        request.on("data", function (data) {
            console.log("data: " + data);   
        });
        
        request.on('end', function () {
            console.log("end:");
            response.writeHead(200, {"Content-Type": "text/html"});
            response.write(htmlBody);
            response.end();
        });
    
    }).listen(8888);
        
});

page.html

<html>
<head></head>
<body>
<h1>Hello World!</h1>
<p>from mobile-web-app.blogspot.com</p>

<form method="POST">
Input: 
<input type="text" name="intext"><br>
<input type="submit" value="POST">
</form>

</body>
</html>

Thursday, June 12, 2014

Node.js load external html file

Example to load html code from external file, instead of code in js.

server.js

var http = require("http");
var fs = require("fs");

http.createServer(function(request, response){
    
    fs.readFile("page.html", function (err, data){
        if (err) {
            throw err; 
        }
        response.writeHead(200, {"Content-Type": "text/html"});
        response.write(data);
        response.end();
    });
    
}).listen(8888);

page.html

<html>
<head></head>
<body>
<h1>Hello World!</h1>
<p>from mobile-web-app.blogspot.com</p>
</body>
</html>

Return html code in Node.js

var http = require("http");

http.createServer(function(request, response){
    
    var htmlbody = 
        "<html>" +
        "<head>" +
        "</head>" +
        "<body>" +
        "<h1>Hello World!</h1>" +
        "<p>from mobile-web-app.blogspot.com</p>" + 
        "</body>" +
        "</html>";
        
    response.writeHead(200, {"Content-Type": "text/html"});
    response.write(htmlbody);
    response.end();
}).listen(8888);

- Node.js load external html file

Wednesday, June 11, 2014

Get date in Node.js using Javascript

To get date in Node.js, we can use javascript's Date object.

Example:

var http = require("http");
var url = require("url");

http.createServer(function(request, response){
    response.writeHead(200, {"Content-Type": "text/plain"});
    response.write("Hello World!\n");
    response.write("from mobile-web-app.blogspot.com\n\n");
    
    var now = new Date();
    var year = now.getFullYear();
    var month = now.getMonth();
    var date = now.getDate();

    response.write(
        now + "\n");
    response.write(
        date + "/" + (month+1) + "/" + year + "\n");

    response.end();
}).listen(8888);

Tuesday, June 10, 2014

"Hello World", http server using Node.js

A simplest http server implemented using Node.js.

Create file node server.js.

var http = require("http");

http.createServer(function(request, response){
 response.writeHead(200, {"Content-Type": "text/plain"});
 response.write("Hello World! ");
 response.write("from mobile-web-app.blogspot.com");
 response.end();
}).listen(8888);

Run

$ node server.js

Then visit http://localhost:8888/ in browser to load "Hello World".