caching the old image

I have this ajax upload avatar, where you crop your image too before you press "Use". When you press use, at the userbar at the top, your current avatar disappears and your new avatar appears(made with jquery).

Now I have a issue here, that after you have uploaded the image, crop and pressed use, and after it changed with jquery, when i navigate to e.g Settings, home or profile, my old avatar comes bac开发者_如何学Ck on. Until i press on my browsers "update" it shows the new one.

Although this happens only sometimes, sometimes i dont need to update.. how can i solve this?

Whenever you upload the avatar, you can delete the old one and give a new file name to the new avatar. Then on the userbar and other places, link to the new one. This will definitely resolve your issue, but might take a little while for you need a little change in code (especially if your site is live).

Or you can keep track of a version number. Each time the user upload a new avatar, increment this version number. Then link the avatar to:

http://example.com/images/USERNAME.jpg?v=VERSION_NUMBER