Image thumbnails intermittently fail to load on localhost / in percy

[sudara]

I believe this can be reproduced by loading the home page, blowing away 'tmp/cache' and loading the homepage again.

Maybe the underlying reason is that variant urls aren't staying consistent across page loads / server boots?

Keep in mind we also return 304 Not Modified responses for the home page (soon to be other locations), so perhaps the browser is using a response that points to invalid variants.

On localhost:

On Percy:

[Manfred]

@sudara Are you happy to close this or are you still seeing an issue with this?

[sudara]

Yes, thank you!

[sudara]

Still seeing an issue with this.

For example, I've been working throughout the day and anytime an hour or so passes, the first page load fails to load images. It's not a big deal but maybe similar scale to warnings or deprecation notices, it just makes things feel a bit shoddy/broken on a regular basis.

[Manfred]

@sudara can you send me your Alonetone yaml configuration? How are you running the server? Using rails server without a web server frontend?

[sudara]

@Manfred I think the others copied the example over to alonetone.yml and were seeing the same issue, I'll ask if they are still seeing it. My yaml currently looks like

development: &defaults
  hostname: alonetone.com
  email: [email protected]
  secret: xxx
  storage_service: filesystem
  rakismet_key: xxxx
  play_dummy_audio: true
  show_dummy_image: false

There are no current defaults. I don't remember why the hostname was set to alonetone.com, I'll set that back to the default and see if it helps.

[Manfred]

How are you running the server? Using rails server without a web server frontend?

[sudara]

Yes, bundle exec rails s only.

[sudara]

That's a lie, we also all usually run bin/webpack-dev-server as well, to catch asset changes.

[Manfred]

The issue is that the page is using an etag and last-modified based on the latest updated asset. Image URLs expire after 5 minutes. So the HTML can be cached indefinitely in the browser as long as nobody uploads a new asset.

I looked at it and it seems that we never merged the mitigation for this problem. So that means the AssetsController#latest will show broken images after 5 minutes.

There are a number of ways to solve this:

1. Always use the Fastly mock in development.
2. Mitigate by expanding the expiration for Active Storage URLs – not sure why we never merged that.
3. Hacking in if-modified-since and etag headers into ActiveStorage::DiskController#show so the browser will use the image from its own cache.
4. Merge the Fastly mock into a controller