Node.jsを触ってみた

  1. Node.jsとは
    javascriptという言語がありますが，これはよくhtmlと組み合わせてクライアント側で使われます。しかし，Node.jsというものを使えばサーバー上で動かせます。Express-generatorと組み合わせて簡単な一人用チャットを作ってみました。
  2. Node.jsのインストール
    Node.jsと検索して公式ホームページからインストールすればいいです。するとコマンドプロンプトでnodeというコマンドが使えるようになります。
  3. フォルダの作成
    どこでもいいのでフォルダを作ります。
  4. socket.ioのインストール
    コマンドプロンプトのcdでそのディレクトリに移動した後，npm install -save socket.ioでできます。
  5. フレームワークのインストール
    npm install -g express-generatorでインストールできます。
  6. アプリの原型作成
    express -e appで作れます。appの部分は何でも構いません。
  7. パッケージのインストール
    cd appでappフォルダに移動します。そのあと，npm installと入力します。この時点ですでにアプリは出来上がっています。コマンドプロンプトでnode bin\wwwと入力するとアプリを実行できます。ブラウザでhttp://localhost:3000と入力すれば，Welcome to Expressと出てくるはずです。
  8. コードを書く
    編集するのは，wwwとindex.ejsです。Addedと書いてあるところに追加するだけで完成です。
    index.ejs:
    <!DOCTYPE html>
    <html>
    <head>
      <title>
        <%= title %>
      </title>
      <link rel=’stylesheet’ href=’/stylesheets/style.css’ />
      <!–Added–>
      <script src=”socket.io/socket.io.js”></script>
      <script src=”https://code.jquery.com/jquery-1.11.1.js”></script>
    </head>
    <body>
      <h1>
        <%= title %>
      </h1>
      <p>Welcome to
        <%= title %>
      </p>
      <!–Added–>
      <form id=”form” action=”#”>
        <input id=”input” autocomplete=”off” /><button>送信</button>
      </form>
      <ul id=”messages”></ul>
      <script>
        var socketio = io();
        $(function () {
          $(‘#form’).submit(function () {
            socketio.emit(‘message’, $(‘#input’).val());
            $(‘#input’).val(”);
            return false;
          });
          socketio.on(‘message’, function (msg) {
            $(‘#messages’).append($(‘<li>’).text(msg));
          });
        });
      </script>
    </body>
    </html>

    www.js:

    #!/usr/bin/env node
    /**
    * Module dependencies.
    */
    var app = require(‘../app’);
    var debug = require(‘debug’)(‘app:server’);
    var http = require(‘http’);
    /**
    * Get port from environment and store in Express.
    */
    var port = normalizePort(process.env.PORT || ‘3000’);
    app.set(‘port’, port);
    /**
    * Create HTTP server.
    */
    var server = http.createServer(app);
    /**
    * Listen on provided port, on all network interfaces.
    */
    server.listen(port);
    server.on(‘error’, onError);
    server.on(‘listening’, onListening);
    /**
    * Normalize a port into a number, string, or false.
    */
    function normalizePort(val) {
      var port = parseInt(val, 10);
      if (isNaN(port)) {
        // named pipe
        return val;
      }
      if (port >= 0) {
        // port number
        return port;
      }
      return false;
    }
    /**
    * Event listener for HTTP server “error” event.
    */
    function onError(error) {
      if (error.syscall !== ‘listen’) {
        throw error;
      }
      var bind = typeof port === ‘string’
        ? ‘Pipe ‘ + port
        : ‘Port ‘ + port;
      // handle specific listen errors with friendly messages
      switch (error.code) {
        case ‘EACCES’:
          console.error(bind + ‘ requires elevated privileges’);
          process.exit(1);
          break;
        case ‘EADDRINUSE’:
          console.error(bind + ‘ is already in use’);
          process.exit(1);
          break;
        default:
          throw error;
      }
    }
    /**
    * Event listener for HTTP server “listening” event.
    */
    function onListening() {
      var addr = server.address();
      var bind = typeof addr === ‘string’
        ? ‘pipe ‘ + addr
        : ‘port ‘ + addr.port;
      debug(‘Listening on ‘ + bind);
    }
    /**
    * Added
    */
    var io = require(‘socket.io’)(server);
    io.on(‘connection’, function (socket) {
      socket.on(‘message’, function (msg) {
        console.log(msg);
        io.emit(‘message’, msg);
      });
    });
  9. 完成
Posted on: 2018年12月12日, by : m
Exit mobile version