blocks|key|1311936|text|您可以调用window.location.reload(true)来重新加载当前页面。它将忽略任何缓存的项目，并从服务器检索页面、css、图像、JavaScript等的新副本。这不会清除整个缓存，但会清除所在页面的缓存。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1311937|但是，您的最佳策略是对路径或文件名进行版本化，如各种其他答案中所述。此外，有关不使用?v=n作为版本控制方案的原因，请参阅Revving+Filenames:+don’t+use+querystring。|style|CODE|1311938|entityMap|0|LINK|mutability|MUTABLE|url|http://msdn.microsoft.com/en-us/library/ms536691%2528VS.85%2529.aspx|1|http://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/^0|5|S|0|0|16|4|1P|14|1|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@$A|S|B|T|1|U]]|C|$]]|$1|D|3|E|5|6|7|V|8|@$A|W|B|X|F|G]]|9|@$A|Y|B|Z|1|10]]|C|$]]|$1|H|3|-4|5|6|7|11|8|@]|9|@]|C|$]]]|I|$J|$5|K|L|M|C|$N|O]]|P|$5|K|L|M|C|$N|Q]]]]

You can call <a href="http://msdn.microsoft.com/en-us/library/ms536691%28VS.85%29.aspx" rel="noreferrer">window.location.reload(true)</a> to reload the current page. It will ignore any cached items and retrieve new copies of the page, css, images, JavaScript, etc from the server. This doesn't clear the whole cache, but has the effect of clearing the cache for the page you are on.

However, your best strategy is to version the path or filename as mentioned in various other answers. In addition, see <a href="http://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/" rel="noreferrer">Revving Filenames: don’t use querystring</a> for reasons not to use <code>?v=n</code> as your versioning scheme.

blocks|key|1311656|text|你不能用javascript清除缓存。一种常见的方法是将修订号或上次更新的时间戳附加到文件中，如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1311657|myscript.123.js|code-block|syntax|javascript|1311658|或|1311659|myscript.js?updated=1234567890|offset|length|style|CODE|1311660|entityMap^0|0|0|0|0|U|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|T|8|@$K|U|L|V|M|N]]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

You can't clear the cache with javascript.
A common way is to append the revision number or last updated timestamp to the file, like this:

<pre><code>myscript.123.js
</code></pre>

or

<code>myscript.js?updated=1234567890</code>

blocks|key|1526835|text|尝试更改JavaScript文件的源文件吗？从这个开始：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1526836|<script+language="JavaScript"+src="js/myscript.js"></script>|code-block|syntax|javascript|1526837|要这样做：|1526838|<script+language="JavaScript"+src="js/myscript.js?n=1"></script>|1526839|此方法应强制您的浏览器加载JS文件的新副本。|1526840|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|S|8|@]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

Try changing the JavaScript file's src? From this:

<pre><code>&lt;script language="JavaScript" src="js/myscript.js"&gt;&lt;/script&gt;
</code></pre>

To this:

<pre><code>&lt;script language="JavaScript" src="js/myscript.js?n=1"&gt;&lt;/script&gt;
</code></pre>

This method should force your browser to load a new copy of the JS file.

blocks|key|1527166|text|除了每小时或每周缓存一次之外，您还可以根据文件数据进行缓存。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1527167|示例(PHP格式)：|1527168|<script+src="js/my_script.js?v=<?=md5_file('js/my_script.js')?>"></script>|code-block|syntax|javascript|1527169|或者甚至使用文件修改时间：|1527170|<script+src="js/my_script.js?v=<?=filemtime('js/my_script.js')?>"></script>|1527171|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

Other than caching every hour, or every week, you may cache according to file data.

Example (in PHP):

<pre><code>&lt;script src="js/my_script.js?v=&lt;?=md5_file('js/my_script.js')?&gt;"&gt;&lt;/script&gt;
</code></pre>

or even use file modification time:

<pre><code>&lt;script src="js/my_script.js?v=&lt;?=filemtime('js/my_script.js')?&gt;"&gt;&lt;/script&gt;
</code></pre>

