Making http requests

The expFetch method is part of the Http class in the experro-storefront module. It provides an easy way to make HTTP requests with support for SSR (Server-Side Rendering) and customizable headers, request bodies, and methods.

Method Signature

async expFetch({
  key,
  url,
  enableSSR,
  headers,
  body,
  method,
}: ExpHttpRequest): Promise<any>;

Parameters

The method accepts an object of type ExpHttpRequest with the following fields:

Parameter	Type	Description	Required
`key`	`string`	A unique identifier for the request. This is required when enabling SSR (Server-Side Rendering). Ensures correct tracking.	Optional (Required for SSR)
`url`	`string`	The URL of the endpoint you are making the request to.	Required
`enableSSR`	`boolean`	A flag to enable SSR. Set this to `true` to enable SSR functionality.	Optional
`headers`	`object`	The headers to be sent with the request. If not provided, default headers `{ 'content-type': 'application/json' }` will be used.	Optional
`body`	`object`	The request body, used only for methods like `POST`, `PUT`, `PATCH`, and `DELETE`. Not required for `GET` requests.	Optional
`method`	`GET`, `POST`, `PUT`, `DELETE`, `PATCH“	The HTTP method to be used for the request. This is a required field.	Required

Default Headers

If no headers are provided, the following default headers will be used:

{
  "content-type": "application/json"
}

Response

The method returns a Promise that resolves to the response data from the HTTP request.

Usage Examples

Example 1: Basic GET Request

This example demonstrates how to make a simple GET request without enabling SSR.

import { Http } from 'experro-storefront';

const data = await Http.expFetch({
  url: 'https://example.com/api/data',
  method: 'GET',
});

console.log(data);

Example 2: POST Request with Body and SSR Enabled

In this example, we make a POST request with a request body and enable SSR by setting the enableSSR flag to true. The key must be unique to properly enable SSR.

import { Http } from 'experro-storefront';

const data = await Http.expFetch({
  key: 'unique_key_123',  // Unique key for SSR tracking
  url: 'https://example.com/api/submit',
  enableSSR: true,  // Enable SSR
  headers: { 'content-type': 'application/json' },
  body: { name: 'John', age: 30 },
  method: 'POST',
});

console.log(data);

SSR and key

The key is crucial when enabling SSR. It must be unique to ensure that the request is tracked and handled correctly on the server side. You cannot reuse the same key for different requests when SSR is enabled.

Default Headers

If no custom headers are provided, the request will use the default header { 'content-type': 'application/json' }

Request Body

The body parameter is optional and should only be included for methods like POST, PUT, PATCH, or DELETE.

The expFetch method is a flexible and efficient way to make HTTP requests, with support for SSR, custom headers, and various HTTP methods. By providing an easy-to-use interface, it simplifies API calls in your application, allowing you to focus on the core logic while handling request details seamlessly.

Getting Started

Overview

Theme Components

Create Custom Widget

Theme Templates

Experro CLI

Other

Making http requests

Method Signature

Parameters

Default Headers

Response

Usage Examples

Example 1: Basic GET Request

Example 2: POST Request with Body and SSR Enabled

SSR and key

Default Headers

Request Body

​Method Signature

​Parameters

​Default Headers

​Response

​Usage Examples

​Example 1: Basic GET Request

​Example 2: POST Request with Body and SSR Enabled

​SSR and key

​Default Headers

​Request Body

Method Signature

Parameters

Default Headers

Response

Usage Examples

Example 1: Basic GET Request

Example 2: POST Request with Body and SSR Enabled

SSR and key

Default Headers

Request Body