Voeg een versie toe die aangeeft dat de oude versie van het statische bestand in de cache up-to-date is om te voorkomen dat deze wordt gebruikt

Aangezien de voorste fase lang is, als u alleen het programma wilt zien, sla het dan over.

Milieu

Visuele studio

• Visuele Studio 2019

ASP.NET Kern

• 3.1 (De pagina van het scheermes, MVC)

Bestanden in cache op webpagina's in cache plaatsen

Wanneer u een webpagina bezoekt, worden naast HTML .js bestanden (Javascript), .css bestanden (stylesheets) en afbeeldingsbestanden naar de client gedownload voor weergave en uitvoering. Sommige afbeeldingsbestanden zijn echter groot en het kan duur zijn om ze elke keer te downloaden. Ook .js bestanden en .css bestanden worden vaak op andere pagina's gebruikt en het is niet nodig om ze elke keer te downloaden. Deze bestanden kunnen tijdelijk worden opgeslagen in uw browser na het downloaden. Dit wordt caching genoemd.

Als het bestand bijvoorbeeld in de cache wordt opgeslagen, wordt HTML gedownload van de webserver wanneer u dezelfde pagina bezoekt. Andere bestanden worden bekeken en uitgevoerd met lokaal opgeslagen bestanden zonder ze te downloaden als er een cache is. Dit vermindert de belasting op de server en stelt de client in staat om de pagina op hoge snelheid te bekijken zonder communicatiebandbreedte te verbruiken.

Problemen veroorzaakt door caching

Of de bestanden die op de server worden geplaatst en de bestanden in de cache hetzelfde zijn, hangt over het algemeen af van het bestandspad dat in de HTML wordt beschreven. Hetzelfde bestandspad bestaat in feite uit bestanden in de cache. (Er kunnen andere voorwaarden zijn, maar het bestandspad is zeker)

Hieronder volgt een voorbeeld van een bestandspad. De kenmerkparameters van href en src zijn van toepassing.

<!-- スタイルシート (.css) -->
<link rel="stylesheet" href="/css/site.css" />

<!-- 画像ファイル -->
<img src="/image/sample.png" alt="サンプル画像" />

<!-- JavaScript (.js) -->
<script src="/js/site.js"></script>

Dit gedrag kan echter een probleem zijn.

Als een gebruiker bijvoorbeeld een JavaScript-bestand versie 1 heeft wanneer deze voor het eerst wordt geopend, wordt het JavaScript-bestand van versie 1 in de cache opgeslagen. De server publiceert vervolgens het JavaScript-bestand versie 2. Als het JavaScript-bestandspad hetzelfde was toen de gebruiker dezelfde pagina bezocht, kan het Javascript-bestand van versie 1 in de cache worden gebruikt zonder het JavaScript-bestand van serverversie 2 te downloaden. Dit kan defecten veroorzaken die het publiek niet van plan is.

Op dit moment denk ik dat je vaak "Probeer de cache te verwijderen" ziet als een van de tegenmaatregelen aan de gebruikerskant, maar dit kan de oorzaak zijn.

Hoe om te gaan met cacheproblemen aan de serverzijde

Zoals hierboven vermeld, hangt de vraag of bestanden in de cache worden gebruikt grotendeels af van het bestandspad (URL).

Wanneer u een bestand bijwerkt, kunt u het daarom dwingen een nieuw bestand te downloaden door de bestandsnaam te wijzigen.

Als bijvoorbeeld een versie 1-bestand

<link rel="stylesheet" href="/css/site.css" />

Toen het bestand werd bijgewerkt versie 2

<link rel="stylesheet" href="/css/site2.css" />

Site2 is .css aan de kant van de klant.

Als u dit echter handmatig doet, kan het omslachtig en foutgevoelig zijn om paden te wijzigen en de naam van fysieke bestanden te wijzigen.

Queryparameters toevoegen aan een bestandspad

Met de manier waarop het web werkt, kunt u queryparameters toevoegen met een combinatie van sleutels en waarden na het pad. In het clientcachingmechanisme, zelfs als de fysieke bestanden hetzelfde zijn, worden de queryparameters herkend als afzonderlijke bestanden. Queryparameters zijn waarden die geen betekenis hebben als er geen gebruiksdoel is, zelfs niet als ze worden toegevoegd.

