Fix(Network): Fix possible "Cannot read property" error by sendBeacon. (issue #615, #629)

Author: Maizify

CHANGELOG.md

@@ -1,13 +1,17 @@
 English | [简体中文](./CHANGELOG_CN.md)
 
+## 3.15.2 (2023-06-??)
+
+- `Fix(Network)` Fix possible "Cannot read property" error by `sendBeacon`. (issue #615, #629)
+
+
 ## 3.15.1 (2023-06-01)
 
 - `Feat(Netwrk)` Add new option `network.ignoreUrlRegExp` to skip some requests. (PR #623)
 - `Fix(Core)` Fix prototype pollution in `vConsole.setOption()`. (issue #616 #621)
 - `Fix(Core)` Fix plugin event `ready` triggering before its HTML finishes rendering. (issue #591)
 - `Fix(Log)` Reset group state when `console.clear()` is called. (issue #611)
 - `Fix(Log)` Compatible with iOS (less than 13.4) that does not support `ResizeObserver`, but there may be a potential performance issue when printing a large number of logs. (issue #610)
-- `Fix(Network)` Fix possible "Cannot read property" error by `sendBeacon`. (issue #615)
 
 
 ## 3.15.0 (2022-11-02)

CHANGELOG_CN.md

@@ -1,13 +1,17 @@
 [English](./CHANGELOG.md) | 简体中文
 
+## 3.15.2 (2023-06-??)
+
+- `Fix(Network)` 修复可能由 `sendBeacon` 引发的 "Cannot read property" 错误。(issue #615, #629)
+
+
 ## 3.15.1 (2023-06-01)
 
 - `Feat(Netwrk)` 新增配置项 `network.ignoreUrlRegExp` 以跳过一些请求。 (PR #623)
 - `Fix(Core)` 修复 `vConsole.setOption()` 中可能存在的原型污染问题。 (issue #616 #621)
 - `Fix(Core)` 修复插件事件 `ready` 在插件完成渲染前就被触发的问题。 (issue #591)
 - `Fix(Log)` 修复调用 `console.clear()` 时没有重置 group 层级的问题。 (issue #611)
 - `Fix(Log)` 兼容 iOS（小于 13.4）不支持 `ResizeObserver` 的情况，代价是打印大批量日志可能会有性能问题。 (issue #610)
-- `Fix(Network)` 修复可能由 `sendBeacon` 引发的 "Cannot read property" 错误。 (issue #615)
 
 
 ## 3.15.0 (2022-11-02)

src/network/beacon.proxy.ts

@@ -64,9 +64,16 @@ export class BeaconProxyHandler<T extends typeof navigator.sendBeacon> implement
 }
 
 export class BeaconProxy {
-  public static origSendBeacon = navigator.sendBeacon;
+  public static origSendBeacon = window?.navigator?.sendBeacon;
+
+  public static hasSendBeacon() {
+    return !!BeaconProxy.origSendBeacon;
+  }
 
   public static create(onUpdateCallback: IOnUpdateCallback) {
-    return new Proxy(navigator.sendBeacon, new BeaconProxyHandler(onUpdateCallback));
+    if (!BeaconProxy.hasSendBeacon()) {
+      return undefined;
+    }
+    return new Proxy(BeaconProxy.origSendBeacon, new BeaconProxyHandler(onUpdateCallback));
   }
 }

src/network/network.model.ts

@@ -36,7 +36,7 @@ export class VConsoleNetworkModel extends VConsoleModel {
     if (window.hasOwnProperty('fetch')) {
       window.fetch = FetchProxy.origFetch;
     }
-    if (!!window.navigator.sendBeacon) {
+    if (BeaconProxy.hasSendBeacon()) {
       window.navigator.sendBeacon = BeaconProxy.origSendBeacon;
     }
   }
@@ -105,7 +105,7 @@ export class VConsoleNetworkModel extends VConsoleModel {
    * @private
    */
   private mockSendBeacon() {
-    if (!window?.navigator?.sendBeacon) {
+    if (!BeaconProxy.hasSendBeacon()) {
       return;
     }
     window.navigator.sendBeacon = BeaconProxy.create((item: VConsoleNetworkRequestItem) => {