AJAX 是一種常用的前端技術(shù)，它可以通過 JavaScript 在不刷新頁面的情況下與服務(wù)器進(jìn)行數(shù)據(jù)交互。而寫入 JSON 文件是 AJAX 的一個(gè)常見應(yīng)用之一。JSON（JavaScript Object Notation）是一種輕量級(jí)的數(shù)據(jù)交換格式，常用于前后端數(shù)據(jù)交互。通過 AJAX 將數(shù)據(jù)寫入 JSON 文件，可以實(shí)現(xiàn)動(dòng)態(tài)更新數(shù)據(jù)的功能。本文將介紹如何使用 AJAX 寫入 JSON 文件，并通過舉例說明其實(shí)際應(yīng)用。

AJAX 實(shí)現(xiàn)寫入 JSON 文件的過程可以分為以下幾個(gè)步驟：

1. 創(chuàng)建 XMLHttpRequest 對(duì)象。
2. 使用 XMLHttpRequest 對(duì)象發(fā)送請(qǐng)求到服務(wù)器。
3. 在服務(wù)器上處理請(qǐng)求，將數(shù)據(jù)寫入 JSON 文件。
4. 通過 AJAX 接收服務(wù)器返回的響應(yīng)。
5. 根據(jù)服務(wù)器返回的響應(yīng)進(jìn)行相應(yīng)的處理。

下面以一個(gè)留言板的例子來說明如何使用 AJAX 將用戶的留言寫入 JSON 文件。

let xhr = new XMLHttpRequest();
xhr.open("POST", "save_message.php", true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
let response = JSON.parse(xhr.responseText);
// 根據(jù)服務(wù)器返回的響應(yīng)進(jìn)行相應(yīng)的處理
console.log(response);
}
};
let message = {
name: "Alice",
content: "Hello AJAX!"
};
xhr.send(JSON.stringify(message));

在上述代碼中，我們首先創(chuàng)建了一個(gè) XMLHttpRequest 對(duì)象，并定義了請(qǐng)求的方法（POST）、請(qǐng)求的 URL（save_message.php）以及是否異步發(fā)送請(qǐng)求（true）等信息。然后設(shè)置了請(qǐng)求頭部，告訴服務(wù)器我們將發(fā)送的數(shù)據(jù)是 JSON 格式。接著定義了當(dāng) readyState 狀態(tài)碼等于 4 并且 status 狀態(tài)碼等于 200 時(shí)的回調(diào)函數(shù)，即當(dāng)請(qǐng)求完成且成功時(shí)執(zhí)行的代碼。在回調(diào)函數(shù)中，我們使用 JSON.parse 將服務(wù)器返回的響應(yīng)轉(zhuǎn)換為 JSON 對(duì)象，并對(duì)其進(jìn)行相應(yīng)的處理。最后，我們定義了一個(gè)名為 message 的對(duì)象，并使用 JSON.stringify 將其轉(zhuǎn)換為 JSON 字符串，然后通過 send 方法將其發(fā)送到服務(wù)器。

接下來我們?cè)诜?wù)器端使用 PHP 來處理請(qǐng)求。

$message = $_POST["message"];
$file = fopen("messages.json", "a");
fwrite($file, json_encode($message) . "\n");
fclose($file);
echo json_encode(["success" =>true]);

在上述 PHP 代碼中，首先通過 $_POST["message"] 獲取到前端發(fā)送的數(shù)據(jù)。然后使用 fopen 函數(shù)以追加方式打開 JSON 文件，并使用 fwrite 函數(shù)將 JSON 字符串寫入文件中。最后關(guān)閉文件并向前端返回一個(gè) JSON 響應(yīng)，表示寫入成功。

這樣，我們就完成了通過 AJAX 將用戶的留言寫入 JSON 文件的整個(gè)過程。通過前后端的配合，實(shí)現(xiàn)了動(dòng)態(tài)更新數(shù)據(jù)的功能。當(dāng)然，這只是一個(gè)簡(jiǎn)單的例子，實(shí)際應(yīng)用時(shí)可能需要更多的數(shù)據(jù)處理和安全性考慮。但希望通過這個(gè)例子，你能對(duì)如何使用 AJAX 寫入 JSON 文件有一個(gè)基本的了解。