JsSearch Visualforce Component

The Coveo for Salesforce package comes with a Visualforce component that imports all the required dependencies for the Coveo JavaScript Search Framework. It also preconfigures the search endpoint with search tokens.

Usage

Reference it in your Visualforce page as you would for any other Apex component, using the namespace prefix of the Coveo package.

<CoveoV2:JsSearch />

Resources Included With This Component

This component includes the following resources in the header of your page:

  • The JavaScript Search Framework dependencies (e.g., CoveoJsSearch.Dependencies.js).

    This can be either the minified or debug version, depending on the options set on the Apex component.

  • The JavaScript Search Framework scripts themselves (e.g., CoveoJsSearch.js) containing the code for all of the components.

    This can be either the minified or debug version, depending on the options set on the Apex component.

  • The default result templates included in the product.

  • Language detection relies on the current user language set in Salesforce, not on the user browser language, but you can change the language, if needed (see Changing the Language of Your Search Interface).

  • The CSS for the different components.

JavaScript Code Included and Executed With This Component

  • The Search Endpoint is created with the right URL and options. The Search Endpoint also includes the search token that the current user needs to perform secure query on the Coveo Platform.

    The search token is generated server-side, as described in the Search Token Authentication page. The process is done in Apex code, which is included in the package when the page is first loaded.

    The token is included with each query to correctly identify the user on the Coveo Platform.

  • Since search tokens expire after a certain delay for security reasons, a user that would have the same search page open for a long time would be unable to perform queries. As such, this component includes the needed JavaScript code to renew this token on demand when it expires.

Options

These options are set directly on the Apex component.

stylesheet

The default value is CoveoFullSearch.css.

This option provides a way to change the stylesheet used for the Search Page.

<CoveoV2:JsSearch stylesheet="<MY_STYLESHEET>" />

Where you can replace <MY_STYLESHEET> by the stylesheet you want to use for your Search Page.

filter

This option is empty by default.

This adds a query expression (or filter) inside the search token generated for the current page. This filter is executed on every query.

Since it’s included in the cryptographically signed JWT token, client code can’t tamper with this.

<CoveoV2:JsSearch filter="<MY_FILTER>" />

Where you can replace <MY_FILTER> with the filter you want to add to the search token generated for the current page (e.g., @sfkbid).

searchHub

This option is empty by default.

The name of the search hub to be sent to Coveo Usage Analytics (Coveo UA).

Since it’s included in the cryptographically signed JWT token, client code can’t tamper with this.

<CoveoV2:JsSearch searchHub="<MY_SEARCH_HUB>" />

Where you replace <MY_SEARCH_HUB> by the name of the search hub when reporting events to Coveo Usage Analytics (Coveo UA).

If you read the documentation about the Analytics Component), you’ll realize that it’s also possible to set the searchHub using the option on the component itself. However, we recommend that you set the searchHub on the JsSearch Visualforce component.

  • If you use the data-search-hub property on the Analytics Component, then the search hub attribute will be passed in the content of the request, as the originLevel1 property.

  • If you use the searchHub option in the Apex component, then the search hub attribute is passed in the header of the request, in the JWT search token.

Having a conflicting search hub in the body of the request and the search token results in the analytics event being rejected. The response from the service looks like this:

You are not authorized to insert events in search hub X since your token restricts you to Y.

catalog

The catalog option is exclusive to CloudCraze and Salesforce B2B interfaces (see Create a Visualforce Page for Your Salesforce B2B Commerce Storefront Search Page.

This option is empty by default.

This specifies the catalog ID that the JsSearch Visualforce Component must use.

<CoveoV2:JsSearch catalog="<MY_CATALOG_ID>" />

Where you can replace <MY_CATALOG_ID> with the ID of the catalog that you want your JsSearch Visualforce Component to use.

debug

The default value is false.

Setting this value to true causes the debug version of the JavaScript libraries to be used.

The debug versions aren’t minified.

In a production environment, we strongly recommend that you use the minified version for faster download times of the resources as well as marginally faster execution time.

For debugging purpose, you can enable this option to read the source code more easily.

<CoveoV2:JsSearch debug="false" />

userGroups

This is the list of user groups to append to the current user, separated by semicolons. Each of these user groups is added in the search token.

Since it’s included in the cryptographically signed JWT token, client-side code can’t tamper with this.

These user groups are used in Coveo UA as additional reporting dimensions.

<CoveoV2:JsSearch usersGroups="<GROUP1>;<GROUP2>;<GROUP3>" />

Where you can replace <GROUP1>, <GROUP2>, and <GROUP3> by respectively the name of the user groups to append to the current user. You can add as many user groups as you want.

additionalUserIdentities

List of user identities to append to the current user, separated by semicolons. Each of these identities are added in the search token and allow a given user to add other identities that this user should have.

<CoveoV2:JsSearch additionalUserIdentities="john@doe.com;jane@doe.com;name=doe\jane,provider=Active Directory,type=User" />

If you need to specify other security providers, you can specify them with param=value separated by commas where:

  • name is the identity name

  • provider is the security provider name. The default value is Email Security Provider.

  • type is user or group. The default value is User.

Since it’s included in the cryptographically signed JWT token, client code can’t tamper with this.

This could allow users not logged into Salesforce to be able to query as if they were another anonymous user and allow them to see public items.

This could also be used to map a Salesforce user to an Active Directory user, or any other system.

anonymousUser

Specifies the identity to use for non-logged in users.

<CoveoV2:JsSearch anonymousUser="<IDENTITY>" />

Where you replace <IDENTITY> with the identity you want to use for non-logged in users (e.g., anonymous@user.com).

customVersion

This option is empty by default.

This specifies the list of components that the JsSearch Visualforce Component must use.

<CoveoV2:JsSearch customVersion="<COMPONENT1>;<COMPONENT2>;<COMPONENT3>" />

Where you can replace <COMPONENT1>, <COMPONENT2>, and <COMPONENT3> by respectively the name of the components that the JsSearch Visualforce Component must use. You can add as many components as you want.

searchContext

<CoveoV2:JsSearch searchContext="{!context}" />

This allows you to create an additional context inside your search page (see Send Apex Context to a JavaScript Search Interface).

Recommended Articles