ContextQMD
Back to Content

NavigateEvent: signal property

files/en-us/web/api/navigateevent/signal/index.md

latest1.3 KB
Original Source

{{APIRef("Navigation API")}}

The signal read-only property of the {{domxref("NavigateEvent")}} interface returns an {{domxref("AbortSignal")}}, which will become aborted if the navigation is cancelled (e.g., by the user pressing the browser's "Stop" button, or another navigation starting and thus cancelling the ongoing one).

Value

An {{domxref("AbortSignal")}} object.

Examples

The general idea here is that the signal property can be passed to an associated {{domxref("Window/fetch", "fetch()")}} operation so that if the navigation is cancelled, the fetch() operation can be safely aborted, avoiding wasting bandwidth on fetches that are no longer needed.

js
navigation.addEventListener("navigate", (event) => {
  event.intercept({
    async handler() {
      // …

      await fetch(`/img/some-image.jpg`, { signal: event.signal });

      // …
    },
  });
});

[!NOTE] See Example: next/previous buttons for a more detailed example.

Specifications

{{Specifications}}

Browser compatibility

{{Compat}}

See also