33 lines
699 B
HTML
33 lines
699 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>在线人数统计</title>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="app">
|
|
<p>当前在线人数：{{ onlineCount }}</p>
|
|
</div>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
|
|
<script>
|
|
let ws = new WebSocket("ws://localhost:8080/ws");
|
|
|
|
let app = new Vue({
|
|
el: '#app',
|
|
data: {
|
|
onlineCount: 1,
|
|
},
|
|
mounted() {
|
|
let self = this;
|
|
ws.addEventListener('message', function(event) {
|
|
self.onlineCount = event.data;
|
|
});
|
|
},
|
|
});
|
|
</script>
|
|
</body>
|
|
|
|
</html> |