הוספת גירסה המציינת שהגירסה הישנה המאוחסנת במטמון של הקובץ הסטטי מעודכנת כדי להימנע משימוש

תאריך יצירת דף :

מאז הבמה הקדמית ארוכה, אם אתה רוצה לראות רק את התוכנית, אנא דלג על זה.

בסביבה

סטודיו חזותי
  • סטודיו ויזואלי 2019
הליבה ASP.NET
  • 3.1 (דף גילוח, MVC)

אודות אחסון קבצים במטמון בדפי אינטרנט

בעת ביקור בדף אינטרנט, בנוסף ל- HTML, קבצי .js (Javascript), קבצי .css (גליונות סגנונות) וקבצי תמונה יורדו ללקוח לצורך הצגה וביצוע. עם זאת, קבצי תמונה מסוימים גדולים, והורדתם בכל פעם יכולה להיות יקרה. כמו כן, .js קבצים וקבצי .css משמשים לעתים קרובות בדפים אחרים, ואין צורך להוריד אותם בכל פעם. ייתכן שקבצים אלה יישמרו באופן זמני בדפדפן שלך לאחר ההורדה. זה נקרא במטמון.

אם הקובץ מאוחסן במטמון, לדוגמה, HTML יורד משרת האינטרנט בעת ביקור באותו דף. קבצים אחרים מוצגים ומופעלים באמצעות קבצים המאוחסנים באופן מקומי מבלי להוריד אותם אם קיים מטמון. פעולה זו מפחיתה את העומס בשרת ומאפשרת ללקוח להציג את הדף במהירות גבוהה מבלי לצרוך רוחב פס של תקשורת.

בעיות הנגרמות על-ידי מטמון

קביעה אם הקבצים הממוקמים בשרת ובקבצים המאוחסנים במטמון זהים תלויה בדרך כלל בנתיב הקובץ המתואר ב- 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" />

אתר2 .css בצד הלקוח.

עם זאת, אם תעשה זאת באופן ידני, הוא עשוי להיות מסורבל ונוטה לשגיאות כדי לשנות נתיבים ולשנות שמות של קבצים פיזיים.

הוספת פרמטרי שאילתה לנתיב קובץ

אופן הפעולה של האינטרנט מאפשר לך להוסיף פרמטרי שאילתה עם שילוב של מפתחות וערכים לאחר הנתיב. במנגנון אחסון הלקוח במטמון, גם אם הקבצים הפיזיים זהים, אם פרמטרי השאילתה שונים, הם יזוהו כקבצים נפרדים. פרמטרי שאילתה הם ערכים שאין להם משמעות אם אין מטרת שימוש גם אם הם נוספים.

ניתן לצרף פרמטרי שאילתה לנתיב בתבנית הבאה:

<!-- クエリパラメータなし -->
<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

אלכוג 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>

אם אכן תבקר בדף לאחר פרסומו באינטרנט, הוא יתרחב באופן הבא:

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

מחרוזת אקראית מצורפת, אך פעולה זו אינה משתנה בכל פעם שנעשית גישה. מחרוזת זו היא ערך Hash והיא נוצרת בהתבסס על התוכן של הקובץ שאליו בוצעה הפניה. לכן, אותה מחרוזת נוצרת כל עוד תוכן הקובץ אינו משתנה. אם תוכן הקובץ משתנה, הוא ישתנה למחרוזת חדשה.

פעולה זו מבטיחה שקבצים המאוחסנים במטמון יועדפים מכיוון שאם הקבצים זהים, הנתיבים זהים. כאשר הקובץ מתעדכן, הנתיב משתנה, כך שבאפשרותך להוריד את הקובץ החדש ולהשתמש בו.

asp-append-version="true"אגב, תכונה זו היא סטנדרטית רק עבור קבצים סטטיים הממוקמים בתיקייה wwwroot. שים לב שמחרוזות אקראיות אינן מורחבות כאשר הן מוגדרות לקבצים אחרים.

אודות התוכנית לדוגמה

תבנית הפרוייקט המשמשת כברירת מחדל .js asp-append-version תבנית אתר. לאתר.css לא asp-append-version מצורף אליו.

התוכנית לדוגמה _Layout.cshtml מוסיפה אתר.js ואתר.css של asp-append-version הקובץ. אנחנו גם מוסיפים תגי img asp-append-version כהפניה.