Ok, so figured out some more stuff.
So if I loaded up my password protected gatsby site in safari, you get a network tab with a whole bunch of 401s, including all my javascript bundles. Erroring because the password cookie hasn’t been sent yet. Makes sense.
But why are they loading on the password page? If you look in the html it’s just a super basic page, with no links to these files - where are they coming from?
Digging a bit deeper - if you check the headers from the landing page, turns out there’s a Link header, which preloads a bunch of assets - which will all fail without our lovely password cookie! Culprit found!
Turns out I was using gatsby-plugin-netlify which makes a bunch of headers, including link headers - which are sent when the password page is sent.
You can disable link headers in your gatsby-config.js like this.
module.exports = {
plugins: [
{
resolve: `gatsby-plugin-netlify`,
options: {
mergeLinkHeaders: false,
},
},
]
}
That’s good enough for me right now, however it’s bit of a bad solution. As I do actually want pre-loading on production, gotta go fast. And setting this in the source means I can’t change it between Netlify sites, like only have this on the staging sites, but not production.
Not really sure what the best fix would be - but a suggestion for Netlify - maybe make the password protection response’s headers immutable? So you always get a default set?