DO NOT MERGE 4.0.5: Management UI: serve all static assets with a control-cache header (backport #12749)

[mergify[bot]]

This PR addreses an issue that occurs in production every time RabbitMQ releases a new version which modifies a web resource, i..e, the index.html page, or javascript file or css file. Users have to clear their cache in order to get the management ui to work again.

Proposed Changes

Add response's header that tells the browser to always check whether a web resource has been modified (using eTag) before delivering to the user. In addition to adding the corresponding control-cache headers, it is necessary to add some logic to the index.html so that it checks if its eTag has changed. This is something the browser does when the user requests a web resource. However, index.html is a special case compared to other web resources because once the user navigates for the first time to the management ui, it actually never leaves it. This is because this is a SinglePageApplication. Even when the user is kicked out of its session, the browser does not change the web resource, it is still the index.html. When the user logs back in, it is still the same index.html. All the management ui is doing is dynamically changing its content. Hence, the browser never checks its eTag with the rabbitmq server.

With this change, every time the user logs in, the management ui ensures the version running in the ui matches the version running in the server and if they do not match, it reloads the index.html and with it and thanks to the eTag in all the web resources (javascript and css files), it loads all the latest files into the browser. This means that if the user has a live session and RabbitMQ is redeployed with a newer version, the user would have logout. In all other cases, the reload is totally transparent to the user.

Context:

• https://github.com/docker-library/rabbitmq/issues/321

Acceptance Test

Reminder: Never refresh the page or modify the url in the browser once you enter it for the first time.

1. Create a /tmp/rabbitmq.conf with the following configuration:

   #product.version = 4.1.0+beta.1.22.fake.1

2. Start rabbitmq

   make run-broker RABBITMQ_CONFIG_FILE=/tmp/rabbitmq.conf

3. Go to the url http://localhost:15672
4. Login and keep the tab opened in the browser
5. Edit deps/rabbitmq_management/priv/www/index.html and modify <title>RabbitMQ Management</title> to <title>1. RabbitMQ Management</title>
6. Edit deps/rabbitmq_management/priv/www/js/global.js and add the following line to the bottom of the file

   var fake="1.0"

7. Edit deps/rabbitmq_management/priv/www/css/main.css and add the following line to the bottom of the file

   .fake {}

8. Edit /tmp/rabbitmq.conf and uncomment the line #product.version = 4.1.0+beta.1.22.fake.1
9. Stop rabbitmq server
10. Start rabbitmq server using make run-broker RABBITMQ_CONFIG_FILE=/tmp/rabbitmq.conf
11. Go back to the same tab you used to log in, if the session is still live, click on "Logout"
12. Enter your credentials again to log back in
13. Check the label of the browser's tab has changed to 1. RabbitMQ Management
14. Open the developer tool in the browser and inspect the content of the two modified files: main.css and global.js

If you repeat these steps on main branch, make sure you clear your cache first. You will see that on step 13, the title has not changed.

---

This is an automatic backport of pull request #12749 done by Mergify.

[mergify[bot]]

Cherry-pick of ce760c688b70952cab3d67b7572f34941a83ea2f has failed:

On branch mergify/bp/v4.0.x/pr-12749
Your branch is up to date with 'origin/v4.0.x'.

You are currently cherry-picking commit ce760c688b.
  (fix conflicts and run "git cherry-pick --continue")
  (use "git cherry-pick --skip" to skip this patch)
  (use "git cherry-pick --abort" to cancel the cherry-pick operation)

Changes to be committed:
    modified:   deps/rabbitmq_management/priv/www/index.html
    modified:   deps/rabbitmq_management/priv/www/js/main.js
    modified:   deps/rabbitmq_management/priv/www/js/oidc-oauth/helper.js
    modified:   deps/rabbitmq_management/src/rabbit_mgmt_dispatcher.erl
    modified:   deps/rabbitmq_management/src/rabbit_mgmt_headers.erl
    new file:   deps/rabbitmq_management/src/rabbit_mgmt_wm_version.erl
    modified:   selenium/README.md
    modified:   selenium/bin/components/keycloak
    modified:   selenium/bin/suite_template
    new file:   selenium/clean.sh
    modified:   selenium/suites/authnz-mgt/oauth-and-basic-auth.sh
    modified:   selenium/test/basic-auth/unauthorized.js
    modified:   selenium/test/oauth/with-basic-auth-idp-down/happy-login.js
    modified:   selenium/test/pageobjects/BasePage.js
    modified:   selenium/test/pageobjects/SSOHomePage.js

Unmerged paths:
  (use "git add/rm <file>..." as appropriate to mark resolution)
    both modified:   .github/workflows/test-management-ui-for-pr.yaml
    both modified:   deps/rabbitmq_management/test/rabbit_mgmt_http_SUITE.erl
    deleted by them: selenium/test/multi-oauth/certs/server_rabbitmq_certificate.pem
    deleted by them: selenium/test/multi-oauth/certs/server_rabbitmq_key.pem
    deleted by them: selenium/test/multi-oauth/devkeycloak/server_devkeycloak.p12
    deleted by them: selenium/test/multi-oauth/devkeycloak/server_devkeycloak_certificate.pem
    deleted by them: selenium/test/multi-oauth/devkeycloak/server_devkeycloak_key.pem
    deleted by them: selenium/test/multi-oauth/prodkeycloak/server_prodkeycloak.p12
    deleted by them: selenium/test/multi-oauth/prodkeycloak/server_prodkeycloak_certificate.pem
    deleted by them: selenium/test/multi-oauth/prodkeycloak/server_prodkeycloak_key.pem

To fix up this pull request, you can check it out locally. See documentation: https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/reviewing-changes-in-pull-requests/checking-out-pull-requests-locally

[michaelklishin]

This will have to wait until 4.0.5.