Javascript socket.io-如何同步新连接？
我不清楚，当我从另一台设备连接到我的网站时，如何加载页面的最后状态。我使用的是node.js+express.js+socket.io 我想更改实时点击的背景色。几乎所有的东西都工作得很好，但当我从手机上访问我的网站时，我看不到最后选择的背景颜色是白色。单击按钮后，所有内容都将同步。我的笔记本电脑和手机上分别显示为红色背景和红色背景，然后我单击，两个按钮上都显示为绿色！：。但是，如果最后一次连接看到红色或绿色bg并且它正在同步，我该怎么办 这是我的密码： index.htmlJavascript socket.io-如何同步新连接？,javascript,node.js,sockets,socket.io,synchronization,Javascript,Node.js,Sockets,Socket.io,Synchronization,我不清楚，当我从另一台设备连接到我的网站时，如何加载页面的最后状态。我使用的是node.js+express.js+socket.io 我想更改实时点击的背景色。几乎所有的东西都工作得很好，但当我从手机上访问我的网站时，我看不到最后选择的背景颜色是白色。单击按钮后，所有内容都将同步。我的笔记本电脑和手机上分别显示为红色背景和红色背景，然后我单击，两个按钮上都显示为绿色！：。但是，如果最后一次连接看到红色或绿色bg并且它正在同步，我该怎么办 这是我的密码： index.html 尝试在服务器上存储
尝试在服务器上存储当前BG颜色。当您获得一个新连接时，通过回调或init emit将该后台发送到新客户端。前端代码将实现这种颜色。你能给我举个例子吗？我试过了，但没能做到：当然，但我错过了一些东西。服务器端函数led.writeSync在哪里？如果我稍微改变一下你的方案，允许更多的转发功能，你还好吗？我想你会继续使用这个应用来练习吗？
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Test</title>
<!-- Bootstrap CSS -->
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<!-- socket.io -->
<script src="/socket.io/socket.io.js"></script>
<!-- jQuery -->
<script src="http://code.jquery.com/jquery.js"></script>
<!-- Bootstrap JavaScript -->
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"> </script>
<script>
var socket = io.connect();
function makeRed(){
socket.emit('changeBgColor', {color: 'red'});
}
function makeGreen(){
socket.emit('changeBgColor', {color: 'green'});
}
</script>
</head>
<body>
<h1 class="text-center">Change background</h1>
<br/>
<br/>
<div class="container">
<div class="col-md-12">
<button type="button" class="btn btn-primary btn-block">Change it!</button>
</div>
</div>
<script type="text/javascript">
var action = 1;
$("button").on("click", viewSomething);
function viewSomething() {
if ( action == 1 ) {
$('button').prop('disabled', false).text('Push to see red');
makeRed();
action = 2;
} else {
$('button').prop('disabled', false).text('Push to see green');
makeGreen();
action = 1;
}
}
socket.on('changeBgColorEveryWhere', function (color) {
console.log(color);
$('body').css('background', color);
});
</script>
</body>
</html>
[...]
var io = require('socket.io')(server);
io.on('connection', function (socket) {
socket.on('led', function (data) {
console.log(data);
if (data == 'on'){
led.writeSync(1);
//socket.emit('ledstatus', 'green');
}
else
{
led.writeSync(0);
//socket.emit('ledstatus', 'red');
}
});
socket.on('changeBgColor', function (color) {
console.log(color);
socket.broadcast.emit('changeBgColorEveryWhere', color.color);
socket.emit('changeBgColorEveryWhere', color.color);
});
});