Fingerprinting extern generierten statischen Inhalt (ASP.NET + browserify)

9

Nodejs browserify ist beim Erstellen modularer js-Apps großartig. Wenn gulp ebenfalls Teil des Setups ist, wird der Workflow weiter verbessert , um zu verwalten und Abhängigkeiten auflösen, richtig bündeln, ugify mit sourcemaps, auto-polyfill, jshint, test ... Das ist ziemlich praktisch sowohl für css als auch für Pre-Processing, Auto-Prefixing, Linting, Ressourcen einbetten und Generieren Dokumentation.

TL; DR: Mit npm / bower erhalten Sie Zugriff auf ein umfangreiches Ecosystem von Front-End-Bibliotheken, wodurch sich nodejs perfekt für den Aufbau (nicht unbedingt das Serving!) von clientseitigem Code eignet. Tatsächlich ist die Verwendung für clientseitigen Code so großartig, dass npm , bower und grunt / gulp im VS 2015 out-of-the-box unterstützt werden. In der Zwischenzeit haben wir einen Schluck eingeführt Aufgabe, die pre-build ausführt und dist js / css (Bündelausgabe) schreibt.

Was ist ein guter Weg, um externe statische Inhalte mit Fingerabdruck-URLs zu verknüpfen? Auf lange Sicht wären wir ideal in der Lage, clientseitige Inhalte vollständig zu trennen, sodass sie unabhängig voneinander erstellt und auf CDN bereitgestellt werden können Ich muss auch den Rest der Anwendung erstellen.

    
o.v. 19.04.2015, 04:22
quelle

2 Antworten

1

Probleme mit CSS

Da CSS relative URLs auf Bilder verweist, die sich ebenfalls ändern können, müssen Sie vor dem Starten der App eine Menge Hash-Berechnungen berechnen, was die Generierung der Signatur-URL verlangsamt. Es stellt sich heraus, dass das Schreiben von Code zum Nachverfolgen des letzten Änderungsdatums nicht mit CSS-Bild-URLs funktioniert. Wenn also eines der in css genannten Bilder geändert wird, muss css ebenfalls geändert werden.

Probleme mit der Versionierung einzelner Dateien wie jquery-1.11.1.js

Zuerst bricht es Quellcode Versionierung, Git oder eine Versionskontrolle wird app-script-1.11.js und app-script-1.12.js als zwei verschiedene Dateien zu identifizieren, es wird schwer sein, Geschichte zu pflegen.

Für jquery funktioniert es, da es eine Bibliothek erstellt und meistens werden Sie es nicht ändern, wenn Sie Ressourcen auf Ihrer Seite einschließen, aber während der Erstellung der Anwendung werden wir viele JavaScript-Dateien haben und die Änderung der Version erfordert jedoch eine Änderung jeder Seite , einzelne Include-Datei könnte es tun, aber betrachten Sie viele CSS und viele Bilder.

Letztes Aktualisierungsdatum im Cache als URL-Präfix

gespeichert

Also mussten wir eine Versionierung des statischen Inhalts wie /cached/lastupdate/ erstellen, dies ist nichts anderes als ein URL-Präfix für das statische Asset. lastupdate ist nichts anderes als das zuletzt aktualisierte Datum und die Uhrzeit der angeforderten Datei. Es gibt auch einen Beobachter, der den Cache-Schlüssel aktualisiert, wenn die Datei während des Anwendungsbereichs geändert wird.

Nun, einer der einfachsten Ansätze ist die Verwendung eines Versionsschlüssels in der URL.

Definieren Sie die Version in den App-Einstellungen wie folgt

%Vor%

Beziehe dich jetzt auf jeder Seite auf deinen statischen Inhalt als

%Vor%

Beim Rendern wird Ihre Seite als (ohne CDN) gerendert

%Vor%

Mit CDN als

%Vor%

Wenn Sie die Version in den URL-Pfad anstelle des Abfrage-Strings einfügen, wird CDN besser ausgeführt, da Abfrage-Strings in der CDN-Konfiguration ignoriert werden können (was normalerweise der Standardfall ist).

CachedRoute-Klasse von Ссылка

%Vor%

Verwenden der Dateiänderungszeit anstelle der Version

%Vor%

Dies behält die Version basierend auf der letzten Änderung bei, erhöht jedoch den Aufruf von System.IO.FileInfo bei jeder Anfrage. Sie können jedoch ein weiteres Wörterbuch erstellen, um diese Informationen zwischenzuspeichern und nach Änderungen zu suchen, aber es ist viel Arbeit.

    
Akash Kava 26.04.2015 04:43
quelle
-1

Version einfach nach jeder Veröffentlichung und aktualisieren Sie die URL:

Ссылка 2.2 /module.js

    
SaphuA 21.04.2015 06:52
quelle