blocks|key|1311809|text|您还可以在PHP中强制每小时重新加载一次代码，如下所示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1311810|<?php
echo+'<script+language="JavaScript"+src="js/myscript.js?token='.date('YmdH').'">';
?>|code-block|syntax|javascript|1311811|或|1311812|<script+type="text/javascript"+src="js/myscript.js?v=<?php+echo+date('YmdHis');+?>"></script>|1311813|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

You can also force the code to be reloaded every hour, like this, in PHP :

<pre><code>&lt;?php
echo '&lt;script language="JavaScript" src="js/myscript.js?token='.date('YmdH').'"&gt;';
?&gt;
</code></pre>

or

<pre><code>&lt;script type="text/javascript" src="js/myscript.js?v=&lt;?php echo date('YmdHis'); ?&gt;"&gt;&lt;/script&gt;
</code></pre>

blocks|key|1311981|text|将此代码放在模板的末尾：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1311982|var+scripts+=++document.getElementsByTagName('script');
var+torefreshs+=+['myscript.js',+'myscript2.js']+;+//+list+of+js+to+be+refresh
var+key+=+1;+//+change+this+key+every+time+you+want+force+a+refresh
for(var+i=0;i<scripts.length;i%2B%2B){+
+++for(var+j=0;j<torefreshs.length;j%2B%2B){+
++++++if(scripts[i].src+&&+(scripts[i].src.indexOf(torefreshs[j])+>+-1)){
++++++++new_src+=+scripts[i].src.replace(torefreshs[j],torefreshs[j]+%2B+'k='+%2B+key+);
++++++++scripts[i].src+=+new_src;+//+change+src+in+order+to+refresh+js
++++++}+
+++}
}|code-block|syntax|javascript|1311983|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

put this at the end of your template :
<pre><code>var scripts = document.getElementsByTagName('script');
var torefreshs = ['myscript.js', 'myscript2.js'] ; // list of js to be refresh
var key = 1; // change this key every time you want force a refresh
for(var i=0;i&lt;scripts.length;i++){ 
 for(var j=0;j&lt;torefreshs.length;j++){ 
 if(scripts[i].src &amp;&amp; (scripts[i].src.indexOf(torefreshs[j]) &gt; -1)){
 new_src = scripts[i].src.replace(torefreshs[j],torefreshs[j] + 'k=' + key );
 scripts[i].src = new_src; // change src in order to refresh js
 } 
 }
}
</code></pre>

blocks|key|1527444|text|HTML5标准似乎已经弃用了window.location.reload(true)。在不使用查询字符串的情况下，一种方法是使用看起来像being+standardized的Clear-Site-Data+header。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1527445|entityMap|0|LINK|mutability|MUTABLE|url|https://www.w3.org/TR/clear-site-data/|1|https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Clear-Site-Data^0|E|S|2F|F|1W|I|0|2F|M|1|0^^$0|@$1|2|3|4|5|6|7|P|8|@$9|Q|A|R|B|C]|$9|S|A|T|B|C]]|D|@$9|U|A|V|1|W]|$9|X|A|Y|1|Z]]|E|$]]|$1|F|3|-4|5|6|7|10|8|@]|D|@]|E|$]]]|G|$H|$5|I|J|K|E|$L|M]]|N|$5|I|J|K|E|$L|O]]]]

<code>window.location.reload(true)</code> seems to have been deprecated by the HTML5 standard. One way to do this without using query strings is to use the <a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Clear-Site-Data" rel="noreferrer"><code>Clear-Site-Data</code> header</a>, which seems to <a href="https://www.w3.org/TR/clear-site-data/" rel="noreferrer">being standardized</a>.

blocks|key|1312151|text|试着使用这个|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1312152|+<script+language="JavaScript"+src="js/myscript.js"></script>|code-block|syntax|javascript|1312153|要这样做：|1312154|+<script+language="JavaScript"+src="js/myscript.js?n=1"></script>|1312155|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

try using this 

