Merge pull request #30776 from xrstf/cache-deck-assets

Cache Deck assets differently
kubernetes · Sep 26, 2023 · 7e338dd · 7e338dd
2 parents a993878 + 2f40dd0
commit 7e338dd
Show file tree

Hide file tree

Showing 10 changed files with 30 additions and 36 deletions.
diff --git a/prow/cmd/deck/main.go b/prow/cmd/deck/main.go
@@ -731,25 +731,19 @@ func loadToken(file string) ([]byte, error) {
 
 func handleCached(next http.Handler) http.Handler {
 	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
-		// This looks ridiculous but actually no-cache means "revalidate" and
-		// "max-age=0" just means there is no time in which it can skip
-		// revalidation. We also need to set must-revalidate because no-cache
-		// doesn't imply must-revalidate when using the back button
-		// https://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html#sec14.9.1
-		// TODO: consider setting a longer max-age
-		// setting it this way means the content is always revalidated
-		w.Header().Set("Cache-Control", "public, max-age=0, no-cache, must-revalidate")
+		// Since all static assets have a cache busting parameter
+		// attached, which forces a reload whenever Deck is updated,
+		// we can send strong cache headers.
+		w.Header().Set("Cache-Control", "public, max-age=315360000") // 315360000 is 10 years, i.e. forever
 		next.ServeHTTP(w, r)
 	})
 }
 
 func setHeadersNoCaching(w http.ResponseWriter) {
-	// Note that we need to set both no-cache and no-store because only some
-	// browsers decided to (incorrectly) treat no-cache as "never store"
-	// IE "no-store". for good measure to cover older browsers we also set
-	// expires and pragma: https://stackoverflow.com/a/2068407
-	w.Header().Set("Cache-Control", "no-cache, no-store, must-revalidate")
-	w.Header().Set("Pragma", "no-cache")
+	// This follows the "ignore IE6, but allow prehistoric HTTP/1.0-only proxies"
+	// recommendation from https://stackoverflow.com/a/2068407 to prevent clients
+	// from caching the HTTP response.
+	w.Header().Set("Cache-Control", "no-store, must-revalidate")
 	w.Header().Set("Expires", "0")
 }
 

diff --git a/prow/cmd/deck/template/base.html b/prow/cmd/deck/template/base.html
@@ -26,16 +26,16 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
   {{end}}
   <title>{{block "title" .Arguments}}Prow{{ end }}</title>
-  <link rel="stylesheet" type="text/css" href="/static/style.css">
-  <link rel="stylesheet" type="text/css" href="/static/extensions/style.css">
-  <link href="https://fonts.googleapis.com/css?family=Roboto:400,700" rel="stylesheet">
+  <link rel="stylesheet" type="text/css" href="/static/style.css?v={{deckVersion}}">
+  <link rel="stylesheet" type="text/css" href="/static/extensions/style.css?v={{deckVersion}}">
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:400,700">
   <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
   <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">
-  <script type="text/javascript" src="/static/extensions/script.js"></script>
+  <script type="text/javascript" src="/static/extensions/script.js?v={{deckVersion}}"></script>
   <script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
   {{block "scripts" .Arguments}}{{end}}
 </head>
-{{$defaultLogo := "/static/logo-light.png"}}
+{{ $defaultLogo := "/static/logo-light.png" }}
 {{- if .DarkMode -}}
 {{- $defaultLogo = "/static/logo-dark.png" -}}
 {{- end -}}
@@ -45,7 +45,7 @@
   <header class="mdl-layout__header"{{if branding.HeaderColor}} style="background-color: {{branding.HeaderColor}};"{{end}}>
     <div id="header-title" class="mdl-layout__header-row">
       <a href="/"
-         class="logo"><img src="{{or branding.Logo $defaultLogo}}" alt="kubernetes logo" class="logo"/></a>
+         class="logo"><img src="{{or branding.Logo $defaultLogo}}?v={{deckVersion}}" alt="kubernetes logo" class="logo"/></a>
       <span class="mdl-layout-title header-title">{{block "pageTitle" .Arguments}}{{template "title" .}}{{end}}</span>
     </div>
   </header>

diff --git a/prow/cmd/deck/template/command-help.html b/prow/cmd/deck/template/command-help.html
@@ -1,7 +1,7 @@
 {{define "title"}}Command Help{{end}}
 {{define "scripts"}}
-<link rel="stylesheet" href="/static/dialog-polyfill.css">
-<script type="text/javascript" src="/static/command_help_bundle.min.js"></script>
+<link rel="stylesheet" href="/static/dialog-polyfill.css?v={{deckVersion}}">
+<script type="text/javascript" src="/static/command_help_bundle.min.js?v={{deckVersion}}"></script>
 <script type="text/javascript" src="plugin-help.js?var=allHelp"></script>
 {{end}}
 {{define "content"}}

diff --git a/prow/cmd/deck/template/index.html b/prow/cmd/deck/template/index.html
@@ -1,7 +1,7 @@
 {{define "title"}}Prow Status{{end}}
 
 {{define "scripts"}}
-<script type="text/javascript" src="/static/prow_bundle.min.js"></script>
+<script type="text/javascript" src="/static/prow_bundle.min.js?v={{deckVersion}}"></script>
 <script type="text/javascript" src="prowjobs.js?var=allBuilds&omit=annotations,labels,decoration_config,pod_spec"></script>
 <script type="text/javascript">
   var spyglass = {{.SpyglassEnabled}};

