tarayıcıları asp.net uygulamasındaki en son js ve css dosyalarını almaya zorlar

Bazı tarayıcılar js ve css dosyalarını önbelleğe alır ve siz onları zorlamadıkça yenilemez. En kolay yol nedir.

İşe yarayan bu çözümü yeni uyguladım.

Sayfanızda bir sürüm değişkeni bildirin

  public string version { get; set; }

Web.config anahtarından sürüm numarasını alın

 version = ConfigurationManager.AppSettings["versionNumber"];

Aspx sayfanızda javascript ve stil sayfalarına bu şekilde çağrı yapın

<script src="scripts/myjavascript.js?v=<%=version %>" type="text/javascript"></script>
<link href="styles/mystyle.css?v=<%=version %>" rel="stylesheet" type="text/css" />

Dolayısıyla, web.config dosyanızda version = 1.1'i 1.0'dan ayarlarsanız, tarayıcınız en son dosyaları indirecek ve bu da sizi ve kullanıcılarınızı biraz hayal kırıklığına uğratacaktır.

Daha iyi çalışan başka bir çözüm var mı yoksa bu bir web sitesi için öngörülemeyen sorunlara neden olur mu?

Bunu, komut dosyalarına sorgu parametresi olarak son değiştirilen zaman damgasını yapıştırarak çözdüm.

Bunu bir uzantı yöntemiyle ve bunu CSHTML dosyalarımda kullanarak yaptım. Not: Bu uygulama, zaman damgasını 1 dakika boyunca önbelleğe alır, bu nedenle diski çok fazla atmayız.

İşte uzatma yöntemi:

public static class JavascriptExtension {
    public static MvcHtmlString IncludeVersionedJs(this HtmlHelper helper, string filename) {
        string version = GetVersion(helper, filename);
        return MvcHtmlString.Create("<script type='text/javascript' src='" + filename + version + "'></script>");
    }

    private static string GetVersion(this HtmlHelper helper, string filename)
    {
        var context = helper.ViewContext.RequestContext.HttpContext;

        if (context.Cache[filename] == null)
        {
            var physicalPath = context.Server.MapPath(filename);
            var version = $"?v={new System.IO.FileInfo(physicalPath).LastWriteTime.ToString("MMddHHmmss")}";
            context.Cache.Add(filename, version, null,
              DateTime.Now.AddMinutes(5), TimeSpan.Zero,
              CacheItemPriority.Normal, null);
            return version;
        }
        else
        {
            return context.Cache[filename] as string;
        }
    }
}

Ve sonra CSHTML sayfasında:

 @Html.IncludeVersionedJs("/MyJavascriptFile.js")

Oluşturulan HTML'de şu şekilde görünür:

 <script type='text/javascript' src='/MyJavascriptFile.js?20111129120000'></script>

Çözümünüz işe yarıyor. Aslında oldukça popüler.

Stack Overflow bile benzer bir yöntem kullanır:

<link rel="stylesheet" href="http://sstatic.net/so/all.css?v=6184"> 

v=6184Muhtemelen SVN revizyon numarası nerede .

In ASP.NET Çekirdek (MVC 6) Bu aracılığıyla kutunun çalışır asp-append-versionetiketi yardımcı:

<script src="scripts/myjavascript.js" asp-append-version="true"></script>
<link href="styles/mystyle.css rel="stylesheet" asp-append-version="true" />

JS / CSS'niz için paketler kullanıyorsanız ASP.NET MVC bunu sizin için halleder. Paketlerinize GUID biçiminde bir sürüm numarasını otomatik olarak ekler ve yalnızca paket güncellendiğinde bu GUID'yi günceller (diğer bir deyişle kaynak dosyalardan herhangi birinde değişiklik olduğunda).

Bu, içerik yükleme sürelerini büyük ölçüde iyileştirebileceğinden, bir ton JS / CSS dosyanız varsa da yardımcı olur!

Buraya Bakın

Bunun için asp.net'te yerleşik bir yol vardır: bundling . Sadece kullan. Her yeni sürümün benzersiz "? V = XXXXXXX" soneki olacaktır. Hata ayıklama modunda paketleme, web.config dosyasındaki yap ayarını açmak için kapalıdır:

<system.web>
    <compilation debug="false" />
</system.web>

Veya RegisterBundles (BundleCollection paketleri) yöntemine ekleyin:

BundleTable.EnableOptimizations = true;

Örneğin:

BundleConfig.cs:

bundles.Add(new ScriptBundle("~/Scripts/myjavascript.js")
                .Include("~/Scripts/myjavascript.js"));