<pre><code> &lt;script language="JavaScript" src="js/myscript.js"&gt;&lt;/script&gt;
</code></pre>

To this:

<pre><code> &lt;script language="JavaScript" src="js/myscript.js?n=1"&gt;&lt;/script&gt;
</code></pre>

blocks|key|1311884|text|这是我在最新项目中使用的代码片段。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1311885|从控制器执行以下操作：|1311886|if+(+IS_DEV+)+{
++++$this->view->cacheBust+=+microtime(true);
}+else+{
++++$this->view->cacheBust+=+file_exists($versionFile)+
++++++++//+The+version+file+exists,+encode+it
++++++++?+urlencode(+file_get_contents($versionFile)+)
++++++++//+Use+today's+year+and+week+number+to+still+have+caching+and+busting+
++++++++:+date("YW");
}|code-block|syntax|javascript|1311887|从视图中：|1311888|<script+type="text/javascript"+src="/javascript/somefile.js?v=<?=+$this->cacheBust;+?>"></script>
<link+rel="stylesheet"+type="text/css"+href="/css/layout.css?v=<?=+$this->cacheBust;+?>">|1311889|我们的发布过程会生成一个带有当前版本修订号的文件。它的工作原理是对文件进行URL编码，并将其用作缓存终结器。作为故障转移，如果该文件不存在，则使用年份和周数，以便缓存仍然有效，并且至少每周刷新一次。|1311890|此外，这为开发环境中的每个页面加载提供了缓存崩溃，因此开发人员不必担心清除任何资源(javascript、css、ajax调用等)的缓存。|1311891|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|U|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|V|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|W|8|@]|9|@]|A|$G|H]]|$1|M|3|N|5|6|7|X|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|Y|8|@]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|R|$]]

Here's a snippet of what I'm using for my latest project.

From the controller:

<pre><code>if ( IS_DEV ) {
 $this-&gt;view-&gt;cacheBust = microtime(true);
} else {
 $this-&gt;view-&gt;cacheBust = file_exists($versionFile) 
 // The version file exists, encode it
 ? urlencode( file_get_contents($versionFile) )
 // Use today's year and week number to still have caching and busting 
 : date("YW");
}
</code></pre>

From the view:

<pre><code>&lt;script type="text/javascript" src="/javascript/somefile.js?v=&lt;?= $this-&gt;cacheBust; ?&gt;"&gt;&lt;/script&gt;
&lt;link rel="stylesheet" type="text/css" href="/css/layout.css?v=&lt;?= $this-&gt;cacheBust; ?&gt;"&gt;
</code></pre>

Our publishing process generates a file with the revision number of the current build. This works by URL encoding that file and using that as a cache buster. As a fail-over, if that file doesn't exist, the year and week number are used so that caching still works, and it will be refreshed at least once a week.

Also, this provides cache busting for every page load while in the development environment so that developers don't have to worry with clearing the cache for any resources (javascript, css, ajax calls, etc).

blocks|key|1312040|text|或者，您可以使用file_get_contets逐个服务器读取js文件，然后将js内容放入回显标头。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1312041|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

or you can just read js file by server with file_get_contets and then put in echo in the header the js contents

blocks|key|1312102|text|我有一些问题的代码建议的。内部j循环不起作用。下面是我成功使用的修改后的代码。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1312103|function+reloadScripts(toRefreshList/*+list+of+js+to+be+refresh+*/,+key+/*+change+this+key+every+time+you+want+force+a+refresh+*/)+{
++++var+scripts+=+document.getElementsByTagName('script');
++++for(var+i+=+0;+i+<+scripts.length;+i%2B%2B)+{
++++++++var+aScript+=+scripts[i];
++++++++for(var+j+=+0;+j+<+toRefreshList.length;+j%2B%2B)+{
++++++++++++var+toRefresh+=+toRefreshList[j];
++++++++++++if(aScript.src+&&+(aScript.src.indexOf(toRefresh)+>+-1))+{
++++++++++++++++new_src+=+aScript.src.replace(toRefresh,+toRefresh+%2B+'?k='+%2B+key);
++++++++++++++++//+console.log('Force+refresh+on+cached+script+files.+From:+'+%2B+aScript.src+%2B+'+to+'+%2B+new_src)
++++++++++++++++aScript.src+=+new_src;
++++++++++++}
++++++++}
++++}
}|code-block|syntax|javascript|1312104|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

