The Nuclear Option (No More unsafe-inline)

October 25, 2021

As you can see from the last post, I went with the nuclear option and created a Hugo table shortcode, then did the following:

  1. Updated all the tables on the site to use the new table shortcode.
  2. Removed style-src 'self' 'unsafe-inline' from the Content-Security-Policy header.
  3. Re-ran the Security Headers scan.

Here is the updated Content-Security-Policy from the Apache config:

# look ma, no unsafe-inline!
Header append "Content-Security-Policy" "default-src 'self'; img-src 'self'"


And here is the updated Security Headers scan result:

Updated Security Headers scan result.

Updated Security Headers scan result.

A couple of recommendations for folks getting started with Hugo:

  1. Do not use <img>; use the figure shortcode instead. The latter is far more flexible and also works well with a responsive design.
  2. If you are embedding complex tables or you are generating tables with alignment and want to avoid inline style attributes, do not use the Markdown table syntax. Use hugo-shortcode-table instead.