bundles.Add(new StyleBundle("~/Content/mystyle.css")
                .Include("~/Content/mystyle.css"));

_Layout.cshtml:

@Scripts.Render("~/Scripts/myjavascript.js")
@Styles.Render("~/Content/mystyle.css")

Sorudaki op tarafından verilen cevaptan daha basit bir cevap var (yaklaşım aynıdır):

Anahtarı web.config dosyasında tanımlayın:

<add key="VersionNumber" value="06032014"/>

Doğrudan aspx sayfasından uygulama ayarlarına çağrı yapın:

<link href="styles/navigation.css?v=<%=ConfigurationManager.AppSettings["VersionNumber"]%>" rel="stylesheet" type="text/css" />

Dayanarak Adam Tegan cevabı , bir web formları uygulamasında kullanılmak üzere modifiye.

.Cs sınıf kodunda:

public static class FileUtility
{
    public static string SetJsVersion(HttpContext context, string filename) {
        string version = GetJsFileVersion(context, filename);
        return filename + version;
    }

    private static string GetJsFileVersion(HttpContext context, string filename)
    {
        if (context.Cache[filename] == null)
        {
            string filePhysicalPath = context.Server.MapPath(filename);

            string version = "?v=" + GetFileLastModifiedDateTime(context, filePhysicalPath, "yyyyMMddhhmmss");

            return version;
        }
        else
        {
            return string.Empty;
        }
    }

    public static string GetFileLastModifiedDateTime(HttpContext context, string filePath, string dateFormat)
    {
        return new System.IO.FileInfo(filePath).LastWriteTime.ToString(dateFormat);
    }
}

Aspx işaretlemesinde:

<script type="text/javascript" src='<%= FileUtility.SetJsVersion(Context,"/js/exampleJavaScriptFile.js") %>'></script>

Oluşturulan HTML'de şu şekilde görünür:

<script type="text/javascript" src='/js/exampleJavaScriptFile.js?v=20150402021544'></script>

İlginç bir şekilde, bu sitenin bazı proxy kurulumlarıyla bağlantılı olarak tanımladığınız yaklaşımla ilgili sorunları var, ancak hata korumalı olması gerekir.

Bu Meta Yığın Taşması tartışmasına göz atın .

Dolayısıyla, bunun ışığında, güncellemek için bir GET parametresi değil, gerçek dosya adını kullanmak mantıklı olabilir:

href="/css/scriptname/versionNumber.css" 

Bu yapılacak daha fazla iş olsa da, dosyayı gerçekten oluşturmanız veya bunun için bir URL yeniden yazmanız gerekeceği için.

Önbelleği bozmak için yolu benzersiz kılmak için basit bir tek astar istedim. Bu benim için çalıştı:

<script src="scripts/main.js?bust_js_cache=<%=System.IO.File.GetLastWriteTime(Server.MapPath("scripts/main.js")).ToString("HH:mm:ss")%>" type="text/javascript"></script>

Dosya sayfaya en son yüklendiğinden beri değiştirildiyse, tarayıcı güncellenen dosyayı çekecektir.

Bu üretir last modifiedgelen damgası .jsyerine erişebilmek için kolay olmayabilir versiyonunun orada dosya ve aynalar.

<script src="scripts/main.js?bust_js_cache=10:18:38" type="text/javascript"></script>

Diğer bir seçenek de dosyanın sağlama toplamını almak olabilir.

İşte ASP.NET 5 / MVC 6 / vNext ile çalışan bir yaklaşım .

Adım 1: Bu ileti dizisindeki diğer yanıtlara benzer şekilde, dosyanın son yazma zamanını döndürmek için bir sınıf oluşturun. Not, bu ASP.NET 5 (veya başka) bağımlılık enjeksiyonu gerektirir.

public class FileVersionService
{
    private IHostingEnvironment _hostingEnvironment;
    public FileVersionService(IHostingEnvironment hostingEnvironment)
    {
        _hostingEnvironment = hostingEnvironment;
    }

    public string GetFileVersion(string filename)
    {
       var path = string.Format("{0}{1}", _hostingEnvironment.WebRootPath, filename);
       var fileInfo = new FileInfo(path);
       var version = fileInfo.LastWriteTimeUtc.ToString("yyyyMMddhhmmssfff");
       return version;
     }
}

Adım 2: startup.cs içine enjekte edilecek hizmeti kaydedin :

public void ConfigureServices(IServiceCollection services)
{
    ...
    services.AddScoped<FileVersionService>();
    ...
}

Adım 3: Ardından, ASP.NET 5'te, hizmeti doğrudan _Layout.cshtml gibi bir düzen görünümüne şu şekilde enjekte etmek mümkündür :

