Exemplo de sala de chat implementando HTML5-WebSocket

O método de implementar a sala de bate -papo na página da web tradicional é obter as informações relevantes do bate -papo solicitando ao servidor obter as informações de bate -papo relevantes em todas as vezes. Como o WebSocket permite que a conexão mantenha a conexão para interação de dados após conectar o servidor, o servidor pode enviar ativamente os dados correspondentes ao cliente. Para o processamento HTML5, você só precisa processar os dados de recebimento no evento de recebimento do WebSocket após a conclusão da conexão.

Uma sala de bate -papo simples tem as seguintes funções:

Registre -se para lidar com várias coisas, a saber, após a conclusão do registro, para obter toda a lista de usuários do servidor atual e o serviço enviará os usuários atualmente registrados para outros usuários on -line.

O servidor envia a mensagem recebida atualmente para outros usuários online

O servidor notificará outros usuários que desconectaram os usuários desconectados

A visualização da função da sala de bate -papo é a seguinte:

O código no servidor precisa definir apenas vários métodos para várias funções, a saber, registro, obtendo outros usuários e enviando informações. O código específico é o seguinte:

 /// <summary> /// Copyright © Henryfan 2012 /// E -mail: [email protected] /// HomePage: http://www.ikende.com /// createTime: 2012/12/7 21:45 21:45: 25 /// </summary> Classe Handler {public Long Register (Nome da String) {TCPCHANNEL Channel = MethodContext.Current.Channel; , nome); (); .clientID; Canal) Result. St.Name = canal .Data = ST;

Somente o código simples acima é necessário para concluir a função do servidor da sala de bate -papo.

 Substituição protegida void ovedisposta (remetente de objeto, canaldisposdeeventargs e) {base.ondisposto (remetente, e); Nome; this.server.getOnLines ()) {if (item! = e.Channel) item.send (msg);}}}}

O código lateral do serviço do bate -papo é concluído.

A primeira coisa a fazer para o código HTML5 é conectar -se ao servidor.

 Function connect () {canal = novo tcpchaannel (); (Result.status == NULL || Result.status == indefinido) {$ ('#dlgconnect') = Função (evt) {$ ('#dlgconnect'). ) {var item = getUser (resultado.data); .id) .remove ();} else if (resultado.type == 'say') {addSayitem (resultado.data);} else {}} (('#host'). val ());}

Mensagens diferentes são tratadas pelo número de pools de recuperação do recebimento. caixa. A ajuda da ajuda de JQuery se tornou muito simples.

Processo de chamada de registro do usuário:

 Var callRegister = {url: 'handler.register', parâmetros: {name: ''}}; valor ');

Obtenha o processo de lista de usuários on -line:

 Var Callist = {url: 'Handler.list', parâmetros: {}}; (var i = 0; i <resultado.data.length; i ++) {var item = getUser (resultado.data [i]); );}

Enviar processo de mensagem:

 Var CallAy = {url: 'Handler.say', Parâmetros: {Content:} Função Say () {Callsay.parameters.content = Meditor.html (); $ ('#Content1') [0] .focus ();}

Depois que o código é encapsulado, o processamento do WebSocket se torna muito simples.

O acima é todo o conteúdo deste artigo.