Skip to content

Commit

Permalink
Add referrer (request source) to global context (#486)
Browse files Browse the repository at this point in the history
https://eaflood.atlassian.net/browse/WATER-4155

In our work building the new bill page, we are required to add a 'back' link. One of the things we have to deal with though is that you can come to the page from 3 different sources

- bill run summary
- billing account summary
- billing account all bills

The previous team solved this by using a bit of JavaScript. Simply set `javascript:history.back()` as the `href` and job done. We can't blame them for this one as it's a solution a number of digital services use.

But it's a bit of a cheat. For a start, we're supposed to support users accessing a service with JavaScript disabled. That immediately breaks all your backlinks. Plus, if you've ever found your journey through a site go a bit screwy, for example, you find yourself going in a loop, chances are it's because of backlinks implemented this way.

Ideally, the request you generate would tell the handler where to go back to if there is more than one possibility. But as we're dealing with requests from the legacy app that's not really feasible.

Fortunately, either the browser or Hapi is coming to the rescue (I'm not sure who so both get credit). The headers in the request normally include [Referer](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Referer) (yes that's a misspelling - see [Wikipedia](https://en.wikipedia.org/wiki/HTTP_referer#Etymology)).

Hapi provides this in [request.info.referrer](https://hapi.dev/api/?v=21.3.2#-requestinfo). If we have that, we have our 'back' link address.

This change tweaks the global context in our `ViewsPlugin` to include this value so it is available to all pages. We also add a new `back-link.njk` which shows how we can use it to generate our backlinks.

> Note - yes, we also fall back to the JavaScript hack if the value is unavailable. No one is perfect!
  • Loading branch information
Cruikshanks authored Oct 29, 2023
1 parent 7157e80 commit df5b750
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 0 deletions.
2 changes: 2 additions & 0 deletions app/plugins/views.plugin.js
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,8 @@ function context (request) {
return {
// `assetPath` is referred to in layout.njk as the path to get static assets like client-side javascript
assetPath: '/assets',
// this is the url of where the request came from. We use it to generate back links in our pages
referrer: request.info.referrer,
auth: {
authenticated: request.auth.isAuthenticated,
authorized: request.auth.isAuthorized,
Expand Down
11 changes: 11 additions & 0 deletions app/views/includes/back-link.njk
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
{% if referrer %}
{% set backlink = referrer %}
{% else %}
{% set backlink = 'javascript:history.back()' %}
{% endif %}
{{
govukBackLink({
text: "Back",
href: backlink
})
}}

0 comments on commit df5b750

Please sign in to comment.