I had some troubles with the code suggested by yboussard. The inner j loop didn't work. Here is the modified code that I use with success.

<pre><code>function reloadScripts(toRefreshList/* list of js to be refresh */, key /* change this key every time you want force a refresh */) {
 var scripts = document.getElementsByTagName('script');
 for(var i = 0; i &lt; scripts.length; i++) {
 var aScript = scripts[i];
 for(var j = 0; j &lt; toRefreshList.length; j++) {
 var toRefresh = toRefreshList[j];
 if(aScript.src &amp;&amp; (aScript.src.indexOf(toRefresh) &gt; -1)) {
 new_src = aScript.src.replace(toRefresh, toRefresh + '?k=' + key);
 // console.log('Force refresh on cached script files. From: ' + aScript.src + ' to ' + new_src)
 aScript.src = new_src;
 }
 }
 }
}
</code></pre>

blocks|key|1312125|text|如果您使用的是php，可以执行以下操作：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1312126|+<script+src="js/myscript.js?rev=<?php+echo+time();?>"
++++type="text/javascript"></script>|code-block|syntax|javascript|1312127|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

If you are using php can do:

<pre><code> &lt;script src="js/myscript.js?rev=&lt;?php echo time();?&gt;"
 type="text/javascript"&gt;&lt;/script&gt;
</code></pre>

blocks|key|1312260|text|你也可以使用meta+HTML标签禁用浏览器缓存，只需将html标签放在head部分，以避免在编码/测试时缓存网页，当你完成后，你可以删除meta标签。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1312261|(在head部分)|1312262|<meta+http-equiv="Cache-Control"+content="no-cache,+no-store,+must-revalidate"+/>
<meta+http-equiv="Pragma"+content="no-cache"+/>
<meta+http-equiv="Expires"+content="0"/>|code-block|syntax|javascript|1312263|在头部粘贴此代码后刷新页面，也应该刷新新的javascript代码。|1312264|如果您需要http://cristian.sulea.net/blog/disable-browser-caching-with-meta-html-tags/，此链接将为您提供其他选项|offset|length|1312265|或者，您可以像这样创建一个按钮|1312266|<button+type="button"+onclick="location.reload(true)">Refresh</button>|1312267|它会刷新并避免缓存，但它将在您的页面上，直到您完成测试，然后您可以将其删除。我认为第一个选择是最好的。|1312268|entityMap|0|LINK|mutability|MUTABLE|url|http://cristian.sulea.net/blog/disable-browser-caching-with-meta-html-tags/^0|0|0|0|0|5|23|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|12|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|13|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|14|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|15|8|@]|9|@]|A|$]]|$1|K|3|L|5|6|7|16|8|@]|9|@$M|17|N|18|1|19]]|A|$]]|$1|O|3|P|5|6|7|1A|8|@]|9|@]|A|$]]|$1|Q|3|R|5|F|7|1B|8|@]|9|@]|A|$G|H]]|$1|S|3|T|5|6|7|1C|8|@]|9|@]|A|$]]|$1|U|3|-4|5|6|7|1D|8|@]|9|@]|A|$]]]|V|$W|$5|X|Y|Z|A|$10|11]]]]

You can also disable browser caching with meta HTML tags just put html tags in the head section to avoid the web page to be cached while you are coding/testing and when you are done you can remove the meta tags.

(in the head section)

<pre><code>&lt;meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /&gt;
&lt;meta http-equiv="Pragma" content="no-cache" /&gt;
&lt;meta http-equiv="Expires" content="0"/&gt;
</code></pre>

Refresh your page after pasting this in the head and should refresh the new javascript code too.

