프록시 및 가져오기를 사용한 로깅 시스템

1. 프록시 개체: fetchLogger는 가져오기 기능을 래핑합니다.
   적용 트랩을 사용하여 가져오기 호출을 차단합니다.

2. 요청 로깅: 요청의 URL과 옵션을 기록합니다.
   응답 처리: 응답 상태, 상태 텍스트 및 URL을 기록합니다.
   본문을 여러 번 읽을 수 있도록 응답을 복제합니다.

3. 오류 처리: 가져오는 동안 발생한 오류를 캡처하고 기록합니다.

4. 프록시 사용: 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;

위 내용은 프록시 및 가져오기를 사용한 로깅 시스템의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!