第一方 JavaScript 客户端,用于使用 Elastic App Search 构建出色的相关搜索体验。
安装此客户端的最简单方法是简单地包含来自 jsDelivr CDN 的构建发行版。
< 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 实现的主要版本中使用此库的最新版本。
例如,对于 App Search 7.3
,请使用此库的7.3
或更高版本,但不要使用8.0
。
如果您使用的是 swiftype.com 上提供的 App Search SaaS 版本,则应使用客户端的 7.5.x 版本。
该客户端与所有现代浏览器兼容。
请注意,该库依赖于 Fetch API。
Internet Explorer 不支持此功能。如果您需要 Internet Explorer 的向后兼容性,则需要使用 https://github.com/github/fetch 之类的内容填充 Fetch API。
使用此客户端假定您已经启动并运行了一个 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-
为前缀的只读密钥。更多信息可以在文档中找到。
使用 App Search 的 swiftype.com 上提供的 SaaS 版本时,您可以使用hostIdentifier
而不是endpointBase
参数来配置客户端。 hostIdentifier
可以在“凭据”菜单中找到。
var client = ElasticAppSearch . createClient ( {
hostIdentifier : "host-c5s2mj" ,
searchKey : "search-mu75psc5egt9ppzuycnc2mc3" ,
engineName : "favorite-videos"
} ) ;
选项 | 必需的 | 描述 |
---|---|---|
主机标识符 | 不 | 您的主机标识符应以host- 开头。除非显式设置endpointBase 否则必需 |
搜索关键字 | 不 | 您的公共搜索关键字。它应该以search- 开头。注意:这在技术上不是必需的,但在 99% 的情况下应该提供。有一个小边缘情况不提供此功能,主要对内部 App Search 使用有用,可以忽略此功能,以便利用 App Search 基于会话的身份验证。 |
发动机名称 | 是的 | |
端点库 | 不 | 完全覆盖 App Search API 端点的基础。在代理 App Search API、针对本地服务器进行开发或者自我管理或云部署时非常有用。前任。 “http://localhost:3002” |
缓存响应 | 不 | 是否应缓存 API 响应。默认值: true 。 |
附加标头 | 不 | 具有键和值的对象,将在所有 API 请求上转换为标头名称和值 |
该客户端是 Elastic App Search API 的瘦接口。有关请求和响应的其他详细信息可以在文档中找到。
对于查询项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。
除了上面支持的选项外,我们还支持以下字段:
姓名 | 类型 | 描述 |
---|---|---|
析取面 | 数组[字符串] | 字段名称的数组。此处列出的每个字段还必须作为facet 字段中的构面提供。它表示一个方面应被视为析取的。当返回析取方面的计数时,即使应用了过滤器,也会返回计数,就好像没有在此字段上应用过滤器一样。 |
disjunctiveFacetsAnalytics标签 | 数组[字符串] | 与disjunctiveFacets 参数结合使用。除非此处指定,否则查询将在分析仪表板中标记为“仅方面”。 |
回复
search 方法返回包装在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 >
该项目中的规范使用节点重放来捕获响应。
然后根据 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 社区讨论论坛。
我们欢迎对该项目的贡献者。在开始之前,请注意以下几点...
Apache 2.0 © 弹性
感谢所有贡献者!