title: Get data by socket.io in html page
body: <p>I have read a lot of tutorial, and sample code to send data from a node.js class to an html page and show this data.
  such as <a href="https://stackoverflow.com/questions/9914816/what-is-an-example-of-the-simplest-possible-socket-io-example">link1</a>, <a href="https://stackoverflow.com/questions/9545153/transfer-udp-socket-in-node-js-from-application-to-http">link2</a>,<a href="https://stackoverflow.com/questions/16190028/node-js-listen-for-udp-and-forward-to-connected-http-web-clients">link3</a>,<a href="https://www.twilio.com/blog/2015/10/getting-started-with-socket-io-adding-real-time-events-to-your-node-js-express-app.html" rel="nofollow noreferrer">link4</a>,<a href="http://danielnill.com/nodejs-tutorial-with-socketio/" rel="nofollow noreferrer">link5</a>
   and some others.</p>
  
  <p>I am getting some data from UDP listener and need to send it after some processing to an html page to show it. here is my code:</p>
  
  <p>The udp receiver:</p>
  
  <pre><code>    var server_port = process.env.OPENSHIFT_NODEJS_PORT || 8080
  var server_ip_address = process.env.OPENSHIFT_NODEJS_IP || '127.0.0.1'
  
  var http = require('http'),
      dgram = require('dgram'),
      socketio = require('socket.io'),
      fs = require('fs');
  
  var html = fs.readFileSync(__dirname + '/html/showMap.html');
  
  var app = http.createServer(function(req, res) {
    res.writeHead(200, {
      'Content-type': 'text/html'
    });
    res.end(html);
    io.sockets.emit('welcome', { message: 'Welcome!'});
  
  }).listen( server_port, server_ip_address, function() {
    console.log('Listening');
  });
  
  var io = socketio.listen(app),
      socket = dgram.createSocket('udp4');
  
  socket.on('message', function(content, rinfo) {
      console.log('got message', content, 'from', rinfo.address, rinfo.port);
      io.sockets.emit('udp message', 'content' /*content.toString()*/);
  });
  
  socket.bind(5001);
  </code></pre>
  
  <p>and my html page which is called 'showMap.html'</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;meta name="viewport" content="initial-scale=1.0, user-scalable=no"&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;Get Data&lt;/title&gt;
        &lt;script src="/socket.io/socket.io.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="results"&gt;    This text will change     &lt;/div&gt;
      &lt;div id="date"&gt;sample another temp text&lt;/div&gt;
      &lt;script&gt;
      // client code here
      var socket = io.connect('localhost', {port: 8080});
      socket.on('udp message', function(message) {
        console.log(message)
        document.getElementById("date").innerHTML = "My new text!";​
    });
    socket.on('welcome', function(data) {
      document.getElementById("results").innerHTML = data.message;
    });
      &lt;/script&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>but by sending packet, html page has not changed.
  Here is my console log of running code:</p>
  
  <blockquote>
    <p>Atis-MacBook-Pro:startWithNode muser$ npm start</p>
    
    <blockquote>
      <p>StartWithNodejs@1.0.0 start /Volumes/Project/Project/NodeJS/startWithNode
      node index.js</p>
    </blockquote>
    
    <p>Listening got message  from 127.0.0.1 64047</p>
  </blockquote>
  
  <p>What is wrong in my code?</p>