Searchkit ist eine Open-Source-Bibliothek, die Ihnen dabei hilft, mit Elasticsearch ein großartiges Sucherlebnis zu schaffen. Funktioniert mit Javascript, React, Vue, Angular und mehr.
Website | Demos | Dokumentation | Zwietracht
Searchkit bietet eine Suchoberfläche für Elasticsearch oder Opensearch. Mit Searchkit können Sie Instantsearch-Komponenten wie Searchbox, Verfeinerungsfilter und Ergebnisse (und viele mehr!) verwenden, um ein Sucherlebnis zu schaffen.
Searchkit eignet sich hervorragend für alle, die schnell ein Sucherlebnis aufbauen möchten.
Searchkit vereinfacht die Suchoberfläche mit Elasticsearch:
Searchkit Bot hilft Ihnen, dieses Repository besser zu verstehen. Sie können Codebeispiele, Installationsanleitungen, Debugging-Hilfe und vieles mehr anfordern.
Weitere Beispiele finden Sie in unserer Dokumentation.
Entweder über npm oder Yarn installieren
npm install searchkit @searchkit/api @searchkit/instantsearch-client
oder über CDN
< script src =" https://cdn.jsdelivr.net/npm/@searchkit/instantsearch-client@latest " > </ script >
< script src =" https://cdn.jsdelivr.net/npm/instantsearch.js@4 " > </ script >
< script src =" https://cdn.jsdelivr.net/npm/searchkit@latest " > </ script >
Searchkit erfordert Elasticsearch 7.0 oder höher oder Opensearch 2.4 oder höher.
Im Folgenden verwenden wir Docker, um Elasticsearch auszuführen.
docker pull docker.elastic.co/elasticsearch/elasticsearch:8.6.2
docker network create elastic
docker run --name elasticsearch --net elastic -p 9200:9200 -p 9300:9300 -e " discovery.type=single-node " -e " xpack.security.enabled=false " -e http.cors.enabled=true -e " http.cors.allow-origin='*' " -e http.cors.allow-headers=X-Requested-With,X-Auth-Token,Content-Type,Content-Length,Authorization -e http.cors.allow-credentials=true -e network.publish_host=localhost -e xpack.security.enabled=false docker.elastic.co/elasticsearch/elasticsearch:8.6.2
Dann fügen wir einen Index und einige Daten hinzu
curl --location --request PUT ' http://localhost:9200/products '
--header ' Content-Type: application/json '
--data-raw ' {
"mappings": {
"properties": {
"name": {
"type": "text"
},
"description": {
"type": "text"
},
"price": {
"type": "integer"
},
"categories": {
"type": "text",
"fields": {
"keyword": {
"type": "keyword"
}
}
}
}
}
} '
curl --location --request POST ' http://localhost:9200/products/_doc '
--header ' Content-Type: application/json '
--data-raw ' {
"name": "Apple iPhone 12 Pro Max",
"description": "The iPhone 12 Pro Max is the most powerful iPhone ever. It has a 6.7-inch Super Retina XDR display, a Ceramic Shield front cover, and a triple-camera system with a LiDAR scanner. It also has a 5G connection, a 6-core CPU, and a 4-core GPU. The iPhone 12 Pro Max is available in 128GB, 256GB, and 512GB storage options.",
"categories": ["phones", "apple"],
"price": 800
} '
curl --location --request POST ' http://localhost:9200/products/_doc '
--header ' Content-Type: application/json '
--data-raw ' {
"name": "Apple iPhone 12 Pro",
"description": "The iPhone 12 Pro is the most powerful iPhone ever. It has a 6.1-inch Super Retina XDR display, a Ceramic Shield front cover, and a triple-camera system with a LiDAR scanner. It also has a 5G connection, a 6-core CPU, and a 4-core GPU. The iPhone 12 Pro is available in 128GB, 256GB, and 512GB storage options.",
"categories": ["phones", "apple"],
"price": 700
} '
Searchkit ist mit allen Instantsearch-Frameworks kompatibel. Unten finden Sie ein Beispiel für die Verwendung von React-Instantsearch.
import Searchkit from "searchkit"
import Client from '@searchkit/instantsearch-client'
// import your InstantSearch components
import { InstantSearch , SearchBox , Hits , RefinementList , Pagination , RangeInput } from 'react-instantsearch' ;
const sk = new Searchkit ( {
connection : {
host : 'http://localhost:9200' ,
// with an apiKey
// https://www.searchkit.co/docs/guides/setup-elasticsearch#connecting-with-api-key
// apiKey: '##########'
// with a username/password
// https://www.searchkit.co/docs/guides/setup-elasticsearch#connecting-with-usernamepassword
//auth: {
// username: "elastic",
// password: "changeme"
//}
} ,
search_settings : {
search_attributes : [ { field : 'title' , weight : 3 } , 'actors' , 'plot' ] ,
result_attributes : [ 'title' , 'actors' , 'poster' , 'plot' ] ,
highlight_attributes : [ 'title' ] ,
facet_attributes : [
{ attribute : 'actors' , field : 'actors.keyword' , type : 'string' } ,
{ attribute : 'imdbrating' , type : 'numeric' , field : 'imdbrating' }
]
}
} )
const searchClient = Client ( sk ) ;
const App = ( ) => (
< InstantSearch
indexName = "imdb_movies"
searchClient = { searchClient }
>
< SearchBox / >
< div className = "left-panel" >
< RefinementList attribute = "actors" searchable = { true } limit = { 10 } / >
< RangeInput attribute = "imdbrating" / >
< / div >
< div className = "right-panel" >
< Hits / >
< Pagination / >
< / div >
< / InstantSearch >
}
Folgen Sie der Anleitung „Erste Schritte“.
Mit der Searchkit Node API können Sie Anfragen vom Browser aus an Elasticsearch weiterleiten. Dies ist nützlich, wenn Sie Elasticsearch aus dem Browser ausblenden oder der Abfrage Benutzerberechtigungsfilter hinzufügen möchten.
Searchkit verfügt über einen sofort einsatzbereiten Abfrage-Builder, Sie können die Abfrage jedoch auch anpassen, indem Sie eine getQuery-Funktion an den apiClient übergeben.
const results = await apiClient . handleRequest ( req . body , {
getQuery : ( query , search_attributes ) => {
return [
{
combined_fields : {
query ,
fields : search_attributes ,
} ,
} ,
] ;
} ,
} ) ;
Searchkit unterstützt die KNN-Abfragesuche. Unten finden Sie ein Beispiel für eine KNN-Abfragesuche.
const results = await client . handleRequest ( req . body , {
getKnnQuery ( query , search_attributes , config ) {
return {
field : 'dense-vector-field' ,
k : 10 ,
num_candidates : 100 ,
// supported in latest version of Elasticsearch
query_vector_builder : {
text_embedding : {
model_id : 'cookie_model' ,
model_text : query
}
}
}
}
} ) ;
Folgen Sie dem Tutorial zur semantischen Suche.
Sie können auch die gesamte Abfrage mit Anforderungs-Hooks überschreiben. Unten sehen Sie ein Beispiel für einen Anfrage-Hook, der der ersten Suchanfrage eine Rescore-Abfrage hinzufügt.
Sie können dies bei beforeSearch
und afterSearch
anwenden.
const results = await client . handleRequest ( req . body , {
hooks : {
beforeSearch : ( searchRequests ) => {
const uiRequest = searchRequests [ 0 ]
return [
{
... uiRequest ,
body : {
... uiRequest . body ,
rescore : {
window_size : 100 ,
query : {
rescore_query : {
match : {
plot : {
query : uiRequest . body . query ,
operator : "and" ,
} ,
} ,
} ,
query_weight : 1 ,
rescore_query_weight : 10 ,
}
}
}
} ,
searchRequests . slice ( 1 , searchRequests . length )
]
} ,
}
} ) ;
Lesen Sie hier mehr in den API-Dokumenten.
Mit Abfrageregeln können Sie das Verhalten des Sucherlebnisses anpassen. Sie können Abfrageregeln verwenden, um Ergebnisse zu verstärken oder zu filtern oder um die Rangfolge der Ergebnisse basierend auf einer Reihe von Bedingungen zu ändern.
Unten sehen Sie ein Beispiel für eine Abfrageregel, die die Ergebnisse für Filme mit Dan Aykroyd oder Charlie Sheen verbessert und die Ergebnisse so filtert, dass nur Filme angezeigt werden, wenn die Abfrage das Wort „Film“ enthält.
{
id : '1' ,
conditions : [
[
{
context : 'query' ,
value : 'movie' ,
match_type : 'exact'
}
]
] ,
actions : [
{
action : 'QueryBoost' ,
query : 'actors:"Dan Aykroyd" OR actors:"Charlie Sheen"' ,
weight : 2
} ,
{
action : 'QueryFilter' ,
query : 'type:"movie"'
}
]
}
Weitere Informationen finden Sie in der Dokumentation zu Abfrageregeln.
F: Muss ich Elasticsearch dem öffentlichen Internet zugänglich machen?
Searchkit leitet Anfragen an Elasticsearch weiter.
Searchkit bietet beide Optionen: Führen Sie die Suche entweder direkt über den Browser aus oder verwenden Sie die Searchkit-API, um Anfragen an Elasticsearch weiterzuleiten. Direkt über den Browser bietet es großartige Entwicklererfahrung und Prototyping. Sobald Sie zur Bereitstellung bereit sind, können Sie die Searchkit-API verwenden, um Anfragen an Elasticsearch weiterzuleiten.
F: Muss ich React verwenden?
Sie können React, React Native, Vue, Angular verwenden. Sie müssen nicht einmal ein Frontend-Framework verwenden, sondern können einfaches Javascript und HTML mit den Widgets von „instantsearch.js“ verwenden.
F: Welche Version von Elasticsearch wird unterstützt?
Searchkit ist kompatibel mit Elasticsearch 7.0 und höher + Opensearch 2.0 und höher.
F: Unterstützen Sie Android und iOS?
Potenziell. Die Searchkit-API ahmt die Algolia-API nach, sodass es mit ein paar Optimierungen möglich sein sollte, den Algolia Instantsearch-Client mit der Searchkit-API zu verwenden. Wenn Sie daran Interesse haben, teilen Sie uns dies bitte mit.
F: Warum sollte ich Searchkit anstelle von Algolia verwenden?
Elasticsearch hat viele Vorteile gegenüber Algolia. Möglicherweise möchten Sie Elasticsearch als günstigere Alternative zu Algolia verwenden, insbesondere wenn Sie über einen großen Datensatz verfügen. Möglicherweise möchten Sie Elasticsearch auf Ihrer eigenen Infrastruktur ausführen oder eine bessere Kontrolle über die Abfragerelevanz haben.