ng-connection-monitor

🌐 Angular Network Status

A lightweight Angular library to detect actual internet connectivity by pinging a backend endpoint — not just relying on navigator.onLine.

🚀 Why This Library?

• navigator.onLine is unreliable — it only checks local connection, not real internet access.
• This library actively pings a backend server to verify actual connectivity.
• Exposes a clean RxJS Observable (isOnline$) to subscribe from any component or service.
• Fully compatible with Angular v13 and above.

---

📦 Installation

npm install ng-connection-monitor

⚙️ Setup

1. Import HttpClientModule in your AppModule

import { HttpClientModule } from '@angular/common/http';
@NgModule({
  imports: [
    HttpClientModule,
    // other imports
  ],
})
export class AppModule {}

2. Import NgConnectionMonitorModule in your AppModule

import { NgConnectionMonitorService } from './ng-connection-monitor.service';
@NgModule({
  declarations: [],
  imports: [
    CommonModule
  ],
  providers:[NgConnectionMonitorService]
})
export class NgConnectionMonitorModule { }

3.Use the NgConnectionMonitorService in your component

import { NgConnectionMonitorService } from 'ng-connection-monitor'; // library import

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'demo';
  onlineStatus:any
  constructor(private networkStatusService: NgConnectionMonitorService){
      this.networkStatusService.isOnline$.subscribe(data=>{
        this.onlineStatus = data
        console.log("data",data)
      });

  }
}

🧪 How It Works

• Starts a timer loop every 3 seconds

• Pings the configured backend endpoint (default: /api/ping)

• If response is 200, emits true, else false

• Keeps emitting changes only when status flips (distinctUntilChanged)

✅ API

isOnline$ : Observable<boolean>

Subscribe to this to get real-time connectivity status.

💡 Roadmap / Future Ideas

• Detect slow internet & emit custom message (e.g., "Slow Connection Detected")

• Support multi-ping strategies

• Angular signals support (v17+)

🛡️ License

Let me know if you want to replace Sourav with your actual GitHub handle or real name.