Προσθέστε μια έκδοση που υποδεικνύει ότι η παλιά έκδοση του στατικού αρχείου που έχει αποθηκευτεί προσωρινά είναι ενημερωμένη, για να αποφύγετε τη χρήση

Δεδομένου ότι το μπροστινό στάδιο είναι μακρύ, αν θέλετε να δείτε μόνο το πρόγραμμα, παρακαλώ παραλείψτε το.

Περιβάλλον

Οπτικό Στούντιο

• Οπτικό Στούντιο 2019

ASP.NET Πυρήνας

• 3.1 (Σελίδα ξυραφιών, MVC)

Πληροφορίες για την προσωρινή αποθήκευση αρχείων σε ιστοσελίδες

Όταν επισκέπτεστε μια ιστοσελίδα, εκτός από HTML, .js αρχεία (Javascript), .css αρχεία (φύλλα στυλ) και τα αρχεία εικόνας λαμβάνονται στον υπολογιστή-πελάτη για εμφάνιση και εκτέλεση. Ωστόσο, ορισμένα αρχεία εικόνας είναι μεγάλα και η λήψη τους κάθε φορά μπορεί να είναι δαπανηρή. Επίσης, .js αρχεία και .css αρχεία χρησιμοποιούνται συχνά σε άλλες σελίδες και δεν χρειάζεται να τα κατεβάζετε κάθε φορά. Αυτά τα αρχεία ενδέχεται να αποθηκευτούν προσωρινά στο πρόγραμμα περιήγησής σας μετά τη λήψη. Αυτό λέγεται προσωρινή αποθήκευση.

Εάν το αρχείο είναι προσωρινά αποθηκευμένο, για παράδειγμα, γίνεται λήψη HTML από το διακομιστή Web όταν επισκέπτεστε την ίδια σελίδα. Άλλα αρχεία προβάλλονται και εκτελούνται χρησιμοποιώντας τοπικά αποθηκευμένα αρχεία χωρίς λήψη τους, εάν υπάρχει μνήμη cache. Αυτό μειώνει το φόρτο στο διακομιστή και επιτρέπει στον υπολογιστή-πελάτη να βλέπει τη σελίδα με μεγάλη ταχύτητα χωρίς να καταναλώνει εύρος ζώνης επικοινωνίας.

Προβλήματα που προκαλούνται από την προσωρινή αποθήκευση

Το αν τα αρχεία που τοποθετούνται στο διακομιστή και τα προσωρινά αποθηκευμένα αρχεία είναι τα ίδια εξαρτάται γενικά από τη διαδρομή αρχείου που περιγράφεται στην HTML. Η ίδια διαδρομή αρχείου είναι βασικά προσωρινά αποθηκευμένα αρχεία. (Μπορεί να υπάρχουν και άλλες συνθήκες, αλλά η διαδρομή του αρχείου είναι βέβαιη)

Ακολουθεί ένα παράδειγμα διαδρομής αρχείου. Ισχύουν οι παράμετροι χαρακτηριστικού href και src.

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

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

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

Ωστόσο, αυτή η συμπεριφορά μπορεί να είναι ένα πρόβλημα.

Για παράδειγμα, εάν ένας χρήστης έχει ένα αρχείο JavaScript έκδοσης 1 κατά την πρώτη πρόσβαση σε αυτό, το αρχείο JavaScript έκδοσης 1 αποθηκεύεται προσωρινά. Στη συνέχεια, ο διακομιστής δημοσιεύει το αρχείο JavaScript έκδοσης 2. Εάν η διαδρομή του αρχείου JavaScript ήταν η ίδια όταν ο χρήστης επισκέφθηκε την ίδια σελίδα, μπορεί να χρησιμοποιηθεί το αρχείο Javascript έκδοσης 1 που έχει αποθηκευτεί προσωρινά χωρίς να γίνει λήψη του αρχείου JavaScript έκδοσης διακομιστή 2. Αυτό μπορεί να προκαλέσει ελαττώματα που το κοινό δεν προτίθεται.

Αυτή τη στιγμή, νομίζω ότι συχνά βλέπετε το "Προσπαθήστε να διαγράψετε την προσωρινή μνήμη" ως ένα από τα αντίμετρα από την πλευρά του χρήστη, αλλά αυτό μπορεί να είναι η αιτία.

Πώς να αντιμετωπίσετε προβλήματα προσωρινής αποθήκευσης από την πλευρά του διακομιστή

Όπως αναφέρθηκε παραπάνω, το αν χρησιμοποιούνται προσωρινά αποθηκευμένα αρχεία εξαρτάται σε μεγάλο βαθμό από τη διαδρομή αρχείου (URL).

Επομένως, όταν ενημερώνετε ένα αρχείο, μπορείτε να το αναγκάσετε να κάνει λήψη ενός νέου αρχείου αλλάζοντας το όνομα του αρχείου.

Για παράδειγμα, εάν ένα αρχείο έκδοσης 1

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

Όταν το αρχείο ενημερώθηκε έκδοση 2

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

Το Site2 είναι .css από την πλευρά του πελάτη.

Ωστόσο, εάν το κάνετε αυτό με μη αυτόματο τρόπο, μπορεί να είναι δυσκίνητο και επιρρεπές σε σφάλματα να αλλάξετε διαδρομές και να μετονομάσετε φυσικά αρχεία.

