本系列服务端双工通信包括两种实现方式：一、使用Socket构建；二、使用WCF构建。本文为使用WCF构建服务端的双工通信，客户端同样使用Html5的WebSocket技术进行调用。

一、创建WCF服务库Wcf.Duplex.Library：

1.定义协议的服务接口：

 [ServiceContract]

 public interface IWebSocketEchoCallback

 {

 [OperationContract(IsOneWay = true, Action = "*")]

 void Send(Message message);

 }

 [ServiceContract(CallbackContract = typeof(IWebSocketEchoCallback))]

 public interface IWebSocketEcho

 {

 [OperationContract(IsOneWay = true, Action = "*")]

 void Receive(Message message);

 }

注意：

OperationContract中的Action，一定要设置。

IWebSocketEcho接口中：只能定义一个OperationContract(IsOneWay = true, Action = "*")方法入口，否则使用WebSocket连接时会报错

IWebSocketEchoCallback 回调接口中：可以定义多个OperationContract(IsOneWay = true, Action = "*")方法

2.实现服务协议，并定义一个时钟，定时调用回调方法，发送信息给客户端：

 public class EchoService : IWebSocketEcho

 {

 IWebSocketEchoCallback _callback = null;

 public EchoService()

 {

 //获取回调信道

 _callback =

 OperationContext.Current.GetCallbackChannel<IWebSocketEchoCallback>();

 Timer time = new Timer();

 time.Elapsed += time_Elapsed;

 time.Start();

 }

 void time_Elapsed(object sender, ElapsedEventArgs e)

 {

 _callback.Send(CreateMessage("Message From WebSockets Host" + " " + DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")));

 }

 public void Receive(Message message)

 {

 if (message == null)

 {

 throw new ArgumentNullException("message");

 }

 WebSocketMessageProperty property =

 (WebSocketMessageProperty)message.Properties["WebSocketMessageProperty"];

 WebSocketContext context = property.WebSocketContext;

 var queryParameters = HttpUtility.ParseQueryString(context.RequestUri.Query);

 string content = string.Empty;

 if (!message.IsEmpty)

 {

 byte[] body = message.GetBody<byte[]>();

 content = Encoding.UTF8.GetString(body);

 }

 // Do something with the content/queryParams

 // ...

 string str = null;

 if (string.IsNullOrEmpty(content)) // Connection open message

 {

 str = "Opening connection from user " +

 queryParameters["Name"].ToString();

 }

 else // Message received from client

 {

 str = "Received message: " + content;

 }

 wcf.websocket.forweb.LogHelper.log.Error(str);

 _callback.Send(CreateMessage(str));

 }

 private Message CreateMessage(string content)

 {

 Message message = ByteStreamMessage.CreateMessage(

 new ArraySegment<byte>(

 Encoding.UTF8.GetBytes(content)));

 message.Properties["WebSocketMessageProperty"] =

 new WebSocketMessageProperty { MessageType = WebSocketMessageType.Text };

 return message;

 }

 }

二.新建WEB项目，在项目中引用第一步建立的WCF服务库Wcf.Duplex.Library。

1.打开Global.asax.cs的文件，在Application_Start增加以下代码：

RouteTable.Routes.Add(new ServiceRoute("EchoService",new ServiceHostFactory(),typeof(EchoService)));

说明：增加服务路由的时候，路由前缀可以随便设置；ServiceType，需要设置为WCF服务库的EchoService类。

2.配置WEB.Config:

<system.serviceModel>

<serviceHostingEnvironment aspNetCompatibilityEnabled="true" multipleSiteBindingsEnabled="true" />

<services>

<service name="Wcf.Duplex.Library.EchoService"><!--此处为服务类，需要修改为本项目的服务类-->

<endpoint address=""

binding="customBinding"

bindingConfiguration="webSocket"

contract="Wcf.Duplex.Library.IWebSocketEcho" /><!--此处为服务的协议接口，需要修改为本项目对应的服务接口-->

</service>

</services>

<bindings>

<customBinding>

<binding name="webSocket">

<byteStreamMessageEncoding/>

<httpTransport>

<webSocketSettings transportUsage="Always"

createNotificationOnConnection="true"/>

</httpTransport>

</binding>

</customBinding>

</bindings>

</system.serviceModel>

3.在当前项目中增加页面testWebSocket.html，使用WebSocket调用服务

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>WebSockets客户端示例</title>

</head>

<script>

var webSocket;

function connect() {

try {

var readyState = new Array("正在连接", "已建立连接", "正在关闭连接", "已关闭连接");

var host = 'ws://localhost:61413' +

window.location.pathname.replace('testWebSocket.html', 'EchoService') +

'?Name=liza';

webSocket = new WebSocket(host);

var message = document.getElementById("message");

message.innerHTML += "<p>Socket状态：" + readyState[webSocket.readyState] + "</p>";

webSocket.onopen = function () {

message.innerHTML += "<p>Socket状态：" + readyState[webSocket.readyState] + "</p>";

}

webSocket.onmessage = function (msg) {

message.innerHTML += "<p>接收信息：" + msg.data + "</p>";

}

webSocket.onclose = function () {

message.innerHTML += "<p>Socket状态：" + readyState[webSocket.readyState] + "</p>";

}

}

catch (exception) {

message.innerHTML += "<p>有错误发生</p>";

}

}

function send() {

var text = document.getElementById("text").value;

var message = document.getElementById("message");

if (text == "") {

message.innerHTML += "<p>请输入一些文字</p>";

return;

}

try {

webSocket.send(text);

message.innerHTML += "<p>发送数据：" + text + "</p>";

}

catch (exception) {

message.innerHTML += "<p>发送数据出错</p>";

}

document.getElementById("text").value = "";

}

function disconnect() {

webSocket.close();

}

</script>

<body>

<h1>WebSocket客户端示例</h1>

<div id="message"></div>

<p>请输入一些文字</p>

<input id="text" type="text">

<button id="connect" onclick="connect();">建立连接</button>

<button id="send" onclick="send();">发送数据</button>

<button id="disconnect" onclick="disconnect();">断开连接</button>

</body>

</html>

同系列其他文章：如何使用HTML5的WebSocket实现网页与服务器的双工通信(一)

如何使用HTML5的WebSocket实现网页与服务器的双工通信(二)的更多相关文章

  1. 如何使用HTML5的WebSocket实现网页与服务器的双工通信(一)

    本系列服务端双工通信包括两种实现方式:一.使用Socket构建:二.使用WCF构建.本文为使用Socket构建服务端的双工通信,客户端同样使用Html5的WebSocket技术进行调用. 一.网页客户 ...

  2. Java和WebSocket开发网页聊天室

    小编心语:咳咳咳,今天又是聊天室,到现在为止小编已经分享了不下两个了,这一次跟之前的又不大相同,这一次是网页聊天室,具体怎么着,还请各位看官往下看~ Java和WebSocket开发网页聊天室 一.项 ...

  3. html5利用websocket完成的推送功能（tomcat）

    html5利用websocket完成的推送功能(tomcat) 利用websocket和java完成的消息推送功能,服务器用的是tomcat7.0.42,一些东西是自己琢磨的,也不知道恰不恰当,不恰当 ...

  4. Springboot整合WebSocket实现网页版聊天，快来围观！

  5. 15款免费的 HTML5/CSS3 响应式网页模板

    如果你想快速制作出一个优秀的网站,网站模板一定是必不可少的.网页设计师和开发人员也可以从网站模板入手,学习先进的布局方式和编码风格.下面这个列表为大家挑选了15款免费的 HTML5/CSS3 响应式网 ...

  6. 【HTML5+MVC4】xhEditor网页编辑器图片上传

    准备工作: 创建一个MVC项目中,添加好xhEditor插件 相关用法:http://www.cnblogs.com/xcsn/p/4701497.html 注意事项:xhEditor分为v1.1.1 ...

  7. 认识HTML5的WebSocket

    在HTML5规范中,我最喜欢的Web技术就是正迅速变得流行的WebSocket API.WebSocket提供了一个受欢迎的技术,以替代我们过去几年一直在用的Ajax技术.这个新的API提供了一个方法 ...

  8. HTML5之WebSocket

    在HTML5规范中,我最喜欢的Web技术就是正迅速变得流行的WebSocket API.WebSocket提供了一个受欢迎的技术,以替代我们过去几年一直在用的Ajax技术.这个新的API提供了一个方法 ...

  9. 基于html5实现的愤怒的小鸟网页游戏

    之前给大家分享一款基于html5 canvas和js实现的水果忍者网页版,今天给大家分享一款基于html5实现的愤怒的小鸟网页游戏.这款游戏适用浏览器:360.FireFox.Chrome.Safar ...

随机推荐

  1. java中全角半角字符的相互转换的代码

    如下内容是关于java中全角半角字符的相互转换的内容.package com.whatycms.common.util; import org.apache.commons.lang.StringUt ...

  2. PAT 1140 Look-and-say Sequence

    1140 Look-and-say Sequence (20 分)   Look-and-say sequence is a sequence of integers as the following ...

  3. 【C/C++】C++11 Variadic Templates

    Variadic Templates 1.function template:利用“参数个数逐一递减”的特性,实现递归函数调用 template <typename T, typename... ...

  4. 版本控制，django缓存，跨域问题解决

    复习 分页: 1. 简单分页 2. 偏移分页 3. 加密分页 解析器:客户处理前端提交来的数据 urlencode: body体中的数据格式: key=value& formdata编码:为区 ...

  5. .net项目dll内嵌加载

    1.将dll文件作为嵌入资源添加到项目: 2.程序入口增加以下代码: public partial class App : Application { private void Application ...

  6. Code Reading: ORB-SLAM回环检测源码阅读＋注释

    之前研究过一些回环检测的内容,首先要看的自然是用词袋回环的鼻祖和正当继承人(没有冒犯VINS和LDSO的意思)ORB-SLAM.下面是我的代码注释.因为代码都是自己手打的,不是在源码上注释的,所以一些 ...

  7. 浮点型数据转整型的丢失精度问题（C++）

    如下代码:http://ideone.com/xcgHgw #include <iostream> using namespace std; int main() { // your co ...

  8. 使用后台的limit 控制每页的容量

    和上一个不使用limit的不同,如果不使用后台的限制,那么就必须自己定义一个计算属性,并且v-for这个计算的数组,而如果要用到后台的限制,那么就不需要自己计算,v-for的直接就是后台获取的数组 1 ...

  9. 有关@NgModule装饰器巩固

    declarations —— 该应用所拥有的组件. imports —— 导入 BrowserModule 以获取浏览器特有的服务,比如 DOM 渲染.无害化处理和位置(location). pro ...

  10. aspectj编程简介

    现在java生态中spring大行其道,一般使用aspectj进行切面编程使用注解方式实现,比较少使用原生的aspectj编程,网上的资料也比较少.最近工作中需要封装redisson客户端提供统一的r ...