如何检查页面是否使用js重新加载

Question

您现在如何检查页面是否重新加载？

以前是这样的：

 //check for Navigation Timing API support if (window.performance) { console.info("window.performance works fine on this browser"); } console.info(performance.navigation.type); if (performance.navigation.type == performance.navigation.TYPE_RELOAD) { console.info( "This page is reloaded" ); } else { console.info( "This page is not reloaded"); }

但现在我发现导航类型已被弃用： https://developer.mozilla.org/en-US/docs/Web/API/Performance/navigation

然后我检查了替换： https://developer.mozilla.org/en-US/docs/Web/API/PerformanceNavigationTiming

即使在阅读之后，我仍然不太清楚我是如何做到这一点的。 那么检查页面是否刷新的新方法是如何工作的呢？

我读过之后也试过这个：

 if (PerformanceNavigationTiming.type == "reload") { alert('page reloaded') }

但随后将不会显示警报。

之后我尝试了这个：

 if (PerformanceNavigationTiming.type == PerformanceNavigationTiming.TYPE_RELOAD) { alert('page reloaded') }

但是它也会在没有页面刷新的情况下显示警报。

然后我尝试的最后一件事：

 const pageAccessedByReload = ( (PerformanceNavigationTiming && PerformanceNavigationTiming.TYPE === 1) || window.performance.getEntriesByType('navigation').map((nav) => nav.type).includes('reload') ); alert(pageAccessedByReload);

但这也给了我一个警报，要么在未重新加载时为假，在重新加载时为真。 而且我只希望在重新加载页面时发出警报。

Answer 1

您必须记住在阅读新的 API 文档时始终注意，输入 PerformanceNavigationTiming 是一个字符串而不是数字，因此正确的方法是：

 if (window.PerformanceNavigationTiming) { console.info("window.performance works fine on this browser"); if (PerformanceNavigationTiming.type === "reload") { console.info("This page is reloaded"); } else { console.info("This page is not reloaded"); } }

Answer 2

我终于找到了解决方案：

 const pageAccessedByReload = ( (PerformanceNavigationTiming && PerformanceNavigationTiming.TYPE === 1) || window.performance.getEntriesByType('navigation').map((nav) => nav.type).includes('reload') ); if (pageAccessedByReload == true) { alert(pageAccessedByReload); }

现在它只会在页面刷新时显示。