DartVM服务器开发（第七天）--WebSocket

• 上一篇：DartVM服务器开发（第六天）--利用注解处理请求

上一篇文章中我们讲解了如何使用注解去处理请求，感觉是不是很方便呢？现在我们的服务器已经支持了返回html页面，处理移动端发来的请求！今天我们学习一下如何添加一个WebSocket到你的服务器，通过该编文章的学习，你将学会如何搭建一个简单的聊天室，有些小伙伴已经等不及了，那我们开始今天的学习吧！

1.建立迷你服务器

在我们写代码之前，我们先了解一下dart能干嘛？
下面我打开百度，输入dart，然后点击回车键

百度一下.png
可以看到我们熟悉的dart介绍，它被用于web、服务器、移动开发和物联网等领域的开发，等等，这里有一个目前比较热门的一个名词，物联网、对的，dart支持物联网，所以websocket使用非常的简单！

好了我们开始建立一个迷你服务器吧，这个建立迷你服务器，肯定是基于我们之前学习的服务器之上的，我这里会以请求路径为/mini去建立

staticFiles.errorPageHandler = (request) {
    if (request.uri.pathSegments.last.endsWith('.html')) {
      staticFiles.serveFile(new File(webPath + '/404.html'), request);
    } 
//new
else if (request.uri.path == '/mini') {
//当请求路径为/mini,判断为进行webScoket连接
     WebSocketManager.manager.serveRequest(request).catchError((error){
          LogUt.log.warning('webSocket异常',error,error.stackTrace);
        });
//new
    } else {
      try {
        ControllerManager.manager.requestServer(request);
      } catch (e) {
        try {
          request.response
            ..statusCode = HttpStatus.internalServerError
            ..close();
        } catch (_) {}
        LogUt.log.warning('请求消息发生异常', e,
            e.runtimeType == ArgumentError ? e.stackTrace : null);
      }
    }
  };

然后我们写一下WebSocketManager这个类,将传递的request请求升级为WebSocket请求

import 'dart:io';


class WebSocketManager{
  static WebSocketManager manager=new WebSocketManager();
  List<WebSocket> webSockets;

  WebSocketManager(){
    webSockets=[];
  }
Future serveRequest(HttpRequest request){
//判断当前请求是否可以升级为WebSocket
    if(WebSocketTransformer.isUpgradeRequest(request)){
//升级为webSocket
      return WebSocketTransformer
          .upgrade(request)
          .then((webSocket){
//添加到ist里面方便维护
        webSockets.add(socket);
//webSocket消息监听
        webSocket.listen(handMsg);
      });
    }else{
      request.response..statusCode=HttpStatus.notAcceptable
      ..writeln('该请求应为WebSocket连接')
      ..close();
      return new Future((){});
    }
  }

  //处理消息
  void handMsg(dynamic msg){
    print('收到客户端消息：$msg');

//给所有客户端回复当前客户端说了什么
   for(WebSocket webSocket in webSockets){
//判断是否有关闭代码，如果没有证明客户端当前未关闭，给它回复
        if(webSocket.closeCode==null){
//回复客户端一条消息
          webSocket.add('服务器回复: XX:$msg');
        }
    }
  }
}

上面将请求升级为WebSocket请求，然后监听收到的消息，当收到消息时，返回所有客户端当前客户端说了什么，这个就是一个简单的聊天室了，是不是很简单，那么，服务端有了，我们来弄一个客户端吧！当请求地址为/mini/client时开启一个客户端

//....
    else if(request.uri.path=='/mini/client'){
      SocketClient();
    } 
//.....

void SocketClient() async{
//客户端连接到服务端
  WebSocket client=await WebSocket.connect('ws://localhost:8080/mini');
//客户端接收消息
  client.listen((msg){
      print('客户端收到消息！');
      print(msg);
    });
//客户端发送消息
  client.add('Hello World!');
}

这里可以看到，连接的地址不再是以http开头，而是 ws://地址 的形式
下面我们来请求一下吧！http://localhost:8080/mini/client

回复.png
可以看到，我们成功的使用了webSocket进行通信

ok，今天的学习就到这里了，我们明天见！

如果想继续学习DartVM服务器开发，请关注我，学习更多骚操作！

• 下一篇：DartVM服务器开发（第八天）--http服务端框架