How to connect to Elastic App Cloud with API endpoint?

The documentation and demos use hostIdentifier to connect, but Elastic App only has an API Endpoint under Credentials. There is no Host Identifier.

When I take one of the demos, such as the Vue demo (using Hearthstone cards) and change the connector to connect to my Elastic App (with Heartstone data) using: searchKey, engineName, and endpointBase (with the API endpoint below), nothing is returned.

I am scratching my head over this. How do I connect to the cloud App search? I am using Nuxt (Vue). Thanks a lot!

Hi @Ryan_Lane, thanks for using Elastic App Search!

Valid question. I wasn't familiar with the Vue demo using Hearthstone cards, but looking it up, I see the host_identifier you were mentioning here: vue-search-ui-demo/searchConfig.js at master · elastic/vue-search-ui-demo · GitHub

You wouldn't have any way to know this, but just from looking, I can tell that this demo was built for an old version of App Search. The App Search that you have deployed in Elastic Cloud doesn't have a host_identifier, but instead an endpoint (as you noticed).

While there's not an updated hearthstone demo with modern App Search, there is the Search UI repo that can help you set up a similar search experience (you'll have to have your data already indexed in App Search though). I recently followed those instructions to make a very basic search experience for my own personal use, if you want to see an example. Notice that in this updated approach, your configuration includes an endpointBase, instead of a hostIdentifier:

Let me know if that helps!

@Ryan_Lane a follow-up - you said:

The documentation [...] use hostIdentifier to connect

Just want to make sure - you should be using for your App Search documentation. Not - which as I mentioned above, is "legacy" and does not apply to App Search deployments launched from Elastic Cloud.

Hi Sean - Thanks a lot! I just tried using your example and when I ran it locally using npm start, I got "An unexpected error occurred: Failed to fetch."

Hi @Ryan_Lane ,

Oof, looks like I made at least two mistakes. :frowning:

  1. I pointed you to the Search UI repo, but I meant to point you towards the Reference UI repo. That is the easy way to get spun up with a sample UI.
  2. My example repo that I pointed you to was pointing to an old deployment of App Search that has since been decommissioned :man_facepalming: . I just updated its configuration to point at the current deployment. Can you git pull origin main and then try npm start again?

Sorry about that. Totally my bad. :sweat_smile:

No problem. Thanks a lot @Sean_Story !! Very much appreciate all of your help! :grinning: Have a great day!