Quantcast
Channel: Node.jsタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 9328

Node.js + socket.io の簡易チャットアプリをコンテナ化したメモ

$
0
0

背景

Node.js + socket.io の簡易チャットアプリをコンテナ化した時のメモ

リンク集

Node.js Web アプリケーションを Docker 化する

Hello Worldを返す簡易Node.jsサーバーを作ってコンテナ化するドキュメント。ほぼ忘れかけているNode.jsの記憶を取り戻すことができた。

Socket.io#Get Started

socket.ioを使って簡易的なアプリを作ることができる

サンプルコード

package.json
{"name":"docker_web_app","version":"1.0.0","description":"Node.js on Docker","author":"shogo suzuki","main":"socket_server.ts","scripts":{"start":"node socket_server.js"},"dependencies":{"express":"*","socket.io":"^2.3.0"}}
Dockerfile
FROM node:14.13WORKDIR /usr/src/appCOPY package*.json ./RUN npm installCOPY . .EXPOSE 3000CMD [ "node", "socket_server.ts" ]
index.html
<!doctype html><html><head><title>Socket.IO chat</title><style>*{margin:0;padding:0;box-sizing:border-box;}body{font:13pxHelvetica,Arial;}form{background:#000;padding:3px;position:fixed;bottom:0;width:100%;}forminput{border:0;padding:10px;width:90%;margin-right:0.5%;}formbutton{width:9%;background:rgb(130,224,255);border:none;padding:10px;}#messages{list-style-type:none;margin:0;padding:0;}#messagesli{padding:5px10px;}#messagesli:nth-child(odd){background:#eee;}</style></head><script src="/socket.io/socket.io.js"></script><script src="https://code.jquery.com/jquery-3.4.1.min.js"></script><script>$(function(){varsocket=io();$('form').submit(function(e){e.preventDefault();// prevents page reloadingsocket.emit('chat message',$('#m').val());$('#m').val('');returnfalse;});socket.on('chat message',function(msg){$('#messages').append($('<li>').text(msg));});});</script><body><ulid="messages"></ul><formaction=""><inputid="m"autocomplete="off"/><button>Send</button></form></body></html>
socket_server.ts
varapp=require('express')();varhttp=require('http').createServer(app);vario=require('socket.io')(http);app.get('/',(req,res)=>{res.sendFile(__dirname+'/index.html');});io.on('connection',(socket)=>{console.log('a user connected');socket.on('chat message',(msg)=>{io.emit('chat message',msg);});});http.listen(3000,()=>{console.log('listening on *:3000');});

実行

docker build -t socket-example:1.0 .
docker run -p 3000:3000 -d socket-example:1.0

Viewing all articles
Browse latest Browse all 9328

Trending Articles