javascript - Ajax 未获取最新版本的 JSON 文件

Question

总的来说，我对术语和编码相当陌生，但我已经尝试精简我的代码，尽管它可能仍然有冗余。预先感谢您的理解。

我正在使用 ajax 和 php 脚本将一些数据写入服务器上名为 data.json 的文件中。该脚本运行良好，打开 json 文件显示它确实已使用数据进行更新。 json 文件仅包含一个对象数组。

这是执行此操作的代码:

function writeData() {
    $.ajax({
        type : "POST",
        url : "save.php",
        async : true, 
        data : {
        json : JSON.stringify(dataToWrite)
        }
    });

document.getElementById('success-box').innerHTML = "Data successfully written.";
};

...和 ​​PHP:

<?php
   $json = $_POST['json'];
   $file = fopen('data.json','w+');
   fwrite($file, $json);
   fclose($file);
?>

我遇到的问题是:用户可以导航到单独的 HTML 页面，并且可以单击按钮以格式良好的方式查看 json 文件中的数据。这是通过另一个读取数据的 ajax 脚本完成的。后一个 ajax 脚本似乎无法“看到”新更新的 json 文件。相反，它会在使用第一个 ajax 脚本更新文件之前加载旧版本的文件。我确信第二个 ajax 脚本是在上面的 writeData() 完成后运行的，因为它实际上完全位于一个单独的 HTML 页面上，稍后在用户单击按钮后加载。

这是从 data.json 文件读取数据的第二个 ajax 脚本(位于另一个单独的 HTML 页面上):

$.ajax({
        type : "GET",
        url : "http://eslquiz.net/ell_errors/data.json",
        async : true,
        dataType : 'json',
        success : function(response) {

          data = response;

          document.getElementById('main').innerHTML = `
                <div id='top-stuff'>
                    <button onClick='viewData()'>Reset Filter</button>
                    <button onclick="print2()">Print Worksheet</button>
                </div>
                <br>
                <div id='left-column' class='column'></div>
                <div id='right-column' class='column'></div>
          `;

          leftColumn = document.getElementById('left-column');
          rightColumn = document.getElementById('right-column');

          leftColumn.innerHTML = "<b>Sentences:</b> <br><br>";
          rightColumn.innerHTML = "<b>Errors:</b> <br><br>";

          //add the sentences and their errorTypes:
          for (i=0; i<data.length; i++) {

            var senBox = document.createElement('div');
            senBox.className = 'box';
            senBox.setAttribute('id', 'sen' + i)
            senBox.innerHTML += data[i].text;

            var errBox = document.createElement('div');
            errBox.className = 'box';
            errBox.setAttribute('id', 'err' + i)
            errBox.innerHTML += data[i].errorType;

            leftColumn.appendChild(senBox);
            rightColumn.appendChild(errBox);

          }

        }

    });

所有这些文件都托管在 One.com 上的同一目录中。

奇怪的是，当我手动打开 data.json 文件并以任何方式编辑其内容(例如，删除所有内容)时，下次进行 ajax 调用时，它会读取我刚刚手动更新的版本。这让我觉得这可能与 One.com 服务器 self 刷新有关？

我尝试调整同步/异步之间的ajax，并使用cache: false，但这些似乎没有影响任何东西。

我查了一下，似乎无法弄清楚这里发生了什么。感谢您提供的任何指导。

Answer 1

谢谢。我最终使用了以下内容:

jQuery.ajaxSetup({
    cache: false
});

我之前尝试过使用这个，但由于某种原因它不起作用，不知道为什么。但它现在正在发挥作用!谢谢。