This link will give you other options if you need them
<a href="http://cristian.sulea.net/blog/disable-browser-caching-with-meta-html-tags/" rel="nofollow noreferrer">http://cristian.sulea.net/blog/disable-browser-caching-with-meta-html-tags/</a>

or you can just create a button like so

<pre><code>&lt;button type="button" onclick="location.reload(true)"&gt;Refresh&lt;/button&gt;
</code></pre>

it refreshes and avoid caching but it will be there on your page till you finish testing, then you can take it off. Fist option is best I thing.

blocks|key|1526883|text|我倾向于对框架进行版本化，然后将版本号应用于脚本和样式路径|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1526884|<cfset+fw.version+=+'001'+/>
<script+src="/scripts/#fw.version#/foo.js"/>|code-block|syntax|javascript|1526885|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

I tend to version my framework then apply the version number to script and style paths

<pre><code>&lt;cfset fw.version = '001' /&gt;
&lt;script src="/scripts/#fw.version#/foo.js"/&gt;
</code></pre>

blocks|key|1312199|text|Cache.delete()可以用于新的chrome，火狐和opera。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1312200|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/API/Cache/delete^0|0|E|0|0^^$0|@$1|2|3|4|5|6|7|L|8|@]|9|@$A|M|B|N|1|O]]|C|$]]|$1|D|3|-4|5|6|7|P|8|@]|9|@]|C|$]]]|E|$F|$5|G|H|I|C|$J|K]]]]

<a href="https://developer.mozilla.org/en-US/docs/Web/API/Cache/delete" rel="nofollow noreferrer">Cache.delete()</a> can be used for new chrome, firefox and opera.

blocks|key|1312448|text|我最近找到了这个问题的解决方案。在我的例子中，我试图使用javascript更新html元素；我一直在使用XHR根据从GET请求检索到的数据更新文本。尽管XHR请求经常发生，但缓存的HTML数据仍然令人沮丧地保持不变。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1312449|最近，我在fetch应用程序接口中发现了一种缓存破坏方法。fetch+api取代了XHR，并且使用起来非常简单。下面是一个例子：|offset|length|style|CODE|1312450|++++++++async+function+updateHTMLElement(t)+{
++++++++++++let+res+=+await+fetch(url,+{cache:+"no-store"});
++++++++++++if(res.ok){
++++++++++++++++let+myTxt+=+await+res.text();
++++++++++++++++document.getElementById('myElement').innerHTML+=+myTxt;
++++++++++++}
++++++++}|code-block|syntax|javascript|1312451|注意到{cache:+"no-store"}参数了吗？这会导致浏览器清除该元素的缓存，以便正确加载新数据。天哪，这对我来说简直是天赐之物。我希望这对你也有帮助。|1312452|顺便说一句，要为在服务器端更新的图像清除缓存，但保留相同的src属性，最简单、最古老的方法是简单地使用Date.now()，并将该数字作为url变量附加到该图像的src属性中。这可以可靠地处理图像，但不能处理HTML元素。但是在这两种技术之间，你现在可以更新任何你需要的信息:-)|1312453|entityMap^0|0|5|5|0|0|3|J|0|T|3|1F|A|29|3|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|T|8|@$D|U|E|V|F|G]]|9|@]|A|$]]|$1|H|3|I|5|J|7|W|8|@]|9|@]|A|$K|L]]|$1|M|3|N|5|6|7|X|8|@$D|Y|E|Z|F|G]]|9|@]|A|$]]|$1|O|3|P|5|6|7|10|8|@$D|11|E|12|F|G]|$D|13|E|14|F|G]|$D|15|E|16|F|G]]|9|@]|A|$]]|$1|Q|3|-4|5|6|7|17|8|@]|9|@]|A|$]]]|R|$]]

I found a solution to this problem recently. In my case, I was trying to update an html element using javascript; I had been using XHR to update text based on data retrieved from a GET request. Although the XHR request happened frequently, the cached HTML data remained frustratingly the same.
Recently, I discovered a cache busting method in the <code>fetch</code> api. The fetch api replaces XHR, and it is super simple to use. Here's an example:
<pre><code> async function updateHTMLElement(t) {
 let res = await fetch(url, {cache: &quot;no-store&quot;});
 if(res.ok){
 let myTxt = await res.text();
 document.getElementById('myElement').innerHTML = myTxt;
 }
 }
