使用SignalR實現訊息提醒

Asp.net SignalR是微軟為實現實時通訊的一個類庫。一般情況下，SignalR會使用JavaScript的長輪詢(long polling)的方式來實現客戶端和伺服器通訊，隨著Html5中WebSockets出現，SignalR也支援WebSockets通訊。另外SignalR開發的程式不僅僅限制於宿主在IIS中，也可以宿主在任何應用程式，包括控制檯，客戶端程式和Windows服務等，另外還支援Mono，這意味著它可以實現跨平臺部署在Linux環境下。

SignalR內部有兩類物件：

1. Http持久連線(Persisten Connection)物件：用來解決長時間連線的功能。還可以由客戶端主動向伺服器要求資料，而伺服器端不需要實現太多細節，只需要處理PersistentConnection 內所提供的五個事件：OnConnected, OnReconnected, OnReceived, OnError 和 OnDisconnect 即可。
2. Hub（集線器）物件：用來解決實時(realtime)資訊交換的功能，服務端可以利用URL來註冊一個或多個Hub，只要連線到這個Hub，就能與所有的客戶端共享傳送到伺服器上的資訊，同時服務端可以呼叫客戶端的指令碼。

SignalR將整個資訊的交換封裝起來，客戶端和伺服器都是使用JSON來溝通的，在服務端宣告的所有Hub資訊，都會生成JavaScript輸出到客戶端，.NET則依賴Proxy來生成代理物件，而Proxy的內部則是將JSON轉換成物件。

訊息提醒也就是當客戶有新訊息來時，在客戶端的右下角進行彈框提醒。要實現這個功能的思路是：

1. SignalR服務端推送訊息到客戶端的實現方式為呼叫客戶端的receiveMessage方法來將訊息附加到聊天記錄內，所以我們可以在客戶端的receiveMessage方法中實現彈框的邏輯。
2. 找好了方法定義的位置後，自然是去找一個比較好的彈框效果JS類庫了，這裡使用的是iNotify庫來實現的。該庫的github地址為：https://github.com/jaywcjlove/iNotify，線上測試地址為：http://jslite.io/iNotify/
3. 你看QQ或者微信的訊息提醒，訊息提醒一般是在你不在聊天的當前Tab頁面才會彈出，我們可以利用Html5 visibilitychange事件來實現，不過我這裡是通過失焦點的方式，也就是focus事件。

JavaScript

// 接收訊息 
        systemHub.client.receivePrivateMessage = function(fromUserId, userName, message) { 
       // 專題二中的程式碼 
       
      // 訊息提醒的程式碼 
    if (active == false) { 
                var iN = new iNotify({ 
                    effect: 'flash', 
                    interval: 500, 
                    audio: { 
                        file: ['/Music/msg.mp3'] 
                    }, 
                    notification: { 
                        title: "通知！", 
                        body: '您有一條新訊息' 
                    } 
                }); 
 
                iN.setTitle(true).player(); 
                iN.setFavicon(true).setTitle(true).notify(); 
            } 
        }; 
}