signalizejs/ajax

A wrapper around the native JavaScript fetch API.

What it Does:

  • Improves error handling.
  • By default, sets the method to POST if a body argument is provided and no method is specified.
  • If the body argument is passed and is not a string, number, or FormData, it automatically converts it using JSON.stringify() and sets the Content-Type header to application/json.
  • Adds the X-Requested-With header to the request, allowing you to detect AJAX requests on the server side.

Installation

Required import map dependencies:
const { ajax } = await signalize.resolve('ajax');

Usage

const {
  // Fetch response
  response,
  // Error information (null if no error)
  error,
} = await ajax(url, options);

if (error === null) {
  const json = response.json();
  // Do something with the data...
}

// Dispatched Events

You can listen to the following events using the on function (see the /docs/modules/event#on documentation):

  • ajax:request:start: Dispatched when the request starts.
  • ajax:request:success: Dispatched when the request completes successfully (no error).
  • ajax:request:error: Dispatched when the request encounters an error.
  • ajax:request:end: Dispatched when the request finishes (regardless of success or error).

Request Headers

  • X-Current-Url - The current url in the browser.
  • X-Requested-With - By default, the header is set to XMLHttpRequest. This allows the server to detect if the request was made through AJAX..