Queryparameters kunnen in de volgende indeling aan het pad worden toegevoegd:

<!-- クエリパラメータなし -->
<link rel="stylesheet" href="/css/site.css" />

<!-- クエリパラメータあり -->
<link rel="stylesheet" href="/css/site.css?key=value" />

Door dit mechanisme te gebruiken, moet u het pad wijzigen, maar u hoeft de naam van het fysieke bestand niet te wijzigen.

Queryparameters automatisch toevoegen in het programma (slecht voorbeeld)

Door deze queryparameter automatisch toe te voegen aan het programma, U hoeft het bestandspad niet handmatig te wijzigen als u het statische bestand wijzigt.

Een eenvoudig voorbeeld is het toevoegen van de huidige tijd voor queryparameters wanneer een gebruiker een webpagina opent. Het is heel gemakkelijk omdat ik denk dat je in één regel in elke programmeertaal kunt schrijven. Ik denk dat het generatievoorbeeld er als volgt uitziet:

<link rel="stylesheet" href="/css/site.css?20210223120000" />

Dit heeft echter als nadeel dat het voordeel van caching 200000000000000000000000000000000000000 Het pad verandert elke keer dat u een webpagina bezoekt, ook al is het hetzelfde bestand als het vorige bestand. Omdat het wordt herkend als een afzonderlijk bestand, worden css-bestanden elke keer van de server gedownload. Oudere versies van bestanden worden niet langer gebruikt, maar dit is hetzelfde als het simpelweg niet gebruiken van caching-functies.

ASP.NET versiebeheer door queryparameters toe te voegen in Core

Omdat er geen pre-ASP.NET biedt Core een standaardoplossing voor dit cachingprobleem.

U hoeft alleen maar een kenmerk toe te voegen aan de tag die asp-append-version="true" het bestandspad als volgt beschrijft:

<link rel="stylesheet" href="~/css/site.css" asp-append-version="true"/>
<img src="/image/sample.png" asp-append-version="true"/>
<script src="~/js/site.js" asp-append-version="true"></script>

Als u de pagina daadwerkelijk bezoekt nadat deze op internet is gepubliceerd, wordt deze als volgt uitgevouwen:

<link rel="stylesheet" href="/css/site.css?v=S2ihmzMFFc3FWmBWsR-NiddZWa8kbyaQYBx2FDkIoHs" />
<img src="/image/sample.png?v=Z0tUqQmLt_3L_NSzPmkbZKxL8cMxglf08BwWb5Od5z4" />
<script src="/js/site.js?v=dLGP40S79Xnx6GqUthRF6NWvjvhQ1nOvdVSwaNcgG18"></script>

Er wordt een willekeurige tekenreeks toegevoegd, maar dit verandert niet elke keer dat toegang wordt gemaakt. Deze tekenreeks is een hash-waarde en wordt gegenereerd op basis van de inhoud van het bestand waarnaar wordt verwezen. Daarom wordt dezelfde tekenreeks gegenereerd zolang de inhoud van het bestand niet verandert. Als de inhoud van het bestand wordt gewijzigd, wordt het gewijzigd in een nieuwe tekenreeks.

Dit zorgt ervoor dat bestanden in de cache de voorkeur hebben, want als de bestanden hetzelfde zijn, zijn de paden hetzelfde. Wanneer het bestand wordt bijgewerkt, verandert het pad, zodat u het nieuwe bestand kunt downloaden en gebruiken.

asp-append-version="true"Trouwens, dit kenmerk is standaard alleen voor statische bestanden die in de map wwwroot worden geplaatst. Houd er rekening mee dat willekeurige tekenreeksen niet worden uitgevouwen wanneer deze zijn ingesteld op andere bestanden.

Informatie over het voorbeeldprogramma

De standaardprojectsjabloon .js asp-append-version sitesjabloon. Site.css heeft geen asp-append-version bijlage.

Het voorbeeldprogramma _Layout.cshtml voegt site.js en site.css van asp-append-version het bestand toe. We voegen ook img-tags toe als asp-append-version referentie.