안녕하세요? 만들오 입니다.
Socket.io를 사용한 예제를 기록합니다.
const app = require('express')()
const http = require('http').createServer(app)
const io = require('socket.io')(http)
app.get('/', function(req, res){
res.sendFile(__dirname + '/index.html')
})
io.on('connection', function(socket){
socket.emit('fromServer', 'Welcome to my server.')
socket.on('event', function(data){
console.log(data)
})
socket.on('disconnect', function(){
console.log('user out')
})
})
http.listen(3000, function(){
console.log('Listening on *:3000')
})<!doctype html>
<html>
<head>
<title>Socket.IO chat</title>
</head>
<body>
<button onclick="btn()">Button</button>
</body>
<script src="/socket.io/socket.io.js"></script>
<script>
const socket = io();
socket.on('fromServer', msg => {
console.log('From server : ' + msg)
})
function btn() {
socket.emit('event', 'Hello. Socket.io')
}
</script>
</html>웹페이지(localhost:3000)에 접속하면 서버에서 클라이언트로 'Welcome to my server." 문구를 보냅니다.
클라이언트에서 버튼을 누르면 서버로 "Hello. Socket.io" 문구를 보냅니다.
가장 기초적인 예제였습니다.
* 이 글은 티스토리 카카오계정 연동정책으로 인해 이전 블로그(오코취) 글을 옮겨왔습니다.
[끝].
728x90
'소프트웨어 > 자바스크립트' 카테고리의 다른 글
| [자바스크립트] Node.js - 하위경로 이미지 파일의 경로 읽기 (0) | 2021.01.23 |
|---|---|
| [자바스크립트] Node.js - Tensorflow.js를 이용한 이미지 분류 예제 (0) | 2021.01.23 |
| [자바스크립트] Node.js - 가상 캔버스 라이브러리 pureimage 사용 (0) | 2021.01.23 |
| [자바스크립트] Node.js - 웹서버에 Websocket 통신 추가하기 (0) | 2021.01.23 |
| [자바스크립트] Node.js - 웹서버 html 파일 랜더링하기 (0) | 2021.01.23 |
댓글