Docs
API Documentation
Instantsearch Client API

Installation

It is available as @searchkit/instantsearch-client on npm.

npm install @searchkit/instantsearch-client@latest
# or
yarn add @searchkit/instantsearch-client@latest

Then import it in your project:

import Client from "@searchkit/instantsearch-client";

Usage

Below is a simple example of how to use the client to use React Instantsearch with Instantsearch Elasticsearch adapter.

Node API route has been setup under /api/search and the client is used to fetch the results from the API.

const searchClient = Client({
  // the url of your instantsearch-elasticsearch-adapter API endpoint
  url: "/api/search",
});
 
export default function Web() {
  return (
    <div className="ais-InstantSearch">
      <InstantSearch indexName="imdb_movies" searchClient={searchClient}>
        <SearchBox />
        <Hits />
      </InstantSearch>
    </div>
  );
}

Headers

You can pass headers to the client to be sent with each request.

const searchClient = Client({
  url: "/api/search",
  headers: {
    "x-api-key": "my-api-key",
  },
});

or you can pass a function that returns headers.

const searchClient = Client({
  url: "/api/search",
  headers: () => ({
    auth: "Bearer" + window.localStorage.getItem("token"),
  }),
});

Use Elasticsearch Directly

You can also use the client to directly query Elasticsearch from the browser, skipping needing a node API in the middle. This is useful if you're proxying the Elasticsearch API through your own application API.

Working demo available.

 
import Client from '@searchkit/instantsearch-client'
import Searchkit, { SearchkitConfig } from "searchkit"
import { config } from "./api/config"
 
const searchkitClient = new Searchkit({
  connection: {
    host: "http://localhost:9200"
  },
  search_settings: {
    // ... see Searchkit API docs for configuration options
  }
})
 
const searchClient = Client(searchkitClient);