How to solve caching issues caused by same-image URLs in your Vue project

When you call the API to change an image in your Vue project, you may sometimes use the same image URL

In this case, you may run into an issue where the old image is cached and remains.

For example, in past projects, we've used URLs of the form /img/[userId]. In this case, we changed the image, but the cached image remained because the URL was the same.

To solve this, we added a timestamp to the URL in the form of ${imageUrl}?timestamp=${Date.now()}.

This generated a new image URL each time, ensuring that the latest image was loaded, rather than the cached image.

In conclusion, be careful if the URL before and after an image change is the same, as this can cause caching issues!