title: Angular 5 - How to make an API call when user closes the browser window?
body: <p>I have a tracking mechanism through which I send JSON objects to an API endpoint during the stay of an user on a web page. So I am sending API calls on some particular events. The API has to receive a call when the user leaves the page.</p>
  
  <p>The problem is that I am using the functions below to trigger when the user closes the broser, but the functions are triggered only in browser debug mode.</p>
  
  <p><code>
      // page-wrapper.component.ts
      ...
      // triggers on DOM unload
      @HostListener('window:unload', ['$event'])
      unloadHandler(event) {
         this.service.apiCall();     // this is nevertriggered
         console.log('unloaded DOM') // triggered only in browser debug mode
      }
      // triggers just before unloadHandler()
      @HostListener('window:beforeunload', ['$event'])
      beforeUnloadHander(event) {
         this.service.apiCall();    // same as above
      }
  </code></p>
  
  <p>So I tried both the methods. If I debug them The methods seems to be triggered but the APIs do not receive anything. </p>
  
  <p>I can ensure that the function that contacts the APIs was tested and it has no problems.</p>
  
  <p>I think the problem is related to <code>unloadHandler()</code> or <code>beforeUnloadHandler()</code>.</p>
  
  <p>Does someone know how to call an api when the user closes the broser window or the browser tab? </p>
  
  <p>Note: that the application could live in a standalone browser tab or an iframe.</p>