Do not cache JS/CSS between versions

Users often report JavaScript or page display errors
after an upgrade (blank page, only header and footer, etc).
This change adds a query parameter for JS/CSS files, so that
they change from version to version and therefore are the browser
should not use the outdated cache entries.

Author: mkuratczyk

deps/rabbitmq_management/Makefile

@@ -45,7 +45,5 @@ list-dist-deps::
 prepare-dist::
 	$(verbose) sed 's/%%VSN%%/$(PROJECT_VERSION)/' bin/rabbitmqadmin \
 		> $(EZ_DIR)/priv/www/cli/rabbitmqadmin
-	mv $(EZ_DIR)/priv/www/css/main.css $(EZ_DIR)/priv/www/css/main-$(PROJECT_VERSION).css
-	$(verbose) sed "s#css/main.css#css/main-$(PROJECT_VERSION).css#" priv/www/index.html \
+	$(verbose) sed "s/%%VSN%%/$(PROJECT_VERSION)/" priv/www/index.html \
 		> $(EZ_DIR)/priv/www/index.html
-	echo "management_version = \"$(PROJECT_VERSION)\";" >> $(EZ_DIR)/priv/www/js/global.js

deps/rabbitmq_management/priv/www/index.html

@@ -11,14 +11,25 @@
     <script src="js/sammy-0.7.6.min.js" type="text/javascript"></script>
     <script src="js/json2-2016.10.28.js" type="text/javascript"></script>
     <script src="js/base64.js" type="text/javascript"></script>
-    <script src="js/global.js" type="text/javascript"></script>
-    <script src="js/main.js" type="text/javascript"></script>
-    <script src="js/prefs.js" type="text/javascript"></script>
-    <script src="js/formatters.js" type="text/javascript"></script>
-    <script src="js/charts.js" type="text/javascript"></script>
+
+    <script type="text/javascript">
+      management_version = "%%VSN%%";
+      const scripts = ["global.js", "main.js", "prefs.js", "formatters.js", "charts.js"];
+      scripts.forEach((script) => {
+        tag = document.createElement('script');
+        tag.src = 'js/' + script + '?v=' + management_version;
+        document.head.appendChild(tag);
+      });
+
+      tag = document.createElement('link');
+      tag.rel = 'stylesheet';
+      tag.type = 'text/css';
+      tag.href = 'css/main.css?v=' + management_version;
+      document.head.appendChild(tag);
+    </script>
+
     <script src="js/oidc-oauth/bootstrap.js" type="module"></script>
 
-    <link href="css/main.css" rel="stylesheet" type="text/css"/>
     <link href="favicon.ico" rel="shortcut icon" type="image/x-icon"/>    
 
     <script type="module">

deps/rabbitmq_management/priv/www/js/global.js

@@ -863,6 +863,3 @@ var chart_data = {};
 var last_page_out_of_range_error = 0;
 
 var oauth;
-
-// version of RabbitMQ we connected to; used to detect version changes
-var management_version = "";

deps/rabbitmq_management/priv/www/js/tmpl/overview.ejs

@@ -1,5 +1,5 @@
 <%
-   if(management_version != overview.management_version) {
+   if(management_version != undefined && management_version != '%%VSN%%' && management_version != overview.management_version) {
      // RabbitMQ was upgraded
      // full reload to get the latest CSS and JavaScript files
      needs_full_refresh = true;