อะแดปเตอร์สำหรับใช้ไลบรารี Instantsearch.js ที่ยอดเยี่ยมกับ Typesense Search Server เพื่อสร้างอินเทอร์เฟซการค้นหาที่หลากหลาย
นี่คือตัวอย่างของ UI ที่คุณสามารถสร้างได้ด้วยอะแดปเตอร์นี้: songs-search.typesense.org
หมายเหตุ: หากอินเทอร์เฟซการค้นหาของคุณสร้างขึ้นจากส่วนประกอบเติมข้อความอัตโนมัติที่กำหนดเอง หรืออิงตาม @algolia/autocomplete-js คุณไม่จำเป็นต้องใช้อะแดปเตอร์นี้เพื่อใช้กับ Typesense เนื่องจากไลบรารี typesense-js รองรับการดึงข้อมูลจากฝั่งไคลเอ็นต์แล้ว ข้อมูลจากแหล่งข้อมูล async ใด ๆ อ่านเพิ่มเติมได้ที่นี่
ทีมงานดีๆ ที่ Algolia ได้สร้างและเปิด Instantsearch.js ที่เป็นโอเพ่นซอร์ส ซึ่งเป็นชุดของส่วนประกอบที่พร้อมใช้งานทันทีที่คุณสามารถใช้เพื่อสร้างประสบการณ์การค้นหาเชิงโต้ตอบได้อย่างรวดเร็ว
ด้วยอะแดปเตอร์ในพื้นที่เก็บข้อมูลนี้ คุณจะสามารถใช้ Instantsearch (และลูกพี่ลูกน้อง React, Vue และ Angular) กับข้อมูลที่จัดทำดัชนีในเซิร์ฟเวอร์การค้นหา Typesense
หากคุณไม่เคยใช้การค้นหาทันใจมาก่อน เราขอแนะนำให้อ่านคู่มือการเริ่มต้นใช้งานที่นี่ เมื่อคุณอ่านคำแนะนำแล้ว ให้ทำตามคำแนะนำด้านล่างเพื่อเสียบอะแดปเตอร์ Typesense เข้ากับ Instantsearch
คำแนะนำในการสร้างอินเทอร์เฟซการค้นหาอย่างรวดเร็วด้วย Typesense และ InstantSearch.js: https://typesense.org/docs/0.20.0/guide/search-ui-components.html
นี่คือแอปเริ่มต้นสาธิตที่แสดงวิธีใช้อะแดปเตอร์: https://github.com/typesense/typesense-instantsearch-demo
$ npm install --save typesense-instantsearch-adapter @babel/runtime
หรือ
$ yarn add typesense-instantsearch-adapter @babel/runtime
หรือคุณสามารถรวมอะแดปเตอร์โดยตรงผ่านแท็กสคริปต์ใน HTML ของคุณ:
< script src =" https://cdn.jsdelivr.net/npm/typesense-instantsearch-adapter@2/dist/typesense-instantsearch-adapter.min.js " > </ script >
<!-- You might want to pin the version of the adapter used if you don't want to always receive the latest minor version -->
เนื่องจากนี่คืออะแดปเตอร์ จึง จะไม่ติดตั้ง ไลบรารี Instantsearch ให้คุณโดยอัตโนมัติ คุณต้องติดตั้งสิ่งใดสิ่งหนึ่งต่อไปนี้ในแอปพลิเคชันของคุณโดยตรง:
คุณจะพบข้อมูลเกี่ยวกับวิธีการเริ่มต้นใช้งานห้องสมุดแต่ละแห่งข้างต้นได้ในที่เก็บที่เกี่ยวข้อง
เราขอแนะนำให้ลองใช้ create-instantsearch-app เพื่อสร้าง UI การค้นหาของคุณจากเทมเพลตเริ่มต้น
import instantsearch from "instantsearch.js" ;
import { searchBox , hits } from "instantsearch.js/es/widgets" ;
import TypesenseInstantSearchAdapter from "typesense-instantsearch-adapter" ;
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "abcd" , // Be sure to use an API key that only allows search operations
nodes : [
{
host : "localhost" ,
path : "" , // Optional. Example: If you have your typesense mounted in localhost:8108/typesense, path should be equal to '/typesense'
port : "8108" ,
protocol : "http" ,
} ,
] ,
cacheSearchResultsForSeconds : 2 * 60 , // Cache search results from server. Defaults to 2 minutes. Set to 0 to disable caching.
} ,
// The following parameters are directly passed to Typesense's search API endpoint.
// So you can pass any parameters supported by the search endpoint below.
// query_by is required.
additionalSearchParameters : {
query_by : "name,description,categories" ,
} ,
} ) ;
const searchClient = typesenseInstantsearchAdapter . searchClient ;
const search = instantsearch ( {
searchClient ,
indexName : "products" ,
} ) ;
search . addWidgets ( [
searchBox ( {
container : "#searchbox" ,
} ) ,
hits ( {
container : "#hits" ,
templates : {
item : `
<div class="hit-name">
{{#helpers.highlight}}{ "attribute": "name" }{{/helpers.highlight}}
</div>
` ,
} ,
} ) ,
] ) ;
search . start ( ) ;
คุณสามารถเพิ่มวิดเจ็ต Instantsearch ใดๆ ที่นี่ที่อะแด็ปเตอร์รองรับ
คุณจะพบตัวอย่างการทำงานใน test/support/testground หากต้องการรัน ให้รัน npm run testground
จากโฟลเดอร์รูทของโปรเจ็กต์
import React from "react" ;
import ReactDOM from "react-dom" ;
import { SearchBox } from "react-instantsearch-dom" ;
import TypesenseInstantSearchAdapter from "typesense-instantsearch-adapter" ;
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "abcd" , // Be sure to use an API key that only allows search operations
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "" , // Optional. Example: If you have your typesense mounted in localhost:8108/typesense, path should be equal to '/typesense'
protocol : "http" ,
} ,
] ,
cacheSearchResultsForSeconds : 2 * 60 , // Cache search results from server. Defaults to 2 minutes. Set to 0 to disable caching.
} ,
// The following parameters are directly passed to Typesense's search API endpoint.
// So you can pass any parameters supported by the search endpoint below.
// query_by is required.
additionalSearchParameters : {
query_by : "name,description,categories" ,
} ,
} ) ;
const searchClient = typesenseInstantsearchAdapter . searchClient ;
const App = ( ) => (
< InstantSearch indexName = "products" searchClient = { searchClient } >
< SearchBox / >
< Hits / >
< / InstantSearch >
) ;
จากนั้นคุณสามารถเพิ่มวิดเจ็ต Instantsearch-React ใดๆ ที่นี่ที่อะแด็ปเตอร์รองรับ
คำแนะนำข้างต้นยังใช้กับ React Native ได้ด้วย
แอพ.vue:
< template >
< ais-instant-search :search-client = " searchClient " index-name = " products " >
< ais-search-box />
< ais-hits >
< div slot = " item " slot-scope = " { item } " >
< h2 >{{ item.name }}</ h2 >
</ div >
</ ais-hits >
</ ais-instant-search >
</ template >
< script >
import TypesenseInstantSearchAdapter from " typesense-instantsearch-adapter " ;
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ({
server : {
apiKey : " abcd " , // Be sure to use an API key that only allows search operations
nodes : [
{
host : " localhost " ,
path : " " , // Optional. Example: If you have your typesense mounted in localhost:8108/typesense, path should be equal to '/typesense'
port : " 8108 " ,
protocol : " http " ,
},
],
cacheSearchResultsForSeconds : 2 * 60 , // Cache search results from server. Defaults to 2 minutes. Set to 0 to disable caching.
},
// The following parameters are directly passed to Typesense's search API endpoint.
// So you can pass any parameters supported by the search endpoint below.
// query_by is required.
additionalSearchParameters : {
query_by : " name,description,categories " ,
},
});
const searchClient = typesenseInstantsearchAdapter . searchClient ;
export default {
data () {
return {
searchClient,
};
},
};
</ script >
จากนั้นคุณสามารถเพิ่มวิดเจ็ต Instantsearch ใดๆ ที่นี่ที่อะแด็ปเตอร์รองรับ
// app.component.ts
import { Component } from "@angular/core" ;
import TypesenseInstantSearchAdapter from "typesense-instantsearch-adapter" ;
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "abcd" , // Be sure to use an API key that only allows search operations
nodes : [
{
host : "localhost" ,
path : "" , // Optional. Example: If you have your typesense mounted in localhost:8108/typesense, path should be equal to '/typesense'
port : "8108" ,
protocol : "http" ,
} ,
] ,
cacheSearchResultsForSeconds : 2 * 60 , // Cache search results from server. Defaults to 2 minutes. Set to 0 to disable caching.
} ,
// The following parameters are directly passed to Typesense's search API endpoint.
// So you can pass any parameters supported by the search endpoint below.
// query_by is required.
additionalSearchParameters : {
query_by : "name,description,categories" ,
} ,
} ) ;
const searchClient = typesenseInstantsearchAdapter . searchClient ;
@ Component ( {
selector : "app-root" ,
templateUrl : "./app.component.html" ,
styleUrls : [ "./app.component.css" ] ,
} )
export class AppComponent {
config = {
indexName : "products" ,
searchClient ,
} ;
}
จากนั้นคุณสามารถเพิ่มวิดเจ็ต Instantsearch ใดๆ ที่นี่ที่อะแด็ปเตอร์รองรับ
hierarchicalMenu
สำหรับวิดเจ็ตนี้ คุณต้องการสร้างฟิลด์อิสระในสคีมาของคอลเลกชันโดยใช้หลักการตั้งชื่อเฉพาะนี้:
field.lvl0
field.lvl1
field.lvl2
สำหรับลำดับชั้นที่ซ้อนกันของ field.lvl0 > field.lvl1 > field.lvl2
แต่ละฟิลด์เหล่านี้สามารถเก็บอาร์เรย์ของค่าได้ด้วย สิ่งนี้มีประโยชน์สำหรับการจัดการหลายลำดับชั้น
sortBy
เมื่อสร้างอินสแตนซ์วิดเจ็ตนี้ คุณต้องการตั้งค่าของชื่อดัชนีเป็นรูปแบบเฉพาะนี้:
search . addWidgets ( [
sortBy ( {
container : "#sort-by" ,
items : [
{ label : "Default" , value : "products" } ,
{ label : "Price (asc)" , value : "products/sort/price:asc" } ,
{ label : "Price (desc)" , value : "products/sort/price:desc" } ,
] ,
} ) ,
] ) ;
รูปแบบทั่วไปสำหรับแอตทริบิวต์ value คือ: <index_name>[/sort/<sort_by>]
อะแด็ปเตอร์จะใช้ค่าใน <sort_by>
เป็นค่าสำหรับพารามิเตอร์การค้นหา sort_by
configure
หากคุณต้องการระบุพารามิเตอร์ filter_by
search สำหรับ Typesense คุณต้องการใช้วิดเจ็ต configure
InstantSearch พร้อมด้วย facetFilters
, numericFilters
หรือ filters
รูปแบบของ facetFilters
และ numericFilters
จะเหมือนกับรูปแบบของ Algolia ตามที่อธิบายไว้ที่นี่ แต่ filters
จะต้องอยู่ในรูปแบบ filter_by
ของ Typesense ตามที่อธิบายไว้ในตารางนี้ที่นี่
การตั้งค่า filter_by
ภายในการกำหนด additionalQueryParameters
จะทำงานเมื่อมีการโหลดวิดเจ็ตในขั้นต้นเท่านั้น เนื่องจาก InstantSearch ภายในจะแทนที่ฟิลด์ filter_by
ภายในในภายหลัง อ่านเพิ่มเติมได้ที่นี่
index
สำหรับการค้นหาแบบรวมศูนย์ / หลายดัชนี คุณจะต้องใช้วิดเจ็ต index
เพื่อให้สามารถระบุพารามิเตอร์การค้นหาที่แตกต่างกันสำหรับแต่ละดัชนี/คอลเลกชัน คุณสามารถระบุโดยใช้คอนฟิกูเรชัน collectionSpecificSearchParameters
:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "abcd" , // Be sure to use an API key that only allows search operations
nodes : [ { host : "localhost" , path : "/" , port : "8108" , protocol : "http" } ] ,
} ,
// Search parameters that are common to all collections/indices go here:
additionalSearchParameters : {
numTypos : 3 ,
} ,
// Search parameters that need to be *overridden* on a per-collection-basis go here:
collectionSpecificSearchParameters : {
products : {
query_by : "name,description,categories" ,
} ,
brands : {
query_by : "name" ,
} ,
} ,
} ) ;
const searchClient = typesenseInstantsearchAdapter . searchClient ;
โดยพื้นฐานแล้ว พารามิเตอร์ใดๆ ที่ตั้งค่าใน collectionSpecificSearchParameters
จะถูกรวมเข้ากับค่าใน additionalSearchParameters
เมื่อทำการสืบค้น Typesense additionalSearchParameters
จะแทนที่ค่าใน
geoSearch
Algolia ใช้ _geoloc
เป็นค่าเริ่มต้นสำหรับชื่อของฟิลด์ที่เก็บค่าละติจูดยาวสำหรับบันทึก ใน Typesense คุณสามารถตั้งชื่อฟิลด์ตำแหน่งทางภูมิศาสตร์อะไรก็ได้ หากคุณใช้ชื่ออื่นที่ไม่ใช่ _geoloc
คุณจะต้องระบุชื่อนั้นเมื่อเริ่มต้นอะแดปเตอร์ตามด้านล่าง เพื่อให้ InstantSearch สามารถเข้าถึงได้:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "xyz" ,
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "/" ,
protocol : "http" ,
} ,
] ,
} ,
geoLocationField : "lat_lng_field" , // <<======
additionalSearchParameters ,
} ) ;
dynamicWidgets
พร้อมใช้งานตั้งแต่ Typesense Server
v0.25.0.rc12
วิดเจ็ต dynamicWidgets
นี้ทำงานนอกกรอบโดยไม่มีการเปลี่ยนแปลงเพิ่มเติม แต่หากคุณต้องการควบคุมลำดับการแสดงแง่มุมเหล่านี้ใน UI Instantsearch คาดว่าจะมีการตั้งค่าพารามิเตอร์ที่เรียกว่า renderingContent
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "xyz" ,
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "/" ,
protocol : "http" ,
} ,
] ,
} ,
renderingContent : {
// <<===== Add this, only if you want to control the order of the widgets displayed by dynamicWidgets
facetOrdering : {
facets : {
order : [ "size" , "brand" ] , // <<===== Change this as needed
} ,
} ,
} ,
additionalSearchParameters ,
} ) ;
อ่านเพิ่มเติมเกี่ยวกับตัวเลือกที่มีอยู่ทั้งหมดสำหรับ renderingContent
ในเอกสารประกอบของ Algolia ที่นี่
มีให้ตั้งแต่ typesense-instantsearch-adapter
2.7.0-2
หากช่องสตริงใดๆ ในเอกสารของคุณมีโคลอน :
อยู่ในค่า (เช่น สมมติว่ามีช่องชื่อ { brand: "a:b" }
คุณจะต้องเพิ่มพารามิเตอร์ตามด้านล่างเมื่อสร้างอินสแตนซ์ของอะแดปเตอร์:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "xyz" ,
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "/" ,
protocol : "http" ,
} ,
] ,
} ,
facetableFieldsWithSpecialCharacters : [ "brand" ] , // <======= Add string fields that have colons in their values here, to aid in parsing
additionalSearchParameters ,
} ) ;
หาก ชื่อ ฟิลด์ตัวเลขในเอกสารของคุณมีอักขระพิเศษเช่น >
, <
, =
(เช่น สมมติว่ามีฟิลด์ชื่อ { price>discount: 3.0 }
) คุณจะต้องเพิ่มพารามิเตอร์ดังนี้เมื่อสร้างอินสแตนซ์ของอะแดปเตอร์:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "xyz" ,
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "/" ,
protocol : "http" ,
} ,
] ,
} ,
facetableFieldsWithSpecialCharacters : [ "price>discount" ] , // // <======= Add numeric fields that have >, < or = in their names, to aid in parsing
additionalSearchParameters ,
} ) ;
facet_by
พร้อมใช้งานตั้งแต่ typesense-instantsearch-adapter
2.8.0-1
และ Typesense Serverv0.26.0.rc25
พารามิเตอร์ facet_by
ได้รับการจัดการโดย InstantSearch ภายในเมื่อคุณใช้วิดเจ็ตตัวกรองต่างๆ
แต่หากคุณต้องการส่งตัวเลือกแบบกำหนดเองไปยังพารามิเตอร์ facet_by
(เช่น ตัวเลือกการจัดเรียงฝั่งเซิร์ฟเวอร์) คุณสามารถใช้พารามิเตอร์ facetByOptions
ดังที่แสดงด้านล่าง:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "xyz" ,
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "/" ,
protocol : "http" ,
} ,
] ,
} ,
facetByOptions : {
brand : "(sort_by: _alpha:asc)" ,
category : "(sort_by: _alpha:desc)" ,
} , // <======= Add any facet_by parameter as a key value pair. Don't forget the surrounding parantheses in the value.
collectionSpecificFacetByOptions : {
collection1 : {
brand : "(sort_by: _alpha:desc)" ,
} ,
} , // <======= Use this parameter if multiple collections share the same field names, and you want to use different options for each field. This will override facetByOptions for that particular collection.
additionalSearchParameters ,
} ) ;
โปรดทราบว่าสำหรับการเรียงลำดับใน RefinementLists นอกเหนือจากการเรียงลำดับบนฝั่งเซิร์ฟเวอร์ Typesense แล้ว คุณยังต้องส่งพารามิเตอร์ sortBy
ไปยังวิดเจ็ต RefinementList เพื่อเรียงลำดับผลลัพธ์อย่างเหมาะสมบนฝั่งไคลเอ็นต์ด้วย
filter_by
มีให้ตั้งแต่ typesense-instantsearch-adapter
2.8.0-5
พารามิเตอร์ filter_by
ได้รับการจัดการโดย InstantSearch ภายในเมื่อคุณใช้วิดเจ็ตตัวกรองต่างๆ
ตามค่าดีฟอลต์ อะแด็ปเตอร์ใช้การกรองที่แน่นอน ( filter_by: field:=value
) เมื่อส่งเคียวรีไปยัง Typesense หากคุณต้องการกำหนดค่าอะแดปเตอร์เพื่อใช้ :
(การกรองระดับคำที่ไม่แน่นอน - filter_by: field:value
) คุณต้องการสร้างอินสแตนซ์อะแดปเตอร์โดยใช้การกำหนดค่า filterByOptions
:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "xyz" ,
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "/" ,
protocol : "http" ,
} ,
] ,
} ,
filterByOptions : {
brand : { exactMatch : false } , // <========== Add this to do non-exact word-level filtering
category : { exactMatch : false } ,
} ,
collectionSpecificFilterByOptions : {
collection1 : {
brand : { exactMatch : false } ,
} ,
} , // <======= Use this parameter if multiple collections share the same field names, and you want to use different options for each field. This will override filterByOptions for that particular collection.
additionalSearchParameters ,
} ) ;
มีให้ตั้งแต่ typesense-instantsearch-adapter
2.9.0-0
ต่อไปนี้เป็นวิธีปิดใช้งานกฎการแทนที่/การดูแลจัดการ เมื่อผู้ใช้เลือกลำดับการจัดเรียงเฉพาะ:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "xyz" ,
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "/" ,
protocol : "http" ,
} ,
] ,
} ,
sortByOptions : {
"field1:desc,field2:desc" : { enable_overrides : false } , // <========== Add this to disable sorting when this particular Typesense `sort_by` string is generated by the sortBy widget
} ,
collectionSpecificSortByOptions : {
collection2 : {
"field1:desc,field2:desc" : { enable_overrides : false } ,
} ,
} , // <======= Use this parameter if multiple collections share the same field names, and you want to use different options for each field. This will override sortByOptions for that particular collection.
additionalSearchParameters ,
} ) ;
หากคุณมีวิดเจ็ต sortBy ที่กำหนดค่าด้วยค่า indexName ของ products/sort/price:asc
เช่น คีย์ภายใน sortByOptions
ควรเป็น price:asc
มีให้ตั้งแต่ typesense-instantsearch-adapter
2.7.1-4
โดยดีฟอลต์ เมื่อใช้ group_by
เป็นพารามิเตอร์การค้นหา อะแด็ปเตอร์จะรวมผลลัพธ์ระหว่างกลุ่มทั้งหมดเป็นรายการเดียวของ Hit ตามลำดับ
หากคุณต้องการรักษากลุ่มไว้ คุณต้องตั้งค่า flattenGroupedHits: false
เมื่อสร้างอินสแตนซ์ของอะแดปเตอร์
วิธีนี้จะวาง Hit แรกในกลุ่มเป็น Hit หลัก จากนั้นเพิ่ม Hit ทั้งหมดในกลุ่มภายในคีย์ _grouped_hits
ภายในแต่ละ Hit
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "xyz" ,
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "/" ,
protocol : "http" ,
} ,
] ,
} ,
flattenGroupedHits : false , // <=======
additionalSearchParameters ,
} ) ;
มีให้ตั้งแต่ typesense-instantsearch-adapter
2.7.0-3
แนวคิดทั่วไปคือการเชื่อมต่อกับวงจรชีวิตของการสืบค้นของ Instantsearch ก่อน สกัดกั้นการสืบค้นที่พิมพ์แล้วส่งไปยัง API ที่ฝัง ดึงข้อมูลการฝัง จากนั้นส่งเวกเตอร์ไปที่ Typesense เพื่อทำการค้นหาเวกเตอร์ข้างเคียงที่ใกล้ที่สุด
นี่คือการสาธิตที่คุณสามารถเรียกใช้ในเครื่องเพื่อดูการทำงานนี้: https://github.com/typesense/showcase-hn-comments-semantic-search
ต่อไปนี้เป็นวิธีดำเนินการใน Instantsearch.js:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "xyz" ,
nodes : [
{
host : "localhost" ,
port : "8108" ,
path : "/" ,
protocol : "http" ,
} ,
] ,
} ,
additionalSearchParameters ,
} ) ;
// from https://github.com/typesense/showcase-hn-comments-semantic-search/blob/8a33006cae58b425c53f56a64e1273e808cd9375/src/js/index.js#L101
const searchClient = typesenseInstantsearchAdapter . searchClient ;
search = instantsearch ( {
searchClient ,
indexName : INDEX_NAME ,
routing : true ,
async searchFunction ( helper ) {
// This fetches 200 (nearest neighbor) results for semantic / hybrid search
let query = helper . getQuery ( ) . query ;
const page = helper . getPage ( ) ; // Retrieve the current page
if ( query !== "" && [ "semantic" , "hybrid" ] . includes ( $ ( "#search-type-select" ) . val ( ) ) ) {
console . log ( helper . getQuery ( ) . query ) ;
helper
. setQueryParameter (
"typesenseVectorQuery" , // <=== Special parameter that only works in [email protected] and above
`embedding:([], k:200)` ,
)
. setPage ( page )
. search ( ) ;
console . log ( helper . getQuery ( ) . query ) ;
} else {
helper . setQueryParameter ( "typesenseVectorQuery" , null ) . setPage ( page ) . search ( ) ;
}
} ,
} ) ;
การแคชมีสองโหมด:
แคชฝั่งเซิร์ฟเวอร์:
หากต้องการเปิดใช้งานการแคชฝั่งเซิร์ฟเวอร์ ให้เพิ่มพารามิเตอร์ชื่อ useServerSideSearchCache: true
ในบล็อกการกำหนดค่า server
ของ typesense-instantsearch-adapter ดังนี้:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "..." ,
nearestNode : { ... } ,
nodes : [ ... ] ,
useServerSideSearchCache : true // <<< Add this to send use_cache as a query parameter instead of post body parameter
} ,
additionalSearchParameters : { ... }
} ) ;
สิ่งนี้จะทำให้อะแด็ปเตอร์เพิ่ม ?use_cache=true
เป็นพารามิเตอร์เคียวรี URL ให้กับคำขอการค้นหาทั้งหมดที่เริ่มต้นโดยอะแด็ปเตอร์ ซึ่งจะทำให้เซิร์ฟเวอร์ Typesense เปิดใช้งานการแคชฝั่งเซิร์ฟเวอร์สำหรับคำขอเหล่านี้
การแคชฝั่งไคลเอ็นต์:
อะแดปเตอร์ยังมีการเปิดใช้งานแคชฝั่งไคลเอ็นต์ตามค่าเริ่มต้น เพื่อป้องกันการเรียกเครือข่ายที่ไม่จำเป็นไปยังเซิร์ฟเวอร์ TTL สำหรับแคชฝั่งไคลเอ็นต์นี้สามารถกำหนดค่าได้ดังนี้:
const typesenseInstantsearchAdapter = new TypesenseInstantSearchAdapter ( {
server : {
apiKey : "..." ,
nearestNode : { ... } ,
nodes : [ ... ] ,
cacheSearchResultsForSeconds : 2 * 60 // <<< Add this to configure the TTL for client-side cache in the browser
} ,
additionalSearchParameters : { ... }
} ) ;
เซิร์ฟเวอร์ Typesense | typeense-instantsearch-อะแดปเตอร์ | ค้นหาทันใจ.js | ตอบสนองการค้นหาทันที | vue-ค้นหาทันที | การค้นหาเชิงมุมทันที |
---|---|---|---|---|---|
>= v0.25.0 | >= เวอร์ชัน 2.7.1 | >= 4.51 | >=6.39 | >=4.8 | >=4.4 |
>= v0.25.0.rc14 | >= เวอร์ชัน 2.7.0-1 | >= 4.51 | >=6.39 | >=4.8 | >=4.4 |
>= v0.25.0.rc12 | >= เวอร์ชัน 2.6.0 | >= 4.51 | >=6.39 | >=4.8 | >=4.4 |
>= v0.24 | >= เวอร์ชัน 2.5.0 | >= 4.2.0 | >= 6.0.0 | >= 2.2.1 | >= 3.0.0 |
>=v0.21 | >= เวอร์ชัน 2.0.0 | >= 4.2.0 | >= 6.0.0 | >= 2.2.1 | >= 3.0.0 |
>= v0.19 | >= v1.0.0 | >= 4.2.0 | >= 6.0.0 | >= 2.2.1 | >= 3.0.0 |
>= v0.15 | >= v0.3.0 | >= 4.2.0 | >= 6.0.0 | >= 2.2.1 | >= 3.0.0 |
>= v0.14 | >= v0.2.0 | >= 4.2.0 | >= 6.0.0 | >= 2.2.1 | >= 3.0.0 |
>= v0.13 | >= v0.1.0 | >= 4.2.0 | >= 6.0.0 | >= 2.2.1 | >= 3.0.0 |
>= v0.12 | >= v0.0.4 | >= 4.2.0 | >= 6.0.0 | >= 2.2.1 | >= 3.0.0 |
หากไลบรารีด้านบนบางเวอร์ชันใช้งานไม่ได้กับอะแดปเตอร์ โปรดเปิดปัญหา Github พร้อมรายละเอียด
อะแดปเตอร์นี้ใช้งานได้กับวิดเจ็ตทั้งหมดในรายการนี้
$ npm install
$ npm run typesenseServer
$ FORCE_REINDEX=true npm run indexTestData
$ npm link typesense-instantsearch-adapter
$ npm run testground
$ npm test
เพื่อออกเวอร์ชันใหม่ เราใช้แพ็คเกจ np:
$ npm install --global np
$ np
# Follow instructions that np shows you
หากคุณมีคำถามหรือประสบปัญหาใดๆ โปรดสร้างปัญหา Github แล้วเราจะพยายามช่วยเหลืออย่างเต็มที่
© 2020-ปัจจุบัน Typesense, Inc.