</code></pre>
Notice that <code>{cache: &quot;no-store&quot;}</code> argument? This causes the browser to bust the cache for that element, so that new data gets loaded properly. My goodness, this was a godsend for me. I hope this is helpful for you, too.
Tangentially, to bust the cache for an image that gets updated on the server side, but keeps the same <code>src</code> attribute, the simplest and oldest method is to simply use <code>Date.now()</code>, and append that number as a url variable to the <code>src</code> attribute for that image. This works reliably for images, but not for HTML elements. But between these two techniques, you can update any info you need to now :-)

blocks|key|1527589|text|本主题中已经提到了大多数正确答案。然而，我想添加链接到一篇文章，这是我能读到的最好的一篇。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1527590|https://www.fastly.com/blog/clearing-cache-browser|offset|length|1527591|据我所知，最合适的解决方案是：|1527592|在iframe中发布。接下来是从建议的帖子中减去以下内容：|1527593|=============|1527594|const+ifr+=+document.createElement('iframe');
ifr.name+=+ifr.id+=+'ifr_'%2BDate.now();
document.body.appendChild(ifr);
const+form+=+document.createElement('form');
form.method+=+"POST";
form.target+=+ifr.name;
form.action+=+‘/thing/stuck/in/cache’;
document.body.appendChild(form);
form.submit();|code-block|syntax|javascript|1527595|有一些明显的副作用:这将创建一个浏览器历史记录条目，并受到响应的非缓存的相同问题的影响。但它避开了fetch存在的印前检查要求，而且由于它是一个导航，拆分缓存的浏览器将清除正确的缓存。|1527596|这一次几乎就成功了。Firefox将为跨域资源保留被卡住的对象，但仅用于后续的获取。每个浏览器都将使对象的导航缓存无效，无论是相同资源还是跨源资源。|1527597|==============================|1527598|我们尝试了很多方法，但其中一种效果很好。唯一的问题是，您需要能够以某种方式将此脚本带到最终用户页面，以便能够重置缓存。在我们的特殊情况下，我们很幸运。|1527599|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|1E|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|15|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|16|8|@]|9|@$D|17|E|18|1|19]]|A|$]]|$1|F|3|G|5|6|7|1A|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|1B|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|1C|8|@]|9|@]|A|$]]|$1|L|3|M|5|N|7|1D|8|@]|9|@]|A|$O|P]]|$1|Q|3|R|5|6|7|1E|8|@]|9|@]|A|$]]|$1|S|3|T|5|6|7|1F|8|@]|9|@]|A|$]]|$1|U|3|V|5|6|7|1G|8|@]|9|@]|A|$]]|$1|W|3|X|5|6|7|1H|8|@]|9|@]|A|$]]|$1|Y|3|-4|5|6|7|1I|8|@]|9|@]|A|$]]]|Z|$10|$5|11|12|13|A|$14|C]]]]

Most of the right answers are already mentioned in this topic. However I want to add link to the one article which is the best one I was able to read.
<a href="https://www.fastly.com/blog/clearing-cache-browser" rel="nofollow noreferrer">https://www.fastly.com/blog/clearing-cache-browser</a>
As far as I can see the most suitable solution is:
POST in an iframe. Next is a small subtract from the suggested post:
=============
<pre><code>const ifr = document.createElement('iframe');
ifr.name = ifr.id = 'ifr_'+Date.now();
document.body.appendChild(ifr);
const form = document.createElement('form');
form.method = &quot;POST&quot;;
form.target = ifr.name;
form.action = ‘/thing/stuck/in/cache’;
document.body.appendChild(form);
form.submit();
</code></pre>
There’s a few obvious side effects: this will create a browser history entry, and is subject to the same issues of non-caching of the response. But it escapes the preflight requirements that exist for fetch, and since it’s a navigation, browsers that split caches will be clearing the right one.
This one almost nails it. Firefox will hold on to the stuck object for cross-origin resources but only for subsequent fetches. Every browser will invalidate the navigation cache for the object, both for same and cross origin resources.
==============================
We tried many things but that one works pretty well. The only issue is there you need to be able to bring this script somehow to end user page so you are able to reset cache. We were lucky in our particular case.

