Собственный клиент JavaScript для создания отличных и релевантных возможностей поиска с помощью Elastic App Search.
Самый простой способ установить этот клиент — просто включить встроенный дистрибутив из CDN jsDelivr.
< script src =" https://cdn.jsdelivr.net/npm/@elastic/[email protected]/dist/elastic_app_search.umd.js " > </ script >
Это сделает клиент доступным по всему миру по адресу:
window . ElasticAppSearch ;
Этот пакет также можно установить с помощью npm
или yarn
.
npm install --save @elastic/app-search-javascript
Затем клиент может быть включен в ваш проект следующим образом:
// CommonJS
var ElasticAppSearch = require ( "@elastic/app-search-javascript" ) ;
// ES
import * as ElasticAppSearch from "@elastic/app-search-javascript" ;
Этот клиент разрабатывается и выпускается вместе с App Search.
Чтобы гарантировать совместимость, используйте самую последнюю версию этой библиотеки в основной версии соответствующей реализации поиска приложений.
Например, для App Search 7.3
используйте 7.3
этой библиотеки или более позднюю, но не 8.0
.
Если вы используете версию SaaS, доступную на сайте Swiftype.com для поиска приложений, вам следует использовать версию клиента 7.5.x.
Клиент совместим со всеми современными браузерами.
Обратите внимание, что эта библиотека зависит от Fetch API.
Это не поддерживается Internet Explorer. Если вам нужна обратная совместимость для Internet Explorer, вам нужно заполнить Fetch API чем-то вроде https://github.com/github/fetch.
Использование этого клиента предполагает, что у вас уже есть запущенный экземпляр Elastic App Search.
Клиент настраивается с использованием параметров searchKey
, endpointBase
и engineName
.
var client = ElasticAppSearch . createClient ( {
searchKey : "search-mu75psc5egt9ppzuycnc2mc3" ,
endpointBase : "http://127.0.0.1:3002" ,
engineName : "favorite-videos"
} ) ;
* Обратите внимание, что общедоступный ключ поиска следует использовать только в коде Javascript в браузере. По умолчанию ваша учетная запись должна иметь ключ с префиксом search-
, который доступен только для чтения. Более подробную информацию можно найти в документации.
При использовании версии SaaS, доступной на сайте Swiftype.com для поиска приложений, вы можете настроить клиент, используя свой hostIdentifier
вместо параметра endpointBase
. hostIdentifier
можно найти в меню «Учетные данные».
var client = ElasticAppSearch . createClient ( {
hostIdentifier : "host-c5s2mj" ,
searchKey : "search-mu75psc5egt9ppzuycnc2mc3" ,
engineName : "favorite-videos"
} ) ;
Вариант | Необходимый | Описание |
---|---|---|
идентификатор хоста | Нет | Ваш идентификатор хоста должен начинаться с host- . Требуется, если не задано явно endpointBase |
ключ поиска | Нет | Ваш общедоступный ключ поиска . Он должен начинаться с search- .ПРИМЕЧАНИЕ. Технически это не требуется, но в 99% случаев это должно быть предусмотрено. Существует небольшой крайний случай, когда это не предусмотрено, в основном полезно для внутреннего использования поиска приложений, где это можно опустить, чтобы использовать аутентификацию на основе сеанса поиска приложений. |
Имя двигателя | Да | |
конечная точкаBase | Нет | Полностью переопределяет основу конечной точки API поиска приложений. Полезно при проксировании API поиска приложений, разработке на локальном сервере, а также при самостоятельном или облачном развертывании. Бывший. "http://локальный хост:3002" |
кэшОтветы | Нет | Следует ли кэшировать ответы API. По умолчанию: true . |
дополнительные заголовки | Нет | Объект с ключами и значениями, которые будут преобразованы в имена и значения заголовков во всех запросах API. |
Этот клиент представляет собой тонкий интерфейс к API Elastic App Search. Дополнительную информацию о запросах и ответах можно найти в документации.
Для термина запроса lion
поисковый вызов строится следующим образом:
var options = {
search_fields : { title : { } } ,
result_fields : { id : { raw : { } } , title : { raw : { } } }
} ;
client
. search ( "lion" , options )
. then ( resultList => {
resultList . results . forEach ( result => {
console . log ( `id: ${ result . getRaw ( "id" ) } raw: ${ result . getRaw ( "title" ) } ` ) ;
} ) ;
} )
. catch ( error => {
console . log ( `error: ${ error } ` ) ;
} ) ;
Обратите внимание, что options
поддерживают все параметры, перечисленные здесь: https://swiftype.com/documentation/app-search/guides/search.
Помимо поддерживаемых выше опций, мы также поддерживаем следующие поля:
Имя | Тип | Описание |
---|---|---|
дизъюнктивныйFacets | Массив[Строка] | Массив имен полей. Каждое поле, перечисленное здесь, также должно быть предоставлено как аспект в поле facet . Это означает, что фасет следует считать дизъюнктивным. При возврате счетчиков для дизъюнктивных фасетов счетчики будут возвращены так, как если бы к этому полю не применялся фильтр, даже если он был применен. |
дизъюнктивныйFacetsAnalyticsTags | Массив[Строка] | Используется вместе с параметром disjunctiveFacets . Запросы будут помечены тегом «Только аспекты» на панели аналитики, если здесь не указано иное. |
Ответ
Метод поиска возвращает ответ, завернутый в тип ResultList
:
ResultList {
rawResults : [ ] , // List of raw `results` from JSON response
rawInfo : { // Object wrapping the raw `meta` property from JSON response
meta : { }
} ,
results : [ ResultItem ] , // List of `results` wrapped in `ResultItem` type
info : { // Currently the same as `rawInfo`
meta : { }
}
}
ResultItem {
getRaw ( fieldName ) , // Returns the HTML-unsafe raw value for a field, if it exists
getSnippet ( fieldName ) // Returns the HTML-safe snippet value for a field, if it exists
}
var options = {
size : 3 ,
types : {
documents : {
fields : [ "name" ]
}
}
} ;
client
. querySuggestion ( "cat" , options )
. then ( response => {
response . results . documents . forEach ( document => {
console . log ( document . suggestion ) ;
} ) ;
} )
. catch ( error => {
console . log ( `error: ${ error } ` ) ;
} ) ;
Используя метод multiSearch
можно одновременно выполнить несколько запросов.
Для поиска термина lion
и tiger
поисковый вызов строится следующим образом:
var options = {
search_fields : { name : { } } ,
result_fields : { id : { raw : { } } , title : { raw : { } } }
} ;
client
. multiSearch ( [ { query : "node" , options } , { query : "java" , options } ] )
. then ( allResults => {
allResults . forEach ( resultList => {
resultList . results . forEach ( result => {
console . log (
`id: ${ result . getRaw ( "id" ) } raw: ${ result . getRaw ( "title" ) } `
) ;
} ) ;
} ) ;
} )
. catch ( error => {
console . log ( `error: ${ error } ` ) ;
} ) ;
client
. click ( {
query : "lion" ,
documentId : "1234567" ,
requestId : "8b55561954484f13d872728f849ffd22" ,
tags : [ "Animal" ]
} )
. catch ( error => {
console . log ( `error: ${ error } ` ) ;
} ) ;
Переходы по ссылкам можно отслеживать путем привязки вызовов client.click
к событиям кликов по отдельным ссылкам на результаты поиска.
В следующем примере показано, как это можно реализовать декларативно, аннотируя ссылки атрибутами класса и данных.
document . addEventListener ( "click" , function ( e ) {
const el = e . target ;
if ( ! el . classList . contains ( "track-click" ) ) return ;
client . click ( {
query : el . getAttribute ( "data-query" ) ,
documentId : el . getAttribute ( "data-document-id" ) ,
requestId : el . getAttribute ( "data-request-id" ) ,
tags : [ el . getAttribute ( "data-tag" ) ]
} ) ;
} ) ;
< a
href =" /items/1234567 "
class =" track-click "
data-request-id =" 8b55561954484f13d872728f849ffd22 "
data-document-id =" 1234567 "
data-query =" lion "
data-tag =" Animal "
>
Item 1
</ a >
В спецификациях этого проекта используется node-replay для сбора ответов.
Затем ответы проверяются по снимкам Jest.
Чтобы получить новые ответы и обновить снимки, запустите:
nvm use
REPLAY=record npm run test -u
Чтобы запустить тесты:
nvm use
npm run test
Вероятно, вам захочется установить менеджер версий узлов, например nvm.
Мы зависим от версии узла, определенной в .nvmrc.
Чтобы установить и использовать правильную версию узла с nvm:
nvm install
Установите зависимости:
nvm use
npm install
Создайте артефакты в каталоге dist
:
# This will create files in the `dist` directory
npm run build
Добавьте файл index.html
в каталог dist
.
< html >
< head >
< script src =" elastic_app_search.umd.js " > </ script >
</ head >
< body >
</ body >
</ html >
Запустите сервер разработки:
# This will serve files in the `dist` directory
npm run dev
Перейдите по адресу http://127.0.0.1:8080 и выполните команды JavaScript через консоль разработчика браузера.
nvm use
npm run build
nvm use
npm run publish
В App Search есть собственный клиент Node.js, который поддерживает операции записи, такие как индексирование.
Если что-то не работает должным образом, пожалуйста, откройте проблему.
Лучше всего прочитать документацию.
Вы можете посетить форумы обсуждения сообщества Elastic App Search.
Мы приветствуем участников проекта. Прежде чем начать, пара замечаний...
Апач 2.0 © Elastic
Спасибо всем участникам!