UI libraries / React InstantSearch Hooks / Widgets

getServerState()

Signature 
const serverState = await getServerState(children: ReactNode, {
  renderToString?: (node: ReactElement) => unknown,
})
Import
Copy 
1

import { getServerState } from 'react-instantsearch-hooks-server';
See code examples

About this function

getServerState() is the function that retrieves the server state to pass to <InstantSearchSSRProvider>.

This function is available from the companion react-instantsearch-hooks-server package.

Guide Server-side rendering with React InstantSearch Hooks

Examples

Copy 
1
2
3

import { getServerState } from 'react-instantsearch-hooks-server';

const serverState = await getServerState(<App />);

Check the server-side rendering example for full markup.

Parameters

children
type: React.ReactNode

The part of the app that renders <InstantSearch>. As an optimization you can pass a minimal version of the application that only uses the hooks of the widgets used in the search, with the same options.
Copy 
1

const serverState = await getServerState(<App />);
renderToString
type: (node: React.ReactElement) => unknown

The react method used to render the app. This can be renderToString from react-dom/server or an alternative method.
Copy 
1
2
3
4
5

import { renderToString } from 'react-dom/server';

const serverState = await getServerState(<App />, {
  renderToString,
});

Returns
Promise

serverState
type: InstantSearchServerState

The server state to pass to <InstantSearchSSRProvider>.
Copy 
1
2
3
4
5
6
7
8
9
10

type InitialResult = {
  state: SearchParameters;
  results: SearchResults;
};

type InitialResults = Record<string, InitialResult>;

type InstantSearchServerState = {
  initialResults: InitialResults;
};
Did you find this page helpful?
React InstantSearch Hooks v6