blocks|key|1312172|text|window.parent.caches.delete("call")|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1312173|在控制台中执行代码后，关闭并打开浏览器。|unstyled|1312174|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$B|C]]|$1|D|3|E|5|F|7|J|8|@]|9|@]|A|$]]|$1|G|3|-4|5|F|7|K|8|@]|9|@]|A|$]]]|H|$]]

<pre><code>window.parent.caches.delete("call")
</code></pre>

close and open the browser after executing the code in console.

blocks|key|1312311|text|由于浏览器缓存的链接相同，你应该在url的末尾添加一个随机数。new+Date().getTime()会生成一个不同的数字。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1312312|只需添加链接末尾的new+Date().getTime()作为like调用|1312313|'https://stackoverflow.com/questions.php?'+%2B+new+Date().getTime()|code-block|syntax|javascript|1312314|输出：https://stackoverflow.com/questions.php?1571737901173|1312315|entityMap^0|V|K|0|9|K|0|0|3|1H|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|T|8|@$9|U|A|V|B|C]]|D|@]|E|$]]|$1|H|3|I|5|J|7|W|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|6|7|X|8|@$9|Y|A|Z|B|C]]|D|@]|E|$]]|$1|O|3|-4|5|6|7|10|8|@]|D|@]|E|$]]]|P|$]]

Cause browser cache same link, you should add a random number end of the url.
<code>
new Date().getTime()</code> generate a different number.

Just add <code>new Date().getTime()</code> end of link as like
call

<pre class="lang-js prettyprint-override"><code>'https://stackoverflow.com/questions.php?' + new Date().getTime()
</code></pre>

Output: <code>https://stackoverflow.com/questions.php?1571737901173</code>

blocks|key|1527495|text|我已经通过使用ETag解决了这个问题|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1527496|Etag类似于指纹，如果给定URL处的资源发生变化，则必须生成新的Etag值。它们的比较可以确定资源的两个表示是否相同。|1527497|entityMap|0|LINK|mutability|MUTABLE|url|https://en.wikipedia.org/wiki/HTTP_ETag^0|7|4|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]]|C|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@]|C|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]]]

I've solved this issue by using
<a href="https://en.wikipedia.org/wiki/HTTP_ETag" rel="nofollow noreferrer">ETag</a>
Etags are similar to fingerprints, and if the resource at a given URL changes, a new Etag value must be generated. A comparison of them can determine whether two representations of a resource are the same.

How do I clear a browsers cache with JavaScript?

We deployed the latest JavaScript code but we are unable to get the latest JavaScript code.

Editorial Note: This question is semi-duplicated in the following places, and the answer in the first of the following questions is probably the best. This accepted answer is no longer the ideal solution.

<a href="https://stackoverflow.com/questions/118884/how-to-force-browser-to-reload-cached-css-js-files">How to force browser to reload cached CSS/JS files?</a>

<a href="https://stackoverflow.com/questions/32414/how-can-i-force-clients-to-refresh-javascript-files">How can I force clients to refresh JavaScript files?</a> 

<a href="https://stackoverflow.com/questions/12079631/dynamically-reload-local-javascript-source-json-data">Dynamically reload local Javascript source / json data</a>

Clear the cache in JavaScript

服务器

HTML5

如何使用JavaScript清除浏览器缓存？我们部署了最新的JavaScript代码，但无法获得最新的JavaScript代码。编者按:这个问题在以下地方是半重复的，下面第一个问题中的答案可能是最好的。这个公认的答案不再是理想的解决方案。

问清除JavaScript中的缓存
EN

回答 20

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问清除JavaScript中的缓存EN

回答 20

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问清除JavaScript中的缓存
EN