面试题：TypeScript实现WebSocket双向类型校验的消息发送与接收处理

Question

使用TypeScript，基于WebSocket API，编写一个简单示例，实现客户端向服务器发送上述客户端数据结构的消息，并能接收服务器返回上述服务器端数据结构的消息，同时要进行类型校验，确保数据符合预期类型。

Answer 1

1. 首先定义客户端和服务器端的数据结构类型：

   // 客户端数据结构
   type ClientData = {
       message: string;
       timestamp: number;
   };
   
   // 服务器端数据结构
   type ServerData = {
       status: string;
       data: string;
   };
   

2. 然后编写WebSocket客户端代码：

   const socket = new WebSocket('ws://localhost:8080');
   
   socket.onopen = () => {
       const clientData: ClientData = {
           message: 'Hello, Server!',
           timestamp: new Date().getTime()
       };
       socket.send(JSON.stringify(clientData));
   };
   
   socket.onmessage = (event) => {
       try {
           const serverData: ServerData = JSON.parse(event.data);
           // 进行类型校验
           if (typeof serverData.status!=='string' || typeof serverData.data!=='string') {
               throw new Error('Received data does not match ServerData structure');
           }
           console.log('Received from server:', serverData);
       } catch (error) {
           console.error('Error parsing server data:', error);
       }
   };
   
   socket.onerror = (error) => {
       console.error('WebSocket error:', error);
   };
   
   socket.onclose = () => {
       console.log('WebSocket connection closed');
   };
   

上述代码定义了客户端和服务器端的数据结构类型，并实现了一个简单的WebSocket客户端，在连接建立时向服务器发送符合ClientData结构的数据，在接收到服务器消息时进行解析并校验是否符合ServerData结构。

注意：这里假设服务器地址为ws://localhost:8080，实际应用中需要根据真实服务器地址进行调整。同时，上述代码仅为客户端部分，服务器端也需要实现相应的接收和发送逻辑来配合。