diff --git a/prow/cmd/deck/template/job-history.html b/prow/cmd/deck/template/job-history.html
@@ -1,6 +1,6 @@
 {{define "title"}}Job History: {{.Name}}{{end}}
 {{define "scripts"}}
-<script type="text/javascript" src="/static/job_history_bundle.min.js"></script>
+<script type="text/javascript" src="/static/job_history_bundle.min.js?v={{deckVersion}}"></script>
 <script type="text/javascript">
   var allBuilds = {{.Builds}};
 </script>

diff --git a/prow/cmd/deck/template/plugins.html b/prow/cmd/deck/template/plugins.html
@@ -1,9 +1,9 @@
 {{define "title"}}Prow Plugin Catalog{{end}}
 
 {{define "scripts"}}
-<link rel="stylesheet" href="/static/dialog-polyfill.css">
-<link rel="stylesheet" href="static/plugin-help/prettify.css">
-<script type="text/javascript" src="/static/plugin_help_bundle.min.js"></script>
+<link rel="stylesheet" href="/static/dialog-polyfill.css?v={{deckVersion}}">
+<link rel="stylesheet" href="static/plugin-help/prettify.css?v={{deckVersion}}">
+<script type="text/javascript" src="/static/plugin_help_bundle.min.js?v={{deckVersion}}"></script>
 <script type="text/javascript" src="plugin-help.js?var=allHelp"></script>
 {{end}}
 

diff --git a/prow/cmd/deck/template/pr.html b/prow/cmd/deck/template/pr.html
@@ -1,8 +1,8 @@
 {{define "title"}}PR Status{{end}}
 {{define "scripts"}}
-    <link rel="stylesheet" href="/static/labels.css">
-    <link rel="stylesheet" href="/static/dialog-polyfill.css">
-    <script type="text/javascript" src="/static/pr_bundle.min.js"></script>
+    <link rel="stylesheet" href="/static/labels.css?v={{deckVersion}}">
+    <link rel="stylesheet" href="/static/dialog-polyfill.css?v={{deckVersion}}">
+    <script type="text/javascript" src="/static/pr_bundle.min.js?v={{deckVersion}}"></script>
     <script type="text/javascript" src="prowjobs.js?var=allBuilds&omit=annotations,labels,decoration_config,pod_spec"></script>
     <script type="text/javascript" src="tide.js?var=tideData"></script>
 {{end}}

diff --git a/prow/cmd/deck/template/spyglass.html b/prow/cmd/deck/template/spyglass.html
@@ -10,8 +10,8 @@
   var prowJobName = {{.ProwJobName}};
   var prowJobState = {{.ProwJobState}};
 </script>
-<script type="text/javascript" src="/static/spyglass_bundle.min.js"></script>
-<link rel="stylesheet" type="text/css" href="/static/spyglass/spyglass.css">
+<script type="text/javascript" src="/static/spyglass_bundle.min.js?v={{deckVersion}}"></script>
+<link rel="stylesheet" type="text/css" href="/static/spyglass/spyglass.css?v={{deckVersion}}">
 {{end}}
 
 {{define "content"}}
@@ -42,7 +42,7 @@
   <div class="mdl-card mdl-shadow--2dp lens-card">
     <div class="mdl-card__title lens-title"><h3 class="mdl-card__title-text">{{$config.Title}}</h3></div>
     <div id="{{$config.Name}}-view-container" class="lens-view-content mdl-card__supporting-text">
-      <img src="/static/kubernetes-wheel.svg" alt="loading spinner" class="loading-spinner is-active lens-card-loading" id="{{$config.Name}}-loading">
+      <img src="/static/kubernetes-wheel.svg?v={{deckVersion}}" alt="loading spinner" class="loading-spinner is-active lens-card-loading" id="{{$config.Name}}-loading">
       <iframe class="lens-container" style="visibility: hidden;" id="iframe-{{$index}}" sandbox="allow-scripts allow-top-navigation allow-popups allow-same-origin" data-lens-index="{{$index}}" data-lens-name="{{$config.Name}}"{{if $config.HideTitle}} data-hide-title="true"{{end}}></iframe>
     </div>
   </div>

diff --git a/prow/cmd/deck/template/tide-history.html b/prow/cmd/deck/template/tide-history.html
@@ -1,7 +1,7 @@
 {{define "title"}}Tide History{{end}}
 
 {{define "scripts"}}
-<script type="text/javascript" src="/static/tide_history_bundle.min.js"></script>
+<script type="text/javascript" src="/static/tide_history_bundle.min.js?v={{deckVersion}}"></script>
 <script type="text/javascript" src="tide-history.js?var=tideHistory"></script>
 {{end}}
 

diff --git a/prow/cmd/deck/template/tide.html b/prow/cmd/deck/template/tide.html
@@ -1,8 +1,8 @@
 {{define "title"}}Tide Status{{end}}
 
 {{define "scripts"}}
-<link rel="stylesheet" type="text/css" href="/static/labels.css">
-<script type="text/javascript" src="/static/tide_bundle.min.js"></script>
+<link rel="stylesheet" type="text/css" href="/static/labels.css?v={{deckVersion}}">
+<script type="text/javascript" src="/static/tide_bundle.min.js?v={{deckVersion}}"></script>
 <script type="text/javascript" src="tide.js?var=tideData"></script>
 {{end}}