Focal point changes and modified time cache busting

[justinmacleod]

Description

We heavily cache our websites using AWS CloudFront and have experienced an issue with changes to the focal point settings of an image not being displayed. Our websites typically have HTML output cached for an hour and uploaded assets and build artifacts cached for 30 days.

We have experienced an issue where changes to the focal point settings for an image are not being reflected on production. In order to assist in cache busting, Craft appends a query string parameter for the modified time. Unfortunately, this modified time is based on the original source image. Since the source image doesn't change when the focal point is updated, this modified time remains consistent and continues to be appended to the image transform URL.

Instead of using modified time it might be advisable to use updated time since that value is getting updated when focal point settings are changed.

Steps to reproduce

1. Upload an asset to Craft CMS without adjusting focal point.
2. Add asset to page and load into template using image transform.
3. Change focal point of image and return to page.
4. Notice modified time remains the same for the image transform call.

Additional info

• Craft version: 3.0.29
• PHP version: 7.2.14
• Database driver & version: MySQL 5.7.22

[thijskaspers]

Yes please! Any update on this? Related: craftcms/google-cloud#9

We are having the same issue with Google Cloud storage. Images are cached for 30 days based on their URL, so as long as the 'mtime' parameter doesn't change, the cache won't invalidate. Focal points are therefore broken for our clients, unless we choose to not cache the images, but that will have a negative impact on performance and pagespeed score..

Same goes for changing image transform crop settings by the way. For example, if you update it from "center-center" to "top-center", it won't have any effect until you manually change or remove the mtime parameter.

[thijskaspers]

Can confirm that using "dateUpdated" for the mtime fixes the issue, since that gets updated when the focal point changes.

src/helpers/Assets.php line 112 and 113:

/**
 * Get appendix for an URL based on it's Source caching settings.
 *
 * @param VolumeInterface $volume
 * @param Asset $file
 * @return string
 */
public static function urlAppendix(VolumeInterface $volume, Asset $file): string
{
    $appendix = '';

    /** @var Volume $volume */
    if (!empty($volume->expires) && DateTimeHelper::isValidIntervalString($volume->expires) && $file->dateUpdated) {
        $appendix = '?utime=' . $file->dateUpdated->format('YmdHis');
    }

    return $appendix;
}

Another solution would be to use the touch() method to update the dateModified of the original file when the focal point changes. Probably not the most elegant solution, since the file itself won't get modified (and that will mess up ordering assets for the user), it is the craft Asset that gets updated. Using dateUpdated seems the better choice, as you want to invalidate cache when the Asset gets updated.

[andris-sevcenko]

Thanks for reporting that! This issue has been fixed for the next release.

[brandonkelly]

Craft 3.4.6 is out now with this fix.

[lukasIO]

is there a way to fix this for graphql image transforms?
we are seeing the same issue on image transforms that get queried via graphql.

edit: especially considering the srcset field where the previously described workaround gets more involved.

[brandonkelly]

@lukasIO GraphQL uses the same transform stuff behind the scenes. If something’s not working as expected, please post a new issue with a detailed description and steps to reproduce.