I have a code where the user's avatar is fetched from the backend. Now, the avatar file name is the same every time, even if a user uploads a new one because the backend replaces the old avatar with the new one with the same name. Since this was causing caching issue on the browser, I used [IMAGE_URL]?random={new Date().getSeconds()} to update the state immediately when user changes it. But this causes the avatar to download multiple times when the page loads or when a React state updates. Is there a way so that the image is not cached and also I don't have to put some random query strings?
Avoid image caching in browser in React
2.4k Views Asked by tuhindas At
1
There are 1 best solutions below
Related Questions in REACTJS
- What is `_dereq_()` inside React?
- React TypeError: React.renderComponent is not a function
- React - saving a component in the ref callback
- React Rails component: manually triggering a re-render
- React, ES6 - getInitialState was defined on a plain JavaScript class
- How to get multiple selected options value in React JS?
- React.render replace container instead of inserting into
- reactjs datagrid use html
- props is not initialized in react component
- How to display xml data using Reactjs
- hooking up the data model in ReactJS - syntax
- ReactJS: How to use an immutable empty array or object
- How to use Sinon.js FakeXMLHttpRequest with superagent?
- React select onChange is not working
- ReactJS - Tutorial Comment System > Threaded commenting
Related Questions in CACHING
- ClassCastException: datastructures.instances.JClass cannot be cast to java.util.ArrayList
- Robospice. How to save data and how to get data from DB?
- Make @lru_cache ignore some of the function arguments
- Xib taking long time (>1s) to load. UIFont cache seems to blame
- Android picasso cache images
- Rails 4 low-level caching not working
- How to cache Exchange web service API autodiscoverurl?
- The process cannot access the file because it is being used by another process asp.net
- Alamofire loading from cache even when cache policy set to ReloadIgnoringLocalAndRemoteCacheData
- Java Heap vs Cache
- In what use cases is locking on ASP.NET cache required/desirable
- Chrome cache overriding angularjs disabling of cache
- AFNetworking 2.0 Cache Issue
- Symfony ESI Cache / Surrogate Listener Issue
- Using getOrElseUpdate of TrieMap in Scala
Related Questions in BROWSER
- Why does Angular send Http Request Method: Options before POST?
- Trick browser into resizing the viewport dimensions by 1px
- Why is it so hard to style <select> and <option> elements?
- Change writing language at browser
- Selenium stops running after click() function runs
- Are there any debugging tools for the Opera Mini mobile browser?
- place 1 label top, 1 input bottom and 2 buttons left
- Why clear cache does not work with all browsers?
- Opening Browser Instances from different Vendors
- Browser's not displaying images correctly
- Open a html document with php
- How to run a .jar inside browser?
- Why/how does the browser decide ☃.net goes to xn--n3h.net
- How do you invoke another app from a child browser
- Firefox and SSL pages - takes very long on certain sites
Related Questions in STATE
- UI-Router $stateParams With Master Detail Pattern
- MvvmCross on iOS - Strategies for Saving and Restoring State
- Restoring the value of activity member variable not working
- Having trouble saving changes in Dataset to SQL LocalDB
- Inject a template in parent's view with ui-router
- Angular ui.router. Deep nested routes
- Hiding parent state view from child state view in angularjs, best practices?
- State Monad with `put` Function
- Angular JS: how to "load" an individual record from a json dataset?
- Highcharts: automatically give a highlite backgroundcolor to one series item like in the hover state
- How to delete functions of previous instances of controller?
- $state, $stateParams, getting undefined object
- React Native Change State With Unexpected Logging
- How to trigger router's state on page load?
- How to conditionally check the state of an openstack instance
Related Questions in NO-CACHE
- curl -X GET -I -H "Cache-Control: no-cache" does not bypass
- Change response cache header for a request
- Avoiding 301 redirect caching
- Hosting a GWT Webapp in IIS
- Can't figure out how to prevent HTTP caching in Chrome using cache-control
- how to verify "Cache-Control", "no-cache, no-store, must-revalidate"
- Cache-control set to 8 hours from Java end is getting overridden by no-cache from server
- How to force clear user's browser all the time?
- How can I get the back-button to work with a JSF app with no-cache set?
- Google Chrome cache buggery : Chrome does not fetch latest version of the page despite NO-CACHE
- Output Caching using IIS (Unable to change to No Cache)
- How to verify if caching is disabled (IE7)?
- Which are the optimum cache-related HTTP headers for a content that can change?
- no-cache attribute misunderstanding
- Browsers seem to be ignoring my cache control Python response headers
Trending Questions
- UIImageView Frame Doesn't Reflect Constraints
- Is it possible to use adb commands to click on a view by finding its ID?
- How to create a new web character symbol recognizable by html/javascript?
- Why isn't my CSS3 animation smooth in Google Chrome (but very smooth on other browsers)?
- Heap Gives Page Fault
- Connect ffmpeg to Visual Studio 2008
- Both Object- and ValueAnimator jumps when Duration is set above API LvL 24
- How to avoid default initialization of objects in std::vector?
- second argument of the command line arguments in a format other than char** argv or char* argv[]
- How to improve efficiency of algorithm which generates next lexicographic permutation?
- Navigating to the another actvity app getting crash in android
- How to read the particular message format in android and store in sqlite database?
- Resetting inventory status after order is cancelled
- Efficiently compute powers of X in SSE/AVX
- Insert into an external database using ajax and php : POST 500 (Internal Server Error)
Popular Questions
- How do I undo the most recent local commits in Git?
- How can I remove a specific item from an array in JavaScript?
- How do I delete a Git branch locally and remotely?
- Find all files containing a specific text (string) on Linux?
- How do I revert a Git repository to a previous commit?
- How do I create an HTML button that acts like a link?
- How do I check out a remote Git branch?
- How do I force "git pull" to overwrite local files?
- How do I list all files of a directory?
- How to check whether a string contains a substring in JavaScript?
- How do I redirect to another webpage?
- How can I iterate over rows in a Pandas DataFrame?
- How do I convert a String to an int in Java?
- Does Python have a string 'contains' substring method?
- How do I check if a string contains a specific word?
you have to implement a hash mechanism on your backend to add a hash string to the image name not on the client side