@inject Namespace.Here.FileVersionService fileVersionService
<!DOCTYPE html>
<html lang="en" class="@ViewBag.HtmlClass">
<head>
    ...
    <link href="/css/styles.css?v=@fileVersionService.GetFileVersion("\\css\\styles.css")" rel="stylesheet" />
    ...
</head>
<body>
    ...
</body>

Fiziksel yolları daha iyi birleştirmek ve dosya adını sözdizimi ile daha tutarlı bir tarzda ele almak için yapılabilecek bazı son rötuşlar vardır, ancak bu bir başlangıç ​​noktasıdır. Umarım insanların ASP.NET 5'e geçmesine yardımcı olur.

Aspnet MVC 4 sitemde biraz farklı bir teknik kullandım:

_ViewStart.cshtml:

@using System.Web.Caching
@using System.Web.Hosting
@{
    Layout = "~/Views/Shared/_Layout.cshtml";
    PageData.Add("scriptFormat", string.Format("<script src=\"{{0}}?_={0}\"></script>", GetDeployTicks()));
}

@functions
{

    private static string GetDeployTicks()
    {
        const string cacheKey = "DeployTicks";
        var returnValue = HttpRuntime.Cache[cacheKey] as string;
        if (null == returnValue)
        {
            var absolute = HostingEnvironment.MapPath("~/Web.config");
            returnValue = File.GetLastWriteTime(absolute).Ticks.ToString();
            HttpRuntime.Cache.Insert(cacheKey, returnValue, new CacheDependency(absolute));
        }
        return returnValue;
    }
}

Sonra gerçek görünümlerde:

 @Scripts.RenderFormat(PageData["scriptFormat"], "~/Scripts/Search/javascriptFile.min.js")

<?php $rand_no = rand(10000000, 99999999)?> <script src="scripts/myjavascript.js?v=<?=$rand_no"></script>

Bu benim için tüm tarayıcılarda çalışıyor. Burada PHP'yi rasgele hayır üretmek için kullandım. Kendi sunucu tarafı dilinizi kullanabilirsiniz.`

Yukarıdaki cevaptan başlayarak , yardımcının CSS dosyalarıyla da çalışmasını sağlamak için kodu biraz değiştirdim ve sadece derlemeyi yaptığınızda değil, dosyalarda bazı değişiklikler yaptığınızda her seferinde bir sürüm ekledim.

public static class HtmlHelperExtensions
{
    public static MvcHtmlString IncludeVersionedJs(this HtmlHelper helper, string filename)
    {
        string version = GetVersion(helper, filename);
        return MvcHtmlString.Create("<script type='text/javascript' src='" + filename + version + "'></script>");
    }

    public static MvcHtmlString IncludeVersionedCss(this HtmlHelper helper, string filename)
    {
        string version = GetVersion(helper, filename);
        return MvcHtmlString.Create("<link href='" + filename + version + "' type ='text/css' rel='stylesheet'/>");
    }

    private static string GetVersion(this HtmlHelper helper, string filename)
    {
        var context = helper.ViewContext.RequestContext.HttpContext;
        var physicalPath = context.Server.MapPath(filename);
        var version = "?v=" +
        new System.IO.FileInfo(physicalPath).LastWriteTime
        .ToString("yyyyMMddHHmmss");
        context.Cache.Add(physicalPath, version, null,
          DateTime.Now.AddMinutes(1), TimeSpan.Zero,
          CacheItemPriority.Normal, null);

        if (context.Cache[filename] == null)
        {
            context.Cache[filename] = version;
            return version;
        }
        else
        {
            if (version != context.Cache[filename].ToString())
            {
                context.Cache[filename] = version;
                return version;
            }
            return context.Cache[filename] as string;
        }
    }
}

Aşağıda gösterildiği gibi dosya değiştirme zamanını alın

private static string GetLastWriteTimeForFile(string pathVal)
    {
        return System.IO.File.GetLastWriteTime(HostingEnvironment.MapPath(pathVal)).ToFileTime().ToString();
    }

Bunu sorgu dizesi olarak girdi ile ekleyin

public static string AppendDateInFile(string pathVal)
    {
        var patheWithDate = new StringBuilder(pathVal);
        patheWithDate.AppendFormat("{0}x={1}",
                               pathVal.IndexOf('?') >= 0 ? '&' : '?',
                               GetLastWriteTimeForFile(pathVal));
        return patheWithDate.ToString();
    }

Bunu işaretlemeden arayın.

MVC Uzatma Yardımcısı Yaklaşımı

Bir uzantı yöntemi ekleyin

