本部分内容介绍了如何使用 PerformanceObserver 来监听网页中是否调用了特定接口的相关代码及使用说明。

代码部分

// 创建一个 PerformanceObserver 实例，该实例用于观察性能相关的事件
// 传入的回调函数会在有新的性能条目符合观察条件时被调用
const observer = new PerformanceObserver(_ => {
    // performance.getEntriesByName 方法用于获取指定名称的性能条目数组
    // 这里通过判断名称为 "接口ip" 的性能条目数组的长度是否大于 0
    // 来确定网页是否调用了该接口
    if (performance.getEntriesByName("接口ip")
       .length >
        0) {
        // 如果长度大于 0，说明网页调用了该接口，打印相应提示信息
        console.log('网页调用该接口')
    }

});
// 配置 observer 观察的性能条目类型为 "resource"
// "resource" 类型表示观察与资源加载相关的性能条目，如接口调用等
observer.observe({
    entryTypes: ["resource"]
});

涉及的对象和方法说明

PerformanceObserver 对象

说明	描述
构造函数	new PerformanceObserver(callback)，接受一个回调函数作为参数，当有新的性能条目符合观察条件时，该回调函数会被调用
方法	observe(options)，用于配置观察的条件，options 是一个对象，其中 entryTypes 是一个数组，指定要观察的性能条目类型，如 ["resource"] 表示观察资源相关的性能条目

performance 对象

说明	描述
方法	performance.getEntriesByName(name)，接受一个字符串参数 name，返回一个包含指定名称的性能条目的数组，这里用于获取名称为 "接口ip" 的性能条目数组来判断接口是否被调用

注意事项

1. 上述代码中 performance.getEntriesByName("接口ip") 中的 "接口ip" 需要根据实际的接口名称进行准确填写，否则可能无法正确判断接口是否被调用。
2. PerformanceObserver 主要用于观察性能相关的事件，通过观察 resource 类型的性能条目来判断接口调用情况，在实际应用中，可能还需要结合其他方式进行更准确的判断和处理。

希望通过以上文档内容，你能清晰理解如何使用 PerformanceObserver 来监听网页中特定接口的调用情况。