nodejs -- socket.io, express-generator 시작 설정하기

nodejs -- socket.io, express-generator 시작 설정하기

환경 : node.js 4.2.1, express 4.13.1, socket.io 1.3.7, WebStorm 10.0.4

참고 : http://stackoverflow.com/questions/24609991/using-socket-io-in-express-4-and-express-generators-bin-www

        http://gulivert.ch/create-a-chat-app-with-nodejs-express-and-socket-io/

express-generator 로 프로젝트를 만들때, socket.io 모듈을 사용해보자.

app.js 내부에서, socket.io 를 사용할때, 아래와 같이 하면, bin/www 에서 서버와 연결하기 어렵다.

io = require('socket.io')();

==> 해결책 : 

app.io = require('socket.io')();

socket.io 로직부분은 module.exports = app; 바로 직전에 입력하자!

아래 코드는 socket.io 를 http server 와 연결한다.

app.io.attach(server);

      --> 이제 3000 번 포트로 socket.io 사용 가능해진다.

client 부분 구현하기.

브라우저에서 접속한 화면

서버에서 socket.io client 연결 성공한 화면.

<< 소스 >>

  -- express-generator 로 생기는 소스중 변화없는 것은 제외 됨...

	var express = require('express');
	var path = require('path');
	var favicon = require('serve-favicon');
	var logger = require('morgan');
	var cookieParser = require('cookie-parser');
	var bodyParser = require('body-parser');
	var routes = require('./routes/index');
	var users = require('./routes/users');
	var app = express();
	app.io = require('socket.io')();
	// view engine setup
	app.set('views', path.join(__dirname, 'views'));
	app.set('view engine', 'jade');
	// uncomment after placing your favicon in /public
	//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
	app.use(logger('dev'));
	app.use(bodyParser.json());
	app.use(bodyParser.urlencoded({ extended: false }));
	app.use(cookieParser());
	app.use(express.static(path.join(__dirname, 'public')));
	app.use('/', routes);
	app.use('/users', users);
	// catch 404 and forward to error handler
	app.use(function(req, res, next) {
	var err = new Error('Not Found');
	err.status = 404;
	next(err);
	});
	// error handlers
	// development error handler
	// will print stacktrace
	if (app.get('env') === 'development') {
	app.use(function(err, req, res, next) {
	res.status(err.status || 500);
	res.render('error', {
	message: err.message,
	error: err
	});
	});
	}
	// production error handler
	// no stacktraces leaked to user
	app.use(function(err, req, res, next) {
	res.status(err.status || 500);
	res.render('error', {
	message: err.message,
	error: {}
	});
	});
	app.io.on('connection', function(socket){
	console.log('socketio user connected...');
	});
	module.exports = app;

view raw app.js hosted with ❤ by GitHub

	doctype html
	html
	head
	meta(charset='UTF-8')
	title= title
	link(rel='stylesheet', href='/stylesheets/style.css')
	script(src='/socket.io/socket.io.js')
	script.
	// var socket = io.connect('http://192.168.0.2:3030');
	var socket = io('http://192.168.0.2:3000');
	socket.on('news', function (data) {
	console.log(data);
	socket.emit('my other event', {my: 'data'});
	});
	body
	block content

view raw layout.jade hosted with ❤ by GitHub

	{
	"name": "chat",
	"version": "0.0.0",
	"private": true,
	"scripts": {
	"start": "node ./bin/www"
	},
	"dependencies": {
	"body-parser": "~1.13.2",
	"cookie-parser": "~1.3.5",
	"debug": "~2.2.0",
	"express": "~4.13.1",
	"jade": "~1.11.0",
	"morgan": "~1.6.1",
	"serve-favicon": "~2.3.0",
	"socket.io": "^1.3.7"
	}
	}

view raw package.json hosted with ❤ by GitHub

	#!/usr/bin/env node
	/**
	* Module dependencies.
	*/
	var app = require('../app');
	var debug = require('debug')('chat: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);
	app.io.attach(server);
	/**
	* 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);
	}

view raw www hosted with ❤ by GitHub