namespace TNS.Portal.Helpers
{
    public static class ScriptExtensions
    {
        public static HtmlString QueryStringScript<T>(this HtmlHelper<T> html, string path)
        {
            var file = html.ViewContext.HttpContext.Server.MapPath(path);
            DateTime lastModified = File.GetLastWriteTime(file);
            TagBuilder builder = new TagBuilder("script");
            builder.Attributes["src"] = path + "?modified=" + lastModified.ToString("yyyyMMddhhmmss");
            return new HtmlString(builder.ToString());
        }

       public static HtmlString QueryStringStylesheet<T>(this HtmlHelper<T> html, string path)
       {
        var file = html.ViewContext.HttpContext.Server.MapPath(path);
        DateTime lastModified = File.GetLastWriteTime(file);
        TagBuilder builder = new TagBuilder("link");
        builder.Attributes["href"] = path + "?modified=" + lastModified.ToString("yyyyMMddhhmmss");
        builder.Attributes["rel"] = "stylesheet";
        return new HtmlString(builder.ToString());
      }

    }
}

Bu ad alanını web.config dosyasına ekleyin

<system.web.webPages.razor>
    <host factoryType="System.Web.Mvc.MvcWebRazorHostFactory, System.Web.Mvc, Version=5.2.3.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
    <pages pageBaseType="System.Web.Mvc.WebViewPage">
      <namespaces>
        <add namespace="System.Web.Mvc" />
        <add namespace="System.Web.Mvc.Ajax" />
        <add namespace="System.Web.Mvc.Html" />
        <add namespace="System.Web.Optimization"/>
        <add namespace="System.Web.Routing" />
        <add namespace="TNS.Portal" />
        <add namespace="TNS.Portal.Helpers" />
      </namespaces>
    </pages>
  </system.web.webPages.razor>

Görünümünde kullanın

@Html.QueryStringScript("/Scripts/NPIAjaxCalls.js")
@Html.QueryStringStylesheet("/Content/StyledRadio.css")

Basitleştirilmiş önceki öneriler ve .NET Web Formları geliştiricileri için kod sağlama.

Bu, kaynağa giden dosya yolundaki hem göreli ("~ /") hem de mutlak url'leri kabul eder.

Aşağıdakileri bir statik uzantılar sınıf dosyası koyun:

public static string VersionedContent(this HttpContext httpContext, string virtualFilePath)
{
    var physicalFilePath = httpContext.Server.MapPath(virtualFilePath);
    if (httpContext.Cache[physicalFilePath] == null)
    {
        httpContext.Cache[physicalFilePath] = ((Page)httpContext.CurrentHandler).ResolveUrl(virtualFilePath) + (virtualFilePath.Contains("?") ? "&" : "?") + "v=" + File.GetLastWriteTime(physicalFilePath).ToString("yyyyMMddHHmmss");
    }
    return (string)httpContext.Cache[physicalFilePath];
}

Ve sonra Ana Sayfanızda şu şekilde çağırın:

<link type="text/css" rel="stylesheet" href="<%= Context.VersionedContent("~/styles/mystyle.css") %>" />
<script type="text/javascript" src="<%= Context.VersionedContent("~/scripts/myjavascript.js") %>"></script>

Yukarıdaki cevaba dayanarak, CSS ve JS dosyalarıyla çalışmak için küçük bir uzantı sınıfı yazdım:

public static class TimestampedContentExtensions
{
    public static string VersionedContent(this UrlHelper helper, string contentPath)
    {
        var context = helper.RequestContext.HttpContext;

        if (context.Cache[contentPath] == null)
        {
            var physicalPath = context.Server.MapPath(contentPath);
            var version = @"v=" + new FileInfo(physicalPath).LastWriteTime.ToString(@"yyyyMMddHHmmss");

            var translatedContentPath = helper.Content(contentPath);

            var versionedContentPath =
                contentPath.Contains(@"?")
                    ? translatedContentPath + @"&" + version
                    : translatedContentPath + @"?" + version;

            context.Cache.Add(physicalPath, version, null, DateTime.Now.AddMinutes(1), TimeSpan.Zero,
                CacheItemPriority.Normal, null);

            context.Cache[contentPath] = versionedContentPath;
            return versionedContentPath;
        }
        else
        {
            return context.Cache[contentPath] as string;
        }
    }
}

Şunun gibi bir şey yazmak yerine:

<link href="@Url.Content(@"~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.Content(@"~/Scripts/bootstrap.min.js")"></script>

Şimdi yazabilirsiniz:

<link href="@Url.VersionedContent(@"~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" />
<script src="@Url.VersionedContent(@"~/Scripts/bootstrap.min.js")"></script>

