Guides / Building Search UI / UI & UX patterns

Redirects in InstantSearch iOS

As of May 1st, 2024, Apple requires all iOS apps to include a privacy manifest. Ensure you incorporate our provided privacy manifest files into your documentation. For more details, see Privacy Manifest.

Redirects can enhance the search experience. For example:

  • Searching for “help” redirects users to a support page
  • Searching for a category, such as, “TV” redirects users to a category page
  • Searching for a specific product or brand redirects users to a seasonal promotional page for it
  • Searching for specific keywords related to an ongoing event, such as, “masks”, redirects users to a more specific landing page

This guide explains how to add redirects to InstantSearch through Rules and using custom data.

Redirects are handled by Autocomplete’s redirect plugin. However, if you don’t use Autocomplete, you must handle redirects in InstantSearch:

Handle a Visual Editor rule redirect

Configure the redirect with a custom widget

If a redirect was created in the Visual Editor, the API response contains the renderingContent.redirect property which, in turn, contains the redirect URL. To access this property from InstantSearch, you must create a custom widget.

Custom widgets have lifecycle hooks for each of the widget stages: init, render, and dispose. The render stage runs when Algolia sends results: in other words, when a user types something.

Use it as follows:

1
2
3
4
5
6
7
8
9
10
11
12
13
search.addWidgets([
  {
    render({ results }) {
      if (
        results &&
        results.renderingContent &&
        results.renderingContent.redirect
      ) {
        window.location.href = results.renderingContent.redirect.url;
      }
    },
  }
]);

Handle a Manual Editor rule redirect

If a redirect was created in the Manual Editor, handle it with InstantSearch’s QueryRuleCustomData widget.

Configure a rule

To set up a rule that returns custom data whenever the query matches specific keywords, see Create a rule for returning custom data.

Configure the queryRuleCustomData widget

After setting up a rule that returns the custom redirect data, you can use the QueryRuleCustomData widget to update the page location when userData contains a redirect.

1
2
3
4
5
6
7
8
9
10
11
let searcher = HitsSearcher(appID: "YourApplicationID",
                          apiKey: "YourSearchOnlyAPIKey",
                          indexName: "YourIndexName")
    
let queryRuleCustomDataConnector = QueryRuleCustomDataConnector<Redirect>(searcher: searcher)

queryRuleCustomDataConnector.interactor.onItemChanged.subscribe(with: self) { (_, redirect) in
  if let redirectURL = redirect?.url {
    // perform redirect with URL
  }
}