自学 websocket（七）：实战上手 实现应用状态同步

04 应用状态的client全同步

• 老规矩，先上代码再解析，功能越来越酷了，从第一篇实战一步步学习效果更好哦

• 本篇利用了广播机制和server与client的互相通信功能，实现了在所有client端保持应用的状态同步，每个独立client都能修改状态

• 同样，会一点python就行，网页代码会不会写不重要，copy运行看效果就ok

• 先说一下实现了的效果

  • server端维护了一个计数器，并将计数器的值和在线用户数量广播给当前的所有用户
  • 所以每个用户看到的界面信息是一样的
  • 同时每个用户都能修改计数器的值，并且修改后的值会告知给每一个用户，保持每个用户的界面信息同步，🐂

server 端

"""
WebSocket 服务器可以接收来自客户端的事件，处理它们以更新应用程序状态，并将更新后的状态广播给所有连接的客户端。
例如这个例子中，其中任何客户端都可以递增或递减计数器
计数器状态会同步到每个人的浏览器中，而每个人都能操作这个计数器，并被广播给每个人以更新显示
"""

import asyncio
import json
import logging
import websockets

logging.basicConfig()
Users_Set = set()
Counter_Value = 0


def tell_user_count():
    """
    用于告知大家当前在线人数
    :return:当前在线人数
    """
    return json.dumps({
   "type": "users", "count": len(Users_Set)})


def tell_counter_number():
    """
    用于告知大家当前计数器的值
    :return: 计数器的值
    """
    return json.dumps({
   "type": "value", "value": Counter_Value})


async def handler(websocket):
    """
    服务器任务:
    1. 统计当前用户人数，并广播告知大家
    2. 记录当前计数器的值
    3. 接收任何一个用户提出的修改操作，并广播通知大家更新计数器
    """
    global Users_Set, Counter_Value

    try:
        Users_Set.add(websocket)  # 添加新来的user
        websockets.broadcast(Users_Set, tell_user_count())  # 广播告知大家更新当前用户数量
        await websocket.send(tell_counter_number())  # 此时需要告知新人当前计数器的值，因为值只会在更新时才会被广播

        async for message in websocket:
            # 服务器接收到的信息只会是更新计数器的加减操作
            msg = json.loads(message)

            if msg["action"] == "minus":
                Counter_Val