Signalr系列之虛擬目錄詳解與應用中的CDN加速實戰

目錄

對SignalR不了解的人可以直接移步下面的目錄

SignalR系列目錄

前言

前段時間一直有人問我 在用SignalR 2.0開發客服系統[系列1:實現群發通訊]這篇文章中的"/Signalr/hubs"這個虛擬目錄到底是做什么的?

由於小弟當時也是一知半解所以很牽強,這段時間特意抽空詳細了解了一番,分享如下:

正文

前面我們一直都說這個是一個虛擬目錄,那么這個東西到底是來做什么的呢?

我們先解釋一下:這個路徑前面的/Signalr/是目前你所有的SignalR的Hub在客戶端連接時所訪問的服務地址,后面的"/hubs"則是將要下載的前端JS資源,當我們在Startup類中app.MapSignalR()注冊SignalR的時候,這個地址將自動注冊,當然也可以改成自定義的代碼(對應的前端JS地址也需要更改為""GoJJSMD/hubs"")如下:

    public class OwinStartup
    {
        public void Configuration(IAppBuilder app)
        {
　　　　//注冊地址為"GoJJSMD"　
            app.MapSignalR("/GoJJSMD", new HubConfiguration());
        }
    }

效果如下:

 

看到這里,大家應該已經很明確了,其實就是在SignalR在收到第一個URL請求的時候會根據hub中的代碼動態的創建一個JS腳本放在這個目錄里面(注:這種動態創建只會在第一次訪問時發生一次),

如下圖,我們可以看到我們在Hub中所寫的方法全部在自動生成的Hub.js中有代理項:

 

說到這里,大家應該很明確了,這個虛擬目錄的作用其實就是在程序第一次被訪問的時候自動根據被訪問的Hub動態生成的JS腳本所存放的地方.

這樣還是會有弊端,比如:生成的JS沒有進行優化處理(去除空格多余的字符串什么的),也無法進行CDN加速..

那么,作為一個高端大氣上檔次的應用程序,在用戶日益暴增的今天,在必須裝逼裝到位的當下!,必須使用CDN對自己的JS下載進行優化,是吧.(- -,哈哈哈...)

接下來我們就講講如何進行CDN加速

 

CDN加速優化

上面我們說過,這些JS都是自動生成,所以進行JS的最小化優化和CDN加速的時候就很困難.

那么有沒有辦法讓這些JS手動生成,並且由我們來進行控制呢?答案是肯定的~

Signalr提供了手動生成的工具,需要Nuget下載,

在Nuget命令行中輸入如下命令:

 Install-Package Microsoft.AspNet.SignalR.Utils

下載最新版本的Utils工具包

然后我們輸入命令:

signalr ghp /path:SignalRApplication_Test/bin /o:SignalRApplication_Test/scripts/hubs.js

注意標紅的地方,改為你自己的應用程序名稱

這樣我們就可以在Scripts/目錄下看到一個叫hubs.js的文件了,如下圖:

可以打開看看和之前自動生成的是一毛一樣的.

那么這個JS怎么使用呢?

我們先修改前端的引用代碼,如下:

<script src="Scripts/jquery-1.10.2.min.js"></script>
    <script src="Scripts/jquery.signalR-2.2.0.min.js"></script>    
    <script src="Scripts/hubs.js"></script>                                                                                                                                     
    <!--這里我們注釋掉-->
    <!--<script src="GoJJSMD/hubs"></script>-->

 把虛擬目錄注釋掉,然后引入我們剛剛生成的Hub.js

接下來,修改Startup類中的配置如下:

    public class OwinStartup
    {
        public void Configuration(IAppBuilder app)
        {
    
            //配置自動生成JS代理為否
            app.MapSignalR(new HubConfiguration()
            {
                EnableJavaScriptProxies = false
            });
        
        }
    }

然后訪問頁面,會發現和之前的效果沒有任何區別,這樣就完成了對虛擬目錄的替換工作.

既然已經獲得了JS,那么獲得JS之后,如何進行CDN加速如何進行優化...我就不談了..你們懂的..

雖然到此,我們就已經可以進行自己的CDN加速了但是在開發的過程中,還是會很麻煩,每次修改hub都需要手動生成一次hubs.js

有沒有簡便的方法呢?,那必須的..

我們在項目目錄下找找..

會發現如下程序:

在packages下找到SignalR.Utils中的tools里面有一個signalr的exe程序,這個就是生成Hubs.js的小工具啦~

為了簡便,我們把他復制出來,放在項目中的signalr目錄下,如圖:

然后我們在應用程序上,右鍵,屬性,如下:

選擇生成事件,點擊編輯后期生成事件,如下圖:

 輸入如下命令行:

$(ProjectDir)signalr\signalr.exe ghp path:$(TargetDir) /o:$(ProjectDir)Scripts/hubs.js

這樣我們每當我們重新生成或者編譯的時候就會自動更新Scripts下的hubs.js了..

至此,詳解完畢..

 

寫在最后

其實SignalR的功能不僅限於聊天,可能是國內的實例都是聊天的Demo所以有點限制大家的思維,大家可以想想,Signalr的時效性,其實還可以做事實的項目監控,同步的畫板,甚至在HTML5下理論上完全是可以實現視頻聊天的,希望大家多多支持小弟,謝謝,如果喜歡或者覺得有用,可以點一個贊,同時也歡迎大神吐槽.!小弟的Q:524808775