Rumah >hujung hadapan web >tutorial js >Sistem Pembalakan dengan Proksi dan Ambil
Objek Proksi: FetchLogger membalut fungsi ambil.
Ia menggunakan perangkap guna untuk memintas panggilan untuk diambil.
Pengelogan Permintaan:Melog url dan pilihan permintaan.
Pengendalian Respons: Log status respons, teks status dan URL.
Mengklonkan tindak balas untuk memastikan badan boleh dibaca beberapa kali.
Pengendalian Ralat: Tangkap dan catatkan sebarang ralat yang dihadapi semasa pengambilan.
Menggunakan Proksi: Anda boleh menggantikan fetch secara global dengan memberikan proksi kepada window.fetch.
// Create a logging wrapper for fetch using Proxy const fetchLogger = new Proxy(fetch, { apply: (target, thisArg, args) => { // Log the request details const [url, options] = args; console.log("Fetch Request:"); console.log("URL:", url); console.log("Options:", options); // Call the original fetch function return Reflect.apply(target, thisArg, args) .then(response => { // Log response details console.log("Fetch Response:"); console.log("Status:", response.status); console.log("Status Text:", response.statusText); console.log("URL:", response.url); // Return the response for further use return response.clone(); // Clone to allow response reuse }) .catch(error => { // Log errors console.error("Fetch Error:", error); throw error; // Rethrow the error for caller handling }); } }); // Example usage of the logging fetch fetchLogger("https://jsonplaceholder.typicode.com/posts", { method: "GET", headers: { "Content-Type": "application/json" } }) .then(response => response.json()) .then(data => console.log("Data:", data)) .catch(error => console.error("Error in fetch:", error));
window.fetch = fetchLogger;
Atas ialah kandungan terperinci Sistem Pembalakan dengan Proksi dan Ambil. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!