Ajax（Asynchronous JavaScript and XML）是一種在網頁上進行異步數據傳輸的技術，它可以在不刷新整個網頁的情況下與服務器交換數據。在傳統的網頁中，如果我們想要獲取或展示一個PDF文件，通常需要將PDF文件鏈接到一個新的頁面或被瀏覽器下載。然而，通過使用Ajax，我們可以通過異步方式傳遞PDF數據流，將其直接顯示在網頁中，為用戶提供更好的瀏覽體驗。

舉例來說，假設我們有一個網頁應用程序，用戶登錄后可以查看和下載他們的電子賬單。在過去，我們可能需要為每個賬單創建一個PDF鏈接，用戶需要點擊鏈接才能查看或下載賬單。然而，使用Ajax可以實現直接將PDF數據流傳遞到網頁中，用戶可以直接在網頁上查看和下載賬單，無需離開當前頁面。

function viewPDF() {
var xhr = new XMLHttpRequest();
xhr.open("GET", "getPDF.php", true);
xhr.setRequestHeader("Content-Type", "application/pdf");
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var blob = new Blob([xhr.response], {type: "application/pdf"});
var url = URL.createObjectURL(blob);
var pdfViewer = document.getElementById("pdfViewer");
pdfViewer.src = url;
}
}
xhr.send();
}

在上述代碼中，我們通過XMLHttpRequest對象發送一個GET請求到一個名為getPDF.php的服務器端文件。服務器端文件應該返回一個PDF數據流作為響應。在客戶端，我們首先創建一個Blob對象，將服務器返回的PDF數據流放入其中，并指定mime類型為application/pdf。接著我們使用URL.createObjectURL()函數創建一個URL，最后將該URL賦值給一個擁有id為pdfViewer的元素的src屬性，這樣就可以在網頁上顯示PDF了。

除了顯示PDF文件，我們還可以使用Ajax將用戶在網頁上進行的操作以數據流的形式發送到服務器進行處理。例如，假設我們有一個表單讓用戶填寫一些信息，并且希望將這些信息保存為PDF文件并發送給服務器。我們可以使用jsPDF庫生成PDF文件，并將文件內容通過Ajax異步傳遞到服務器。

function saveFormAsPDF() {
var doc = new jsPDF();
var formData = getFormData(); // 函數用于獲取表單數據
doc.text("表單內容", 10, 10);
doc.text(JSON.stringify(formData), 10, 20);
var pdfData = doc.output("arraybuffer");
var xhr = new XMLHttpRequest();
xhr.open("POST", "savePDF.php", true);
xhr.setRequestHeader("Content-Type", "application/pdf");
xhr.onreadystatechange = function () {
if (xhr.readyState === 4 && xhr.status === 200) {
console.log("PDF文件已成功保存到服務器。");
}
}
xhr.send(pdfData);
}

在上述代碼中，我們首先使用jsPDF庫創建一個PDF文檔，并使用表單數據填充文檔內容。然后，我們使用doc.output("arraybuffer")函數將PDF數據流轉換為ArrayBuffer，并通過XMLHttpRequest對象的POST請求將數據發送到名為savePDF.php的服務器端文件進行保存。

通過結合Ajax和異步傳遞PDF數據流，我們可以在網頁中更加方便地展示和處理PDF文件。無論是直接在網頁上查看PDF文件，還是通過Ajax發送用戶填寫的表單數據，這項技術都為用戶和開發者帶來了更好的體驗和更多的靈活性。