首先是Other，Other指的是除了自己以外，其它任何連線進來的Signalr使用者，都將會收到該訊息，也就是發送訊息給其他人。
同Others，使用All的意思代表，除了其他人會收到HelloWorld以外，你自己也會收到。
你現在可以利用這三種功能，寫出不同應用的SignalR程式了。
重點整理
Clients.Caller : 回應給當前使用者
Clients.Others : 回應給其他使用者
Clients.All : 回應給所有使用者
2014年6月12日 星期四
SignalR 強化您的網站應用(三) － HelloWorld2
承接著SignalR 強化您的網站應用(二) － HelloWorld，在上一篇的範例中，提到的是如何將訊息傳送給自己(Caller)，但我們要的並不會只是這樣，因為這樣沒有太大意義，因此本節要說的是另外兩個功能，All和Other。
首先是Other，Other指的是除了自己以外，其它任何連線進來的Signalr使用者，都將會收到該訊息，也就是發送訊息給其他人。
如同上一篇，在前端的部份不需要異動，因此附圖沒有貼上前端的部份，我只有附上後端的部份，在這階段，只要使用Others，其它在相同頁面下的使用者就會收到HelloWorld的訊息，如下圖：
同Others，使用All的意思代表，除了其他人會收到HelloWorld以外，你自己也會收到。
你現在可以利用這三種功能，寫出不同應用的SignalR程式了。
重點整理
Clients.Caller : 回應給當前使用者
Clients.Others : 回應給其他使用者
Clients.All : 回應給所有使用者
首先是Other，Other指的是除了自己以外，其它任何連線進來的Signalr使用者，都將會收到該訊息，也就是發送訊息給其他人。
同Others，使用All的意思代表，除了其他人會收到HelloWorld以外，你自己也會收到。
你現在可以利用這三種功能，寫出不同應用的SignalR程式了。
重點整理
Clients.Caller : 回應給當前使用者
Clients.Others : 回應給其他使用者
Clients.All : 回應給所有使用者
2014年4月9日 星期三
Image Sprites Cutting Editor
Desing by self,create SVG & js-events for use.
http://meyan.twbbs.org/Cloud/TL/en/CreateSVGPoint.htm
Drag the file(jpg,png,bmp...) from your folder/desktop to a area.
http://meyan.twbbs.org/Cloud/TL/en/CreateSVGPoint.htm
Drag the file(jpg,png,bmp...) from your folder/desktop to a area.
圖片分割定位工具
自寫的工具，用來產生切圖的功能，產生SVG及嵌入事件使用，純網頁。
http://meyan.twbbs.org/Cloud/TL/tw/CreateSVGPoint.htm
使用方法，從電腦隨便拉一張圖片上去即可
http://meyan.twbbs.org/Cloud/TL/tw/CreateSVGPoint.htm
使用方法，從電腦隨便拉一張圖片上去即可
2014年3月16日 星期日
SignalR 強化您的網站應用(二) － HelloWorld
在完成最基本的SignalR導入之後，我們可以開始屬於我們的SignalR程式，雖然SignalR主打的是訊息傳播，但一開始我們還是先來練習HelloWorld吧。
首先要做的是，Show出一個HelloWorld的Alert訊息給我們自己的簡單SignalR程式，在這之前，我們先來瞭解一下SignalR撰寫上的基本架構
這是我為了方便區別前後端所建立的資料夾，SignalRHubs及View，SignalRHubs專門置放繼承Hub的SignalR程式，View則是我們接收或傳遞結果的網頁(aspx,html,cshtml....)。
再來是建立Hub，Hub是伺服器端接收或分派訊息給您所希望的使用者所集中管理的程式碼區段，要建立Hub，只需要選擇一般的class.cs即可，接者引入Microsoft.AspNet.SignalR.Hubs及Microsoft.AspNet.SignalR兩份參考，再將該物件繼承Hub這個SignalR定義的個體就完成了。
其中，HubName及HubMethodName這兩個標籤是可以不用設定的，如果不設定它，SignalR在預設情況下，會直接使用物件名稱作為前後端溝通的名稱，但字首第一個英文字母會是小寫，如class名稱叫做MyHub的話，在js引用時必須為myHub，以此類推。
接下來先說明前端呼叫及接收的部份，之後在回到上圖，請參考：
我設置了一個Button，目的是按下它之後Alert一個訊息給我自己，僅此而已。
我們在使用SignalR的Hub模式時，我們必須先建立起一個連線，因此使用$.connection這個指令，再輸入剛才在後端定義的HubName去取得我們要使用的hub，接著使用$.connection.hub.start();將連線啟動。
後面可以看到我針對Button指定了helloworld事件去引發message_get()，而在之前ready時，有定義一個message_set()去接收結果，並alert出來，因此再回到後端程式碼的地方，可以看到負責接收前端傳來的訊息的HubMethodName取為message_get，而在message_get裡寫上了Clients.Caller.message_set這段程式碼，其中Clients指的是所有的客戶端，而Caller所指的是當下發出呼叫的那個網頁(連線)，因此我是針對我自己要去回應一件事，而那件事便是message_set。
當你把滑鼠移至message_set上時，你會發現它叫做(動態運算式)，其實它就是利用Dynamic去實作出來的，因此這邊可以隨便你愛叫什麼名稱都行，然後前端名稱跟著走就好，要注意的是，參數的數量必須一樣，否則將接收不到任何結果(HubMethod亦同)。
然後啟動我們的網站，你應該可以看到以下結果：
恭喜您，完成了第一隻SignalR程式。
與本文相關的附加資訊
展示網頁
附件下載
首先要做的是，Show出一個HelloWorld的Alert訊息給我們自己的簡單SignalR程式，在這之前，我們先來瞭解一下SignalR撰寫上的基本架構
這是我為了方便區別前後端所建立的資料夾，SignalRHubs及View，SignalRHubs專門置放繼承Hub的SignalR程式，View則是我們接收或傳遞結果的網頁(aspx,html,cshtml....)。
再來是建立Hub，Hub是伺服器端接收或分派訊息給您所希望的使用者所集中管理的程式碼區段，要建立Hub，只需要選擇一般的class.cs即可，接者引入Microsoft.AspNet.SignalR.Hubs及Microsoft.AspNet.SignalR兩份參考，再將該物件繼承Hub這個SignalR定義的個體就完成了。
其中，HubName及HubMethodName這兩個標籤是可以不用設定的，如果不設定它，SignalR在預設情況下，會直接使用物件名稱作為前後端溝通的名稱，但字首第一個英文字母會是小寫，如class名稱叫做MyHub的話，在js引用時必須為myHub，以此類推。
接下來先說明前端呼叫及接收的部份，之後在回到上圖，請參考：
我設置了一個Button，目的是按下它之後Alert一個訊息給我自己，僅此而已。
我們在使用SignalR的Hub模式時，我們必須先建立起一個連線，因此使用$.connection這個指令，再輸入剛才在後端定義的HubName去取得我們要使用的hub，接著使用$.connection.hub.start();將連線啟動。
後面可以看到我針對Button指定了helloworld事件去引發message_get()，而在之前ready時，有定義一個message_set()去接收結果，並alert出來，因此再回到後端程式碼的地方，可以看到負責接收前端傳來的訊息的HubMethodName取為message_get，而在message_get裡寫上了Clients.Caller.message_set這段程式碼，其中Clients指的是所有的客戶端，而Caller所指的是當下發出呼叫的那個網頁(連線)，因此我是針對我自己要去回應一件事，而那件事便是message_set。
當你把滑鼠移至message_set上時，你會發現它叫做(動態運算式)，其實它就是利用Dynamic去實作出來的，因此這邊可以隨便你愛叫什麼名稱都行，然後前端名稱跟著走就好，要注意的是，參數的數量必須一樣，否則將接收不到任何結果(HubMethod亦同)。
然後啟動我們的網站，你應該可以看到以下結果：
恭喜您，完成了第一隻SignalR程式。
與本文相關的附加資訊
展示網頁
附件下載
2014年3月13日 星期四
SignalR 強化您的網站應用(一) － 導入
首先推薦請先閱讀這份Blog SignalR 來達成電腦網頁與手機網頁即時互動文章，裡頭除了介紹SignalR的功用外，還有相當完整的範例檔可供下載，建議第一次想嘗試SignalR的魔力的讀者，可以抓回家試試，這份Blog文章也是我對SignalR的啟蒙之師。
在看完前段提供的連結內容，以及其範例後，是不是也想開始動手撰寫呢？如果是，有幾點事項可能要注意一下，該頁文章是2012年，當時SignalR的版本還在1.0.0，目前(2014初)已經是2.0以上版本，因此若您使用NuGet去取得SignalR套件的話，會取到2.0(以後)的版本，2.0和1.0的初始配置有些許不同 請參考 SignalR1.x To 2.0，若您的Visual Studio版本在2012(.NET4.5)以上，建議您直接使用2.0(含以後)版本，否則您就必須從NuGet上下載特定SignalR版本
例如：
Install-Package Microsoft.AspNet.SignalR -version 1.1.3安裝完成後，首先應該會跳出一份文件檔，請不要直接將它關閉，上面有指示各種不同環境下的導入方式，在這邊要注意的是，Javascript腳本在引用時的順序性，SignalR的腳本檔有兩個主要的部份，一個是腳本的本體，依照您的版本，可能是jquery.signalR-x.x.x.js，另一個則是hubs(~/signalr/hubs)，hubs的腳本來自於您所在後端程式碼中所建立並繼承Hub的物件，這些Hub物件會使用者點開網頁時，將其集中的內容送至~/signalr/hubs這個相對目錄下，這個目錄是虛擬的，所以您不需要在本機專案或網站上建立signalr/hubs這個位址。
在引用腳本時的順序：Jquery.js ->signalR.js->signalr/hubs
例如：
在成功引用之後(包含說明檔的其它步驟)，您可以打開您的測試網頁，建議先使用Chrome，並打開F12(設計模式)，如果在Source底下有看到hubs的路徑代表您成功了。
您可以開始準備寫第一隻SignalR程式了。
與本文相關的附加資訊
展示網頁
附件下載
訂閱：
文章 (Atom)