Yani basitçe yerine Url.Contentsahip Url.VersionedContent.

Oluşturulan URL'ler şuna benzer:

<link href="/Content/bootstrap.min.css?v=20151104105858" rel="stylesheet" type="text/css" />
<script src="/Scripts/bootstrap.min.js?v=20151029213517"></script>

Uzantı sınıfını kullanırsanız, fiziksel bir dosya olmadığı için MapPatharamanın çalışmaması durumunda hata işleme eklemek isteyebilirsiniz contentPath.

Her sayfayı değiştirmeden yaptığınız şeyi yapmak için benzer bir yol kullanıyorum. Bir PreRender etkinliği ana dosya eklendi. Mantığımı tek bir yerde tutar ve hem js hem de css dosyalarına uygulanabilir.

protected void Page_PreRender(object sender, EventArgs e)
    {
        HtmlLink link = null;
        LiteralControl script = null;


        foreach (Control c in Header.Controls)
        {
            //StyleSheet add version
            if (c is HtmlLink)
            {
                link = c as HtmlLink;


                if (link.Href.EndsWith(".css", StringComparison.InvariantCultureIgnoreCase))
                {
                    link.Href += string.Format("?v={0}", ConfigurationManager.AppSettings["agVersion"]);
                }

            }

            //Js add version
            if (c is LiteralControl)
            {
                script = c as LiteralControl;

                if (script.Text.Contains(".js"))
                {
                    var foundIndexes = new List<int>();


                    for (int i = script.Text.IndexOf(".js\""); i > -1; i = script.Text.IndexOf(".js\"", i + 1))
                    {

                        foundIndexes.Add(i);
                    }

                    for (int i = foundIndexes.Count - 1; i >= 0; i--)
                    {

                        script.Text = script.Text.Insert(foundIndexes[i] + 3, string.Format("?v={0}", ConfigurationManager.AppSettings["agVersion"]));
                    }
                }

            }

        }
    }

Komut Dosyalarının veya Stillerin DefaultTagFormat özelliğini geçersiz kılabilirsiniz.

Scripts.DefaultTagFormat = @"<script src=""{0}?v=" + ConfigurationManager.AppSettings["pubversion"] + @"""></script>";
Styles.DefaultTagFormat = @"<link href=""{0}?v=" + ConfigurationManager.AppSettings["pubversion"] + @""" rel=""stylesheet""/>";

ASP.Net Ajax uygulamamda bu sorunu çözmek için bir uzantı oluşturdum ve ardından ana sayfada çağırdım.

Daha fazla ayrıntı için bağlantı üzerinden gidebilirsiniz .

Aşağıdaki konsept ile .net uygulamasında css sürümlemeyi gerçekleştirmenin kolay ve akıllı yolu .. arka uç kodu yazmaya gerek yok.

<link href="<%="../../App_Themes/Base/css/main.css?v="+ DateTime.Now.ToString("yyyyMMddhhmmss") +""%>" rel="stylesheet" />

Bunu bu şekilde yapmanın temel sorunu, css veya js dosyalarınızda her değişiklik yaptığınızda kodunuzdaki sürüm numaranızı güncellemeyi hatırlamanız gerekmesidir.

Bunu yapmanın muhtemelen daha iyi bir yolu, css veya js dosyalarınızın her biri için garantili benzersiz bir parametre ayarlamaktır, örneğin:

<script src="scripts/myjavascript.js?_=<%=DateTime.Now.Ticks%>" type="text/javascript"></script>
<link href="styles/mystyle.css?_=<%=DateTime.Now.Ticks%>" rel="stylesheet" type="text/css" />

Bu, dosyaları her seferinde sunucudan istenmeye zorlar, bu aynı zamanda sitenizin sayfa yüklendikten sonra o kadar performanslı olmayacağı anlamına gelir, çünkü bu dosyalar hiçbir zaman önbelleğe alınmaz ve her seferinde gereksiz bant genişliği kullanır.

Esasen, her değişiklik yapıldığında sürüm numarasını güncellemeyi hatırlayabilirseniz, bunu nasıl yaptığınızdan kurtulabilirsiniz.

ASP.NET sayfaları için aşağıdakileri kullanıyorum

ÖNCE

<script src="/Scripts/pages/common.js" type="text/javascript"></script>

SONRA (yeniden yüklemeye zorla)

 <script src="/Scripts/pages/common.js?ver<%=DateTime.Now.Ticks.ToString()%>" type="text/javascript"></script>

DateTime.Now.Ticks eklemek çok iyi çalışıyor.