노드와 socket.io로 실시간 디지털 시계를 만듭니다.
socket.io and express 를 설치하십시오.이것은 우리의 폴더 구조가 될 것입니다 ...
index.js에서 nodejs+socket.io+express 코드는 ...import express from 'express';
import http from 'http';
import { Server } from 'socket.io';
const app = express();
const expressServer = http.createServer(app);
app.use(express.json());
app.use(express.static('public'));
const io = new Server(expressServer);
io.on('connect', function (socket) {
console.log('a user is connected');
setInterval(function () {
let date = new Date().toLocaleTimeString()
socket.send(date)
}, 1000)
socket.on('disconnect', () => {
console.log('user disconnected.')
})
})
app.get('/', (req, res, next) => {
res.render('index.html');
})
expressServer.listen(4000, () => {
console.log('server is listening.')
})
index.html에서 html 코드는 ..<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Socket</title>
</head>
<body>
<h1 id="time"></h1>
</body>
<script src="/socket.io/socket.io.js"></script>
<script>
let socket = io();
socket.on("message", function (msg) {
document.getElementById("time").innerHTML = "";
document.getElementById("time").innerHTML = msg;
});
</script>
</html>
이제 브라우저에서 실시간 실행 시계를 사용해야 합니다.
감사합니다!❤
Reference
이 문제에 관하여(노드와 socket.io로 실시간 디지털 시계를 만듭니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/suhakim/create-a-real-time-digital-clock-with-node-and-socketio-53dm텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
