[ASP.NET 自訂控制項]將javascript、image、css內嵌至dll裡

  • 14804
  • 0

[ASP.NET 自訂控制項]將javascript、image、css內嵌至dll裡

之前在AJAX的Source Code裡面,就發現他龐大的JS都是內嵌在類別庫裡面,

這樣不但不用擔心dll裡相關的javascript或圖檔,在部署上路徑參考的問題,也不用擔心會MISS掉檔案,

更不用擔心不小心被其他天才的開發人員修改到路徑或檔案內容。

 

前兩次都是在MSDN上跟著一步一步做,無奈我天資愚昧,怎麼試我的control就是抓不到javascript,原始碼上就是沒src該js。

最後google了一下,又是在保哥的BLOG上,發現保哥有分享過,如何將 JavaScript, CSS, Images 檔案內含在 .NET 組件裡

這次自己try了一下,終於成功把CustomControl需要的js,嵌在dll裡面。

順便寫了個公用class,用來判斷要用Page.ClientScript註冊,還是要用ScriptManager註冊。

 

將js、img、css加入元件的內嵌資源,除了部署與開發上很大的好處之外,

另外就是有看到文章指出,dll會被Cache,當網頁上的javascript httpRequest或圖檔、css檔的httpRequest,都可以透過快取來加速下載速度。


Download Source Code: CustomLabel_JS_Embed.rar


 

以下介紹幾個相關的要點:

Step1:在Joey的類別庫裡面,加入相關的JavaScript。並將該JavaScript的建置動作屬性設定為「內嵌資源」。

js設定為內嵌資源

 

Step2:修改Joey類別庫裡面的AssemblyInfo.cs,記得要把方案「顯示所有檔案」打開,在Properties裡面。把要內嵌的javascript,透過System.Web.UI.WebResource()來指到對應的javascript。

[assembly: System.Web.UI.WebResource("Joey.CheckCompID.js", "text/js")]
[assembly: System.Web.UI.WebResource("Joey.CheckCustID.js", "text/js")]
[assembly: System.Web.UI.WebResource("Joey.JoeyTextBoxValidator.js", "text/js")]

 

Step3:為了讓我們的自訂控制項,可以部署在有AJAX的環境與沒有AJAX的環境,因為若畫面上有使用ScriptManager,註冊js需透過Scriptmanager,透過Page.ClientScript註冊可能會導致檔案沒有加進src中。所以撰寫了一支公用的class,稱做RegisterJS.cs。

using System;
using System.Collections.Generic;
using System.Text;
using System.Web;
using System.Web.UI;


namespace Joey
{
    public class RegisterJS
    {
        /// <summary>
        /// Registers the client script include.
        /// 判斷當頁面有ScriptManager時,應透過ScriptManager註冊JS,
        /// 使用Page.ClientScript註冊會在UpdatePanel Partial Render時遺漏參考。
        /// </summary>
        /// <param name="NowPage">The now page.</param>
        /// <param name="JavascriptUniqueName">Name of the javascript unique.</param>
        /// <param name="FileUrl">The file URL.</param>
        public static void RegisterClientScriptInclude(object NowPage,string JavascriptUniqueName, string FileUrl)
        {
            Page objPage = NowPage as Page;
            if (objPage != null)
            {
                ScriptManager sm = ScriptManager.GetCurrent(objPage);
                if (sm == null)
                {
                    objPage.ClientScript.RegisterClientScriptInclude(JavascriptUniqueName, FileUrl);
                }
                else
                {
                    ScriptManager.RegisterClientScriptInclude(objPage, objPage.GetType(), JavascriptUniqueName, FileUrl);  
                }
            }            
        }

    }
}

 

Step4:接著就是要把原本使用Page.ClientScript.RegisterClientScriptInclude的方式,改為透過RegisterJS來註冊。路徑的部分,改使用GetWebResourceUrl()來取得。

                    string strJsLoc = Page.ClientScript.GetWebResourceUrl(this.GetType(), "Joey.JoeyTextBoxValidator.js");
                    RegisterJS.RegisterClientScriptInclude(this.Page, "JoeyTextBoxValidator", strJsLoc); 

 

Step5:接著只需要建置Joey類別庫,就會產生dll檔。直接將該dll加入參考,不需要額外include javascript,仍然可以動態的判斷要驗證何種規則。


或許您會對下列培訓課程感興趣:

  1. 2021/1/9:【針對遺留代碼加入單元測試的藝術】202101 - 台北
  2. 2021/1/10:【極速開發+】 202101 台北
  3. 2021/2/20~2021/2/21:【演化式設計】測試驅動開發與持續重構 202102

想收到第一手公開培訓課程資訊,或想詢問企業內訓、顧問、教練、諮詢服務的,請洽 Facebook 粉絲專頁:91敏捷開發之路