采用HTML5+SignalR2.0(.Net)实现原生Web视频的代码分享

   
                 canvas = document.getElementById("canvas"), 
                context = canvas.getContext("2d"), 
                video = document.getElementById("video"),
                videoObj = { "video":  }, 
                errBack = "Video capture error: "
               
                 (navigator.getUserMedia) { 
                    navigator.getUserMedia(videoObj, =  (navigator.webkitGetUserMedia) { 
                    navigator.webkitGetUserMedia(videoObj, = data =  (navigator.mozGetUserMedia) { 
                    navigator.mozGetUserMedia(videoObj, =
                window.setInterval(0, 0, 320, 240 type = 'jpg' imgData =0.1,      
                        done:  data =
                           500)

  [HubName("getMessage")]    public class TestHub : Hub
    {        public void SendMessage(string aaaa)
        {
            Clients.All.broadcastMessage(aaaa);
        }        public void SendImage(string imagedata)
        {            //获取图像数据,转发给其他客户端
            Clients.Others.showimage(new {id=Context.ConnectionId,data=imagedata});
        }        public override System.Threading.Tasks.Task OnConnected()
        {
            Clients.Others.addKuang(Context.ConnectionId);            
            return base.OnConnected();
        }        public override System.Threading.Tasks.Task OnDisconnected(bool stopCalled)
        {
            Clients.All.romeKuang(Context.ConnectionId);            
            return base.OnDisconnected(stopCalled);
        }
    }

                // 这里是注册集线器调用的方法,和1.0不同的是需要chat.client后注册,1.0则不需要
          var chat = $.connection.getMessage;
                chat.client.broadcastMessage = function (name) {                    
                // HTML编码的显示名称和消息。
                    var encodedMsg = $(&#39;<p />&#39;).text(name).html();                    
                    // 将消息添加到该页。
                    $(&#39;#messsagebox&#39;).append(&#39;<li>&#39; + encodedMsg + &#39;</li>&#39;);
                };               
              //获取图片数据,并实时显示
                chat.client.showimage = function (data) {                    
                if ($("#" + data.id).length<=0) {                        
                var html = &#39;<p style="float: left; border: double" id="p&#39; + data.id + &#39;">\
                                <img  id="&#39;+ data.id + &#39;"    style="max-width:90%"  style="max-width:90%" alt="采用HTML5+SignalR2.0(.Net)实现原生Web视频的代码分享" >\
                                <br />\
                                <span>用户&#39;+ data.id + &#39;</span>\
                                </p>&#39;
                        $("#contextp").append(html)
                    }
                    $("#" + data.id).attr("src", data.data);
                }                // 获取用户名称。
                $(&#39;#username&#39;).html(prompt(&#39;请输入您的名称:&#39;, &#39;&#39;));                
                // 设置初始焦点到消息输入框。
                $(&#39;#message&#39;).focus();                
                // 启动连接,这里和1.0也有区别
                $.connection.hub.start().done(function () {
                    $(&#39;#send&#39;).click(function () {                        
                    var message = $(&#39;#username&#39;).html() + ":" + $(&#39;#message&#39;).val()                        
                    // 这里是调用服务器的方法,同样,首字母小写                        
                    chat.server.sendMessage(message);                        // 清空输入框的文字并给焦点.
                        $(&#39;#message&#39;).val(&#39;&#39;).focus();
                    });
                });