CodePen -> getJSON 仅在 IE 中有效，但在 Chrome 或 FF 中无效，这是为什么？

Question

请帮我出出主意我创造了这支笔 https://codepen.io/Dimas_X/pen/yKEzBE?editors=0010

$(function() { 
  const func = function(){
        let counter = 0;
        return function(){
        $.getJSON("https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1",
          function(data){
            $('p').html(data[0].content + '<p>'+ data[0].title  +'</p>');
          });
          counter++;
          $('span').html(counter);
       }
  }
  $('button').on('click', func());
 // $('button').trigger('click');
});

而且它只能在 IE 中正常工作。在 Chrome 中，它在 devTools 打开时工作。点击计数器有效，意味着点击事件有效。控制台中没有任何错误。提前致谢。

Answer 1

我看到在 firefox 和 chrome 的网络选项卡中多次发出请求，但每次响应都相同。您的应用程序正在正确填充第一个响应，就好像第一个请求正在被缓存一样。

如果您有权访问 Web 服务器代码，则由于 wp json，似乎正在使用 wordpress。您应该添加以下代码以确保不缓存响应

header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");

一旦完成，我认为您的代码应该可以正常工作。

您还可以在前端每次执行对 "unique url" 的查询，方法是使 url .getJSON("https://quotesondesign.com/wp-json/posts?filter[orderby]=rand&filter[posts_per_page]=1?_=" + new Date().getTime() 以防止缓存

CodePen -> getJSON 仅在 IE 中有效，但在 Chrome 或 FF 中无效，这是为什么？

CodePen -> getJSON works only in IE but does not in Chrome or FF, why is that?

getjson