ASP.NET SignalR : Hub Communication Model Examples Part 3

Pada bagian ini akan diperlihatkan uji coba untuk menambahkan class SignalR Hub Class (v2) baru pada project ini untuk memperlihatkan bagaimana menangani lebih dari class Hub.

{Menulis Kode Program}

Oleh karena itu pada bagian ini akan dibuat sebuah class Hub yang sangat sederhana seperti berikut ini.

1 using System; 2 using System.Collections.Generic; 3 using System.Linq; 4 using System.Web; 5 using Microsoft.AspNet.SignalR; 6 using System.Threading; 7 8 namespace HelloSignalR 9 { 10 public class TimerHub : Hub 11 { 12 public void Knock() 13 { 14 while (true) 15 { 16 Thread.Sleep(5000); 17 string waktu = DateTime.Now.ToString(); 18 Clients.All.doknock(waktu); 19 } 20 } 21 } 22 } 23

Jika method Knock dipanggil oleh client maka seperti yang dilihat pada isi dari method tersebut terjadi pengulangan tanpa henti dimana akan mengirimkan pesan ke semua client yang terkoneksi ke server setiap 5 detik.

Berikut ini adalah isi dari halaman client yang memanfaatkan class Hub ini.

1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <title>Timer</title> 5 <script src="./Scripts/jquery-1.10.2.min.js"></script> 6 <script src="./Scripts/jquery.signalR-2.1.2.min.js"></script> 7 <script src="./signalr/hubs" type="text/javascript"></script> 8 <script type="text/javascript"> 9 $(document).ready(function () { 10 var hub = $.connection.timerHub; 11 12 hub.client.doknock = function (waktu) { 13 $('#AddText').append(waktu + ' knock knock <br />'); 14 } 15 16 $.connection.hub.start().done(function () { 17 hub.server.knock(); 18 }); 19 }); 20 </script> 21 </head> 22 <body> 23 <div id="AddText"></div> 24 </body> 25 </html>

Dari kode di atas dapat dilihat begitu koneksi berhasil maka client akan memanggil method Knock di server, kemudian di dalam method Knock di server terlihat ada pemanggilan fungsi doknock yang ada pada client.

{Uji Coba}

Di bawah ini dapat dilihat hasil dari halaman timer.html, terlihat pada halaman tersebut pesan ditampilkan setiap 5 detik.

image

Souce code lengkap yang telah ditunjukkan di atas dapat dilihat pada link berikut ini : https://github.com/rezafaisal/ASPNETSignalR

Selamat mencoba :)

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.