I’m serving Free Radical’s images etc. from S3. When I updated to Mastodon v2.1.0, I noticed that all the page’s images were missing. Safari’s Show JavaScript Console menu revealed a lot of errors like:

[Error] Refused to load https://s3-us-west-2.amazonaws.com/freeradical-system/accounts/avatars/000/014/309/static/91f9782fad3f6284.png because it does not appear in the img-src directive of the Content Security Policy.

Turns out that some time between the releases of v2.0.0 and v2.1.0, the Mastodon switched from generating S3 URLs like:




Because I’d jumped through the hoops of setting up a Content-Security-Policy header, Safari wasn’t allowing those images to render. I had to change my CSP header in Nginx from:

add_header Content-Security-Policy "default-src 'self'; img-src 'self' https://freeradical-system.s3-us-west-2.amazonaws.com/ data:; style-src 'self' 'unsafe-inline'; connect-src 'self' wss://freeradical.zone/; media-src 'self' https://freeradical-system.s3-us-west-2.amazonaws.com/";


add_header Content-Security-Policy "default-src 'self'; img-src 'self' https://freeradical-system.s3-us-west-2.amazonaws.com/ https://s3-us-west-2.amazonaws.com/freeradical-system/ data:; style-src 'self' 'unsafe-inline'; connect-src 'self' wss://freeradical.zone/; media-src 'self' https://freeradical-system.s3-us-west-2.amazonaws.com/ https://s3-us-west-2.amazonaws.com/freeradical-system/";

so that both the old and new S3 URLs are permitted.