【Web】(AJAX缓存问题)挂载Flask上，更改本地文件，ajax依然读取以前的文件

最近工作需要，得搞搞前端，这种东西之前没有接触过。出现了各种各样的小错误，莫名奇妙。

在这里记录下出错的问题：

放上原生Js版的Ajax，来自W3school
个人代码差不多如下：

<script type="text/javascript">var xmlhttp;function loadXMLDoc(url){xmlhttp=null;if (window.XMLHttpRequest)  {// code for all new browsers  xmlhttp=new XMLHttpRequest();  }else if (window.ActiveXObject)  {// code for IE5 and IE6  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");  }if (xmlhttp!=null)  {  xmlhttp.onreadystatechange=state_Change;  xmlhttp.open("GET",url,true);  xmlhttp.send(null);  }else  {  alert("Your browser does not support XMLHTTP.");  }}function state_Change(){if (xmlhttp.readyState==4)  {// 4 = "loaded"  if (xmlhttp.status==200)    {// 200 = OK    // ...our code here...    }  else    {    alert("Problem retrieving XML data");    }  }}</script>

1. 直接双击运行html，在本地打开html文件，浏览器为chrome，报错原因：跨域冲突，ajax不支持访问本地原件

解决办法：之前没处理过前端的东西，我就直接将其挂载在Flask上了，得到一个local的域名，便解决了该问题。网上说的在Chrome的快捷方式的target后面加东西的，亲测无效

2. 本人是准备直接读取本地的json文件，然而更改json文件后，发现ajax读取的依然是之前的文件，甚至于我将本地json删除后，依然能正常读取。

一开始感觉很纳闷，文件都被我删了，还能读出来？后来发现应该是浏览器有缓存，把缓存清掉应该就可以了

前端坑太大，生活所迫。今后应该不会再涉及前端了，还是搞图像有意思

3. 清楚ajax缓存办法：

1、加时间戮
对于一个浏览器，你的第一次点击是会调用rpc请求的， 但是你再用同一个浏览器提交表单的时候， rpc不会被提交， 因为参数一样， 这个可能是ajax的XMLHttpRequest对象的问题， 如设置了时间间隔了，实际上是（new ActiveXObject(“Microsoft.XMLHTTP”)）所以， 在实际操作的时候， 给rpc的参数传递一个没有用的guid= new Date().getTime()
一个时间戳 ，以保证每次的点击事件都会激发rpc请求， 因为这样的参数（或者说url）是不一样的。
为什么要把时间戳追加到目标url？
在某些情况下， 有些浏览器会把多个XMLHttpRequest请求的结果缓存在同一个url。如果对每个请求的响应不同，这就会带来不好的结果。把当前时间戳追加到url的最后，就能确保url的唯一性，从而避免浏览器的缓存结果。

2、在要异步获取的页面中写一段禁止缓存的代码：
Response.Buffer =True
Response.ExpiresAbsolute =Now() - 1
Response.Expires=0
Response.CacheControl=”no-cache”

3、在ajax发送请求前加上xmlHTTP.setRequestHeader(“If-Modified-Since”,”0”);可以禁止缓存
xmlHTTP.open(“get”, URL, true);
xmlHTTP.onreadystatechange = callHTML;
xmlHTTP.setRequestHeader(“If-Modified-Since”,”0”);
xmlHTTP.send();

我仅仅测试了方案3，实验可用。

参考出处：https://www.cnblogs.com/cgli/archive/2011/01/20/1940329.html