I built a profile picture CRUD system and ran into a caching issue with Supabase Storage.
When uploading an image, you need to define a path in the storage bucket. The problem is: if you reuse the same path every time, the new image will be uploaded successfully, but due to caching, the old image will still be displayed. The browser continues to serve the cached version, and only after clearing the cache does the new image appear.
To solve this, every time I update the image, I first delete the existing file and then upload the new one. However, this only works reliably if I also change the file path each time. To ensure a unique path, I append a timestamp using new Date().getTime()
.
Using Supabase’s “replace storage file” workflow doesn’t solve this issue, since the file path remains the same and the cache continues to serve the old image.