Προσθήκη παραμέτρων ερωτήματος σε διαδρομή αρχείου

Ο τρόπος λειτουργίας του Web σάς επιτρέπει να προσθέτετε παραμέτρους ερωτήματος με συνδυασμό κλειδιών και τιμών μετά τη διαδρομή. Στο μηχανισμό προσωρινής αποθήκευσης προγράμματος-πελάτη, ακόμα και αν τα φυσικά αρχεία είναι τα ίδια, εάν οι παράμετροι ερωτήματος είναι διαφορετικές, θα αναγνωριστούν ως ξεχωριστά αρχεία. Οι παράμετροι ερωτήματος είναι τιμές που δεν έχουν νόημα εάν δεν υπάρχει σκοπός χρήσης, ακόμα και αν προστεθούν.

Οι παράμετροι ερωτήματος μπορούν να προσαρτηθούν στη διαδρομή με την ακόλουθη μορφή:

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

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

Χρησιμοποιώντας αυτόν το μηχανισμό, πρέπει να αλλάξετε τη διαδρομή, αλλά δεν χρειάζεται να μετονομάσετε το φυσικό αρχείο.

Αυτόματη προσθήκη παραμέτρων ερωτήματος στο πρόγραμμα (εσφαλμένο παράδειγμα)

Με την αυτόματη προσθήκη αυτής της παραμέτρου ερωτήματος στο πρόγραμμα, Δεν χρειάζεται να αλλάξετε με μη αυτόματο τρόπο τη διαδρομή του αρχείου, εάν αλλάξετε το στατικό αρχείο.

Ένα εύκολο παράδειγμα είναι να προσθέσετε την τρέχουσα ώρα για να υποβάλετε ερώτημα σε παραμέτρους όταν ένας χρήστης αποκτά πρόσβαση σε μια ιστοσελίδα. Είναι πολύ εύκολο γιατί νομίζω ότι μπορείς να γράψεις σε μια γραμμή σε οποιαδήποτε γλώσσα προγραμματισμού. Νομίζω ότι το παράδειγμα της γενιάς έχει την εξής:

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

Ωστόσο, αυτό έχει το μειονέκτημα ότι το πλεονέκτημα της προσωρινής αποθήκευσης χάνεται καθόλου. Η διαδρομή αλλάζει κάθε φορά που επισκέπτεστε μια ιστοσελίδα, παρόλο που είναι το ίδιο αρχείο με το προηγούμενο. Επειδή αναγνωρίζεται ως ξεχωριστό αρχείο, τα αρχεία CSS λαμβάνονται από το διακομιστή κάθε φορά. Παλαιότερες εκδόσεις των αρχείων δεν θα χρησιμοποιούνται πλέον, αλλά αυτό είναι το ίδιο με απλά να μην χρησιμοποιούν δυνατότητες προσωρινής αποθήκευσης.

ASP.NET στοιχείο ελέγχου έκδοσης προσθέτοντας παραμέτρους ερωτήματος στο Core

Alcause δεν υπάρχει πριν από ASP.NET Core παρέχει μια τυπική λύση σε αυτό το πρόβλημα προσωρινής αποθήκευσης.

Απλά πρέπει να προσθέσετε ένα χαρακτηριστικό στην ετικέτα που περιγράφει asp-append-version="true" τη διαδρομή του αρχείου ως εξής:

<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>

Εάν επισκεφθείτε πραγματικά τη σελίδα μετά τη δημοσίευσή της στο Web, θα επεκταθεί ως εξής:

<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>

Προσαρτάται μια τυχαία συμβολοσειρά, αλλά αυτό δεν αλλάζει κάθε φορά που γίνεται πρόσβαση. Αυτή η συμβολοσειρά είναι μια τιμή κατακερματισμού και δημιουργείται με βάση τα περιεχόμενα του αναφερόμενου αρχείου. Επομένως, η ίδια συμβολοσειρά δημιουργείται εφόσον τα περιεχόμενα του αρχείου δεν αλλάζουν. Εάν αλλάξουν τα περιεχόμενα του αρχείου, θα αλλάξει σε νέα συμβολοσειρά.

Αυτό εξασφαλίζει ότι προτιμώνται τα προσωρινά αποθηκευμένα αρχεία, επειδή εάν τα αρχεία είναι τα ίδια, οι διαδρομές είναι οι ίδιες. Καθώς ενημερώνεται το αρχείο, η διαδρομή αλλάζει, ώστε να μπορείτε να κάνετε λήψη και χρήση του νέου αρχείου.

asp-append-version="true"Παρεμπιπτόντως, αυτό το χαρακτηριστικό είναι στάνταρ μόνο για στατικά αρχεία που τοποθετούνται στο φάκελο wwwroot. Σημειώστε ότι οι τυχαίες συμβολοσειρές δεν αναπτύσσονται όταν ορίζονται σε άλλα αρχεία.

Πληροφορίες για το δείγμα προγράμματος

Το προεπιλεγμένο πρότυπο έργου .js asp-append-version πρότυπο τοποθεσίας. Η .css τοποθεσίας δεν asp-append-version έχει προσαρτημένη σε αυτήν.

Το δείγμα προγράμματος _Layout.cshtml προσθέτει .js τοποθεσίας και τοποθεσίας.css του asp-append-version αρχείου. Προσθέτουμε επίσης ετικέτες img ως asp-append-version αναφορά.