互联网连接 Ionic/Angular 的监听器

Question

嘿，我正在尝试向我的离子应用程序添加一个侦听器，该侦听器侦听网络活动的变化，然后采取相应的行动。

import { Component } from '@angular/core';
import { Network } from '@capacitor/network';

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.scss'],
})
export class AppComponent {

  constructor() {
    this.initializeNetworkEvents();
  }

  initializeNetworkEvents() {
    Network.addListener('networkStatusChange', (status) => {
      console.log('Network status changed', status);
      
      if (status.connected) {
        this.syncOfflineData();
      }
    });

    // Check the current network status on app start
    this.checkNetworkStatus();
  }

  async checkNetworkStatus() {
    const status = await Network.getStatus();
    console.log('Current network status:', status);
  }

  async syncOfflineData() {
    console.log('Syncing offline data');
  }
}

现在这是我的 app.component.ts 中的代码。它会在启动时记录状态，但每当我断开 wifi 与电脑的连接并再次连接时，它都不会接收或记录任何内容。是不是因为我用的是电脑而不是手机来测试的？

Answer 1

所以我发现了问题，只是想将答案留在这里，以防有人遇到同样的问题。原来我在本地主机，这就是它不起作用的原因。我在 Chrome 中使用离线模式，效果很好！