Angular JS 緩存問題

問題描述:.net mvc ng 項目,每個component,html頁面第一次加載後都會產生本地緩存,存儲下來,導致新的頁面改動不能及時刷新出來。
解決方案,.net項目中自帶一個版本文件,需要自己發佈項目時自己手動更改它,這裏我把它在構建的時候自動增加這個version. 我們會寫好一個.exe的file在build event中添加這個事件即可。然後就可以在項目中用這個版本號了。在js和html頁面後面加這個參數?v=versionNumber即可解決。
版本文件內容

(SolutionDir)Tools\AllOutput\DllVersionBuilder.exe"" (ProjectDir)Properties” 傳入文件路徑作爲參數。
在build events中添加自增版本

.exe 的源代碼如下:根據代碼開發時間去生成唯一的版本
private static void Main(string[] args)
{
if (args.Length == 1)
{
string path = args[0];
string path2 = Path.Combine(path, “CommonAssemblyInfo.cs”);
if (File.Exists(path2))
{
string text = File.ReadAllText(path2);
Regex regex = new Regex(“\d+.\d+.\d+.\d+”, RegexOptions.IgnoreCase);
MatchCollection matchCollection = regex.Matches(text);
if (matchCollection.Count > 0)
{
string value = matchCollection[0].Value;
DateTime now = DateTime.Now;
string newValue = string.Format(“{0}.{1}.{2}.{3}”, new object[]
{
now.Year - 2014,
now.Month,
now.Day,
now.Ticks.ToString().PadLeft(4, ‘0’).Substring(now.Ticks.ToString().Length - 4, 4)
});
text = text.Replace(value, newValue);
File.WriteAllText(path2, text);
}
}
}
}

用的時候先在mvc頁面中導入變量。
c#code拿到變量值。
public static class SystemInformationFactory
{
public static string AssemblyFileVersion { get; private set; }

    static SystemInformationFactory()
    {
        AssemblyFileVersion = GetAssemblyFileVersion();
    }

    private static string GetAssemblyFileVersion()
    {
        var attributes = Assembly.GetExecutingAssembly().GetCustomAttributes(typeof(AssemblyFileVersionAttribute), false);

        if (attributes.Length == 0)
        {
            return string.Empty;
        }

        var fileInformation = attributes[0] as AssemblyFileVersionAttribute;

        if (fileInformation == null)
        {
            return string.Empty;
        }

        return fileInformation.Version;
    }
}

頁面引用變量
@{
string version = “?v=” + Acc.MvcApp.Helpers.SystemInformationFactory.AssemblyFileVersion;
string environment = SysParamFactory.GetSysParam(“Environment”)}
這裏寫圖片描述

angular js systemjs.config.js配置中添加js version。

第一種方法可以在引進packages 時添加。

// packages tells the System loader how to load when no filename and/or no extension
    packages: {
        app: {
            main: './Main',
            defaultExtension: 'js' + DefaultValues.Version
        },
        rxjs: {
            defaultExtension: 'js' + DefaultValues.Version
        },
        primeng: {
            defaultExtension: 'js' + DefaultValues.Version
        }

    }

也可以在’system.locate’ 中返回這個js。

(function (global) {
SystemJS.defaultJSExtensions = true;
//var syslocate = System.locate;
//System.locate = function (local) {
//    var system = this;
//    return Promise.resolve(syslocate.call(this, local).then(function (address) {
//        return address + DefaultValues.Version;
//    }));
//};

html 頁面添加版本。 這裏用一個靜態方法,在每個component 引入頁面時候, 添加這個版本號。

這裏寫圖片描述

在 service 聲明這個變量,然後在靜態類中添加這個靜態方法返回即可。

declare var DefaultValues: any;
public static getURLVersion(url: string): string {
    return url + DefaultValues.Version;
}

運行項目可以在dubug環境中看到結果。

這裏寫圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章