Rumah > hujung hadapan web > tutorial js > Sistem Pembalakan dengan Proksi dan Ambil

Sistem Pembalakan dengan Proksi dan Ambil

Patricia Arquette
Lepaskan: 2024-12-03 09:12:10
asal
680 orang telah melayarinya

Logging System with Proxy and Fetch

  1. Objek Proksi: FetchLogger membalut fungsi ambil.
    Ia menggunakan perangkap guna untuk memintas panggilan untuk diambil.

  2. 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.

  3. Pengendalian Ralat: Tangkap dan catatkan sebarang ralat yang dihadapi semasa pengambilan.

  4. 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));
Salin selepas log masuk

Gantikan pengambilan Global dengan Pengelogan

window.fetch = fetchLogger;
Salin selepas log masuk

Atas ialah kandungan terperinci Sistem Pembalakan dengan Proksi dan Ambil. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan