如何使用 MessageWebSocket 进行连接 (HTML)

项目
12/11/2015

[ 本文适用于编写 Windows 运行时应用的 Windows 8.x 和 Windows Phone 8.x 开发人员。如果你要针对 Windows 10 进行开发，请参阅最新文档 ]

本主题向你展示如何使用 Windows 运行时应用中的 MessageWebSocket 发送和接收整个数据消息。

MessageWebSocket 类提供了 WebSocket 协议基于消息的抽象。使用 MessageWebSocket 时，可以在单个操作中读取或写入整个 WebSocket 消息。相比之下，StreamWebSocket 允许使用每个读取操作读取消息各部分，而不是要求在单个操作中读取整个消息。

MessageWebSocket 通常用于消息不是非常大的情况。UTF-8 和二进制文件均受支持。对于 UTF-8 消息，必须使用 MessageWebSocket。因为 StreamWebSocket 仅支持二进制消息。

先决条件

以下示例使用 JavaScript，且基于 WebSocket 示例。有关创建使用 JavaScript 的 Windows 运行时应用的常规帮助，请参阅创建你的第一个使用 JavaScript 的 Windows 运行时应用。此外，在本主题中使用 JavaScript Promise 来完成异步操作。有关此编程模式的详细信息，请参阅在 JavaScript 中使用 Promise 进行异步编程。

为了使你的 Windows 运行时应用能够使用网络，你必须设置在项目 Package.appxmanifest 文件中所需的任何网络功能。如果你的应用需要作为客户端连接到 Internet 上的远程服务，则“Internet (客户端)”功能是必需的。如果应用需要作为客户端连接到家庭网络或工作网络上的远程服务，则“家庭/工作网络”****功能是必需的。

注意在 Windows Phone 上，只存在一种网络功能（“Internet (客户端和服务器)”），该功能支持对该应用的所有网络访问。

有关详细信息，请参阅如何设置网络功能。

使用 MessageWebSocket 发送数据

此部分中的代码将创建一个新 MessageWebSocket，连接到 WebSocket 服务器，然后将数据发送到服务器。在成功建立连接后，应用将等待调用 MessageWebSocket.MessageReceived 事件，从而指示已接收数据。

注意你可能想要向用户显示消息或者包含已发生事件的日志（例如，发起连接或发生错误时）。

打开 js 文件夹。打开你的 .js 文件并添加以下代码。

function startSend() {
   if (!messageWebSocket) {
      var webSocket = new Windows.Networking.Sockets.MessageWebSocket();
      // MessageWebSocket supports both utf8 and binary messages.
      // When utf8 is specified as the messageType, then the developer
      // promises to only send utf8-encoded data.
      webSocket.control.messageType = Windows.Networking.Sockets.SocketMessageType.utf8;
      // Set up callbacks
      webSocket.onmessagereceived = onMessageReceived;
      webSocket.onclosed = onClosed;

      var serverAddress = new Windows.Foundation.Uri(document.getElementById("serverAddress").value);

      try {
         webSocket.connectAsync(serverAddress).done(function () {
         messageWebSocket = webSocket;
         // The default DataWriter encoding is utf8.
         messageWriter = new Windows.Storage.Streams.DataWriter(webSocket.outputStream);
         messageWriter.writeString(document.getElementById("inputField").value);
         messageWriter.storeAsync().done("", sendError);

      }, function (error) {
         // The connection failed; add your own code to log or display 
         // the error, or take a specific action.
         });
      } catch (error) {
         // An error occurred while trying to connect; add your own code to  
         // log or display the error, or take a specific action.
      }

   }
   else {
      // The connection already exists; go ahead and send the message.
      messageWriter.writeString(document.getElementById("inputField").value);
      messageWriter.storeAsync().done("", sendError);          
   }
}

为 MessageWebSocket.MessageReceived 事件注册回调

发生 MessageWebSocket.MessageReceived 事件时，会调用所注册的回调并接收来自 MessageWebSocketMessageReceivedEventArgs 的数据。

将以下代码添加到 .js 文件中。

function onMessageReceived(args) {
   // The incoming message is already buffered.
   var dataReader = args.getDataReader();
   // Use the dataReader to read data from the received message
}

为 MessageWebSocket.Closed 事件注册回调

发生 MessageWebSocket.Closed 事件时，会调用所注册的回调并接收来自 WebSocketClosedEventArgs 的数据以关闭连接。

将以下代码添加到 .js 文件中。

function onClosed(args) {
   // You can add code to log or display the code and reason
   // for the closure (stored in args.code and args.reason)
   if (messageWebSocket) {
      messageWebSocket.close();
   }
   messageWebSocket = null;
}

摘要和后续步骤

在本教程中，我们已了解如何连接到 WebSocket 服务器以及如何使用 MessageWebSocket 发送和接收数据。

有关展示如何使用 WebSockets 发送和接收数据的完整示例，请参阅 WebSocket 示例。