how to clear browser cache in reactjs

筅森魡賤 提交于 2020-01-03 16:29:22

问题


every time I make changes to my website and try to update those changes to the running website, I've to hard refresh browser. is there any way to do it by code

i already try to search it but most of saying it can not be done. referance post : How to programmatically empty browser cache?

**Response headers :

HTTP/1.1 200 OK

Server: nginx/1.12.2

Date: Fri, 06 Jul 2018 10:01:23 GMT

Content-Type: text/html

Transfer-Encoding: chunked

Connection: keep-alive

Vary: Accept-Encoding

Content-Encoding: gzip

**Request headers :

GET / HTTP/1.1

Host: --example--.com

Connection: keep-alive

Upgrade-Insecure-Requests: 1

User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,/;q=0.8

Accept-Encoding: gzip, deflate

Accept-Language: en-GB,en-US;q=0.9,en;q=0.8,hi;q=0.7

Cookie: fingerPrint=e4a9037b8f674722f414b0b59d8d663c


回答1:


For this specific case what you can do is to tell browser not to cache your page, by using these meta tags inside <head> tag:

<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>

However there are multiple ways to achieve this. You could send the appropriate headers from your back end. Or if you are trying to disable cache temporally you can do it by disabling the browser cache. To do so, Follow below steps.

In your developer tools. Find network tab and disable cache. Like here in the image.

Hope this resolves.




回答2:


Make a style.css file in your public folder then link this CSS file in your index.html file.

Ex:

 <link rel="stylesheet" type="text/css" href="%PUBLIC_URL%/style.css?v=0.0.1" />

Always update the version of this CSS fils before doing build your code.




回答3:


It's possible, you can simply use jQuery. please take a look at the post How to programmatically empty browser cache?




回答4:


Even if the below answers didn't work. And you are facing a problem something like your app being cached, making the whole app display an old build then probably you can check this link https://github.com/facebook/create-react-app/issues/1910#issuecomment-355245212. After that do an npm start, it worked for me.




回答5:


You can use the chrome dev tools. There is an option in the Network Tab to disable the cache.



来源:https://stackoverflow.com/questions/51207570/how-to-clear-browser-cache-in-reactjs

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!