Angular 2 – Esegue il codice quando si chiude la finestra

Sto lavorando su un’applicazione di chat usando angular 2.

Come posso inviare il comando di fine chat al back-end quando l’utente chiude la finestra?

Il mio componente ha un metodo che chiama il servizio di backend per terminare la chat nel modo seguente

endChat() { this.chatService.endChat(this.chatSessionInfo).subscribe( result => this.OnGetMessages(result), error => this.OnChatEndError(error) ); } 

Come posso eseguire quel codice quando chiudo la finestra? Come posso rilevare l’evento di chiusura della finestra?

Ho provato con ngOnDestroy ma per qualche motivo il codice non viene eseguito.

Nel mio Component.ts che ho.

 import { Component, OnInit, AfterViewChecked, ElementRef, ViewChild,OnDestroy} from '@angular/core'; export class ChatComponent implements OnInit, AfterViewChecked,OnDestroy { 

e infine

  ngOnDestroy() { this.endChat(); } 

Grazie!

Grazie a tutti per l’aiuto. Sono stato in grado di creare una soluzione basata su diverse proposte.

Per prima cosa ho usato l’evento beforeunload nel componente

 @HostListener('window:beforeunload', ['$event']) beforeunloadHandler(event) { this.endChat(); } 

dove

 endChat() { this.chatService.endChatSync(this.chatSessionInfo); } 

Quindi, il trucco è rendere la sincronizzazione della chiamata http non asincrona.

Prima, il metodo di endchat al servizio di chat era

  endChat(chatSessionInfo: ChatSessionInfo) : Observable { console.log("Ending chat.."); let body = JSON.stringify(chatSessionInfo); let headers = new Headers({ 'Content-Type': 'application/json' }); let options = new RequestOptions({ headers: headers }); return this.http.delete(this.apiUrl + "Chat?userId="+chatSessionInfo.UserId+"&secureKey="+chatSessionInfo.SecureKey,options) .map(this.extractData) .catch(this.handleError); } 

Sono stato in grado di farlo funzionare

 endChatSync(chatSessionInfo: ChatSessionInfo) { console.log("Ending chat.."); let xhr = new XMLHttpRequest() xhr.open("DELETE",this.apiUrl +"Chat?userId="+chatSessionInfo.UserId+"&secureKey="+chatSessionInfo.SecureKey,false); xhr.send(); } 

Spero che questo ti aiuti!

 @HostListener('window:unload', ['$event']) unloadHandler(event) { ... } 

Vedi anche javascript per controllare quando la finestra del browser è chiusa