使用Angular 4检查Web中的Internet连接

Question

我正在使用Angular 4进行应用程序开发.我需要检查网络连接是否可用,因为它有使用Angular for的任何连接问题.是否可以使用Angular 4.

我查了一下https://github.com/HubSpot/offline.我认为这对角4不起作用.任何人请建议.这是否可以为Angular 4或任何其他替代品使用offlinejs？

谢谢Sarath CM

Answer 1

您不必为此使用任何库,您可以使用 navigator像窗口这样的全局对象.你可以在angular4中使用in

public onlineOffline: boolean = navigator.onLine;

Answer 2

我们不需要任何库，但是public onlineOffline: boolean = navigator.onLine;可以解决问题，但这只是一次检查。我们需要将此值视为可观察的值，因此，每当在线状态发生变化时，我们都会进行更新。为此，rxjs将有所帮助。

导入这些

import { Observable, Observer, fromEvent, merge } from 'rxjs';
import { map } from 'rxjs/operators';

添加此方法

  createOnline$() {
    return merge<boolean>(
      fromEvent(window, 'offline').pipe(map(() => false)),
      fromEvent(window, 'online').pipe(map(() => true)),
      new Observable((sub: Observer<boolean>) => {
        sub.next(navigator.onLine);
        sub.complete();
      }));
  }

从您的结构或ngOnInit订阅此事件

this.createOnline$().subscribe(isOnline => console.log(isOnline));

注意：我正在使用Angular 8.1和rxjs 6.5.2