Van e-commerce platforms tot Content Management Systemen (CMS’en), webapps genereren en verwerken enorme hoeveelheden gegevens. Het efficiënt extraheren van relevante informatie uit deze gegevens is cruciaal voor een naadloze gebruikerservaring. Traditionele zoekfunctionaliteit die gebruik maakt van letterlijke, woord-voor-woord querymatching voldoet dus niet. Je hebt daarom een full-text query nodig.

Een full-text query onderzoekt de volledige inhoud van documenten of databases, zodat je relevante informatie kunt ophalen uit grote datasets op basis van specifieke woorden of zinnen. Er wordt rekening gehouden met factoren als frequentie van voorkomen en meertalige inhoud, wat nauwkeurigere en uitgebreidere zoekresultaten oplevert.

Meilisearch is een voorloper in deze klasse van zoekmachines en gebruikt de kracht van full-text search om een flexibel en krachtig hulpmiddel te bieden dat is gebouwd met ontwikkelaars en eindgebruikers in gedachten.

Deze tutorial laat zien hoe je Meilisearch in een Node.js webproject kunt integreren.

Wat is Meilisearch?

Meilisearch is een open-source zoekmachine die snelle, relevante zoekresultaten biedt voor eindgebruikers. Het is bestand tegen typefouten en werkt out-of-the-box met standaardinstellingen die aansluiten bij voor de meeste projecten.

Meilisearch is ook zeer aanpasbaar en biedt talloze features om de relevantie van de zoekresultaten af te stemmen. De meest opvallende van deze functies zijn de rangschikkingsregels (ranking rules), die je kunt aanpassen aan je project.

Ook kan je gebruik maken van een intuïtieve RESTful API voor naadloze integratie in vrijwel elke zakelijke website. Je kunt alles zelf hosten of de officiële cloud-hosted oplossing, Meilisearch Cloud, gebruiken om snel en moeiteloos aan de slag te gaan. Deze tutorial maakt gebruik van Meilisearch Cloud.

Vereisten

Om deze handleiding te kunnen volgen, heb je nodig:

Meilisearch instellen

  1. Navigeer naar Meilisearch Cloud en maak een account aan of log in. Zorg ervoor dat je je e-mailadres bevestigt.
  2. Klik vervolgens op Create a projectproject, een server met een Meilisearch instance – waar je de datasets van je website aan toevoegt.
  3. Voeg een projectnaam toe (bijvoorbeeld book-app) en kies de gewenste regio. Klik vervolgens op Create. Nadat je je project hebt gemaakt, kun je op Settings klikken om details over je project te bekijken, zoals de URL voor toegang tot de datasets, APIsleutels voor het beveiligen van je Meilisearch instance en andere informatie.
    De overzichtspagina van het book-app project.
    De overzichtspagina van het book-app project.

    Er zijn drie API sleutels die je hier kan vinden, die elk een ander autorisatieniveau vertegenwoordigen:

    • Master key – Deze sleutel kan alle routes gebruiken en heeft als enige toegang tot de endpoint voor het aanmaken en verwijderen van API keys. Gebruik de master key alleen om API sleutels te beheren vanuit een beveiligde omgeving.
    • Default Search API Key – Deze sleutel geeft alleen toegang tot de zoekroute. Je kunt hem gebruiken in de client-side code.
    • Default Admin API Key – Deze sleutel geeft toegang tot alle API routes behalve /keys, die is voor het aanmaken en verwijderen van API sleutels. Je kunt deze sleutel alleen gebruiken vanuit een beveiligde omgeving.

Data indexeren met Meilisearch

Indexen zijn de kerncomponenten die doorzoekbare gegevens opslaan en organiseren. Ze fungeren als containers voor documenten – objecten die een of meer velden bevatten.

Elke index in Meilisearch is onafhankelijk en aanpasbaar, waardoor geïndividualiseerde zoekrangschikkingsregels en filteropties mogelijk zijn.

Een index maken en documenten toevoegen

  1. Klik in de navigatiebalk op de tab Indexes in je project.
  2. Klik op Create index. Voer vervolgens een indexnaam in (bijvoorbeeld boeken) en klik op Create index.
  3. Selecteer hoe je je documenten wilt importeren. Voor deze handleiding importeer je een JSON bestand met 13 boekvermeldingen uit de Google Book API.
  4. Klik op Upload file en upload het JSON-bestand, klik daarna op Import documents.

Documenten bijwerken en verwijderen

Meilisearch Cloud bevat momenteel geen manier om documenten te wijzigen of te verwijderen, maar je kunt de REST API routes of SDK gebruiken. De onderstaande code laat zien hoe je documenten kunt bijwerken of verwijderen met behulp van de REST API endpoints. Deze tutorial gebruikt cURL om met de routes te werken, maar je kunt ook een API-platform zoals Postman gebruiken.

  1. Stuur voor het bijwerken van documenten een PUT verzoek op de volgende route: 
    /indexes/{index_uid}/documents

    De index_uid hierboven is de indexnaam van je project:

    Gemarkeerde indexnaam.
    Gemarkeerde indexnaam.

  2. Met deze route kun je een lijst met documenten toevoegen of bijwerken als ze al bestaan. Om een document bij te werken, moet je de primary key toevoegen. Het oude document wordt gedeeltelijk bijgewerkt op basis van de velden in het nieuwe document. De update bewaart alle velden die niet in het nieuwe document staan, zodat ze ongewijzigd blijven. Hieronder zie je een voorbeeld van hoe je de titel van een document in de index van het boek kunt bijwerken van JavaScript for Kids naar JavaScript Coding for Kids en een uitgeversveld kunt toevoegen: 
    curl \
    -X PUT '/indexes/books/documents' \
    -H 'Content-Type: application/json' \ 
    -H 'Authorization: Bearer ' \
        --data-binary '[
        {
            "id": "71nDBQAAQBAJ",
            "title": "JavaScript Coding for Kids",
            "publisher": "No Starch Press"
        }
    ]'
  3. Vervang <your-project-url> en <your-admin-api-key> door de corresponderende waarden in je de overzichtspagina van je project: 
    "taskUid": 26, "indexUid": "books", "status": "enqueued", "type": "documentAdditionOrUpdate", "equeuedAt": "2023-05-26T07:52:24.127920065Z"
  4. Voor het verwijderen van documenten bevat Meilisearch drie routes (endpoints): 
    /indexes/{index_uid}/documents // Deleting all documents
/indexes/{index_uid}/documents/{document_id} // Deleting a single document
/indexes/{index_uid}/documents/delete-batch // Deleting a selection of  
documents

    Je kunt de document_id krijgen van de originele gegevens uit het books.json bestand na het ophalen van het document uit MeiliSearch Cloud of je database.

Hieronder zie je een voorbeeld van hoe je het boek dat je hierboven hebt bijgewerkt, kunt verwijderen:

curl 
    -H 'Authorization: Bearer ' \
    -X DELETE '/indexes/books/documents/71nDBQAAQBAJ'

Na het verzenden van het verzoek zou je antwoord er als volgt uit moeten zien:

"taskUid": 10, "indexUid": "books", "status": "enqueued", "type": "documentDeletion", "equeuedAt": "2023-05-26T07:20:11.1291066"

MeiliSearch toevoegen aan een webdienst

  1. Begin met het klonen van het startproject van GitHub door de volgende commando’s in je terminal uit te voeren: 
    git clone https://github.com/Tammibriggs/meilisearch-app.git
cd meilisearch​-app
npm install

    Als je het package.json bestand bekijkt, zou je het start commando moeten zien. Voer npm start uit om het Node.js project op localhost port3000 uit te voeren. Als je http://localhost:3000/ in je browser invoert, zou je het volgende moeten zien:

    Meilisearch demo starter app
    Meilisearch demo starter app.

  2. Als de app eenmaal draait, kun je Meilisearch eraan toevoegen zodat het zoekformulier de resultaten van Meilisearch retourneert wanneer het wordt verzonden. Om dit te doen, installeer je Meilisearch door het volgende commando in de terminal uit te voeren: 
    npm install meilisearch
  3. Je moet ook het pakket dotenv npm installeren om gevoelige referenties uit een .env bestand te laden. Voer de volgende opdracht uit in de terminal: 
    npm install dotenv
  4. Maak een .env bestand in de project root map en voeg het volgende toe: 
    YOUR_PROJECT_URL= '<your-project-url>'
YOUR_SEARCH_API_KEY= '<your-admin-api-key>'

    Zorg ervoor dat je <your-project-url> en <your-admin-api-key> vervangt door hun overeenkomstige waarden.

  5. Importeer vervolgens meilisearch en het pakket dotenv in het bestand server.js en configureer dotenv: 
    import {MeiliSearch} from 'meilisearch'
import dotenv from 'dotenv';
dotenv.config();
  6. Initialiseer vervolgens Meilisearch zodat je kunt beginnen met het werken aan je books-app project. Navigeer naar het server.js bestand en voeg de volgende code toe na de searchValue variabele definitie: 
    const client = new MeiliSearch({ host: process.env.YOUR_PROJECT_URL, apiKey: process.env.YOUR_SEARCH_API_KEY })
  7. Een belangrijke functionaliteit is het doorzoeken van je boekenindex in Meilisearch met behulp van de zoekwaarde die aan de URL is gekoppeld bij het verzenden van het formulier. Om deze functionaliteit in te schakelen, voeg je de volgende code toe na de client variabele definitie: 
    const index = client.index('books')  
const searchResults = !!searchValue && await index.search(searchValue)

    Deze code maakt een verwijzing naar de index van het boek. Vervolgens wordt de methode search() gebruikt om te zoeken naar documenten die overeenkomen met de zoekwaarde in de index van het boek als je searchValue hebt gedefinieerd.

  8. Ten slotte wijzig je de methode render() als volgt om de zoekresultaten weer te geven: 
    res.render('index', {
    books: searchResults ? searchResults.hits : [],
    searchValue
})

    Je bent nu klaar om de index van het boek te doorzoeken:

    Zoeken door de 'books' index met het zoekformulier
    Zoeken door de ‘books’ index met het zoekformulier

  9. Na het toevoegen van bovenstaande codes zou je server.js bestand er zo uit moeten zien: 
    import express from 'express';
import { MeiliSearch } from 'meilisearch';
import dotenv from 'dotenv';
dotenv.config();

const app = express();
const PORT = process.env.PORT || 3000;

app.set('view engine', 'ejs');
app.use(express.static('public'));

app.get('/', async (req, res) => {
	const searchValue = req.query.search;
	const client = new MeiliSearch({
		host: process.env.YOUR_PROJECT_URL,
		apiKey: process.env.YOUR_SEARCH_API_KEY,
	});
	const index = client.index('books');
	const searchResults = !!searchValue && (await index.search(searchValue));

	res.render('index', {
		books: searchResults ? searchResults.hits : [],
		searchValue,
	});
});

app.listen(PORT, () => {
	console.log(`listening at http://localhost:${PORT}`);
});

Je kunt de volledige code voor deze tutorial bekijken op GitHub.

Samenvatting

Meilisearch is een uitstekende zoekmachine-oplossing die de zoekmogelijkheden en gebruikerservaring van een website verbetert. De uitzonderlijke snelheid, het relevantiegerichte rangschikkingsalgoritme en het naadloze integratieproces maken het een tool van onschatbare waarde als je de zoekfunctionaliteit van je website wilt optimaliseren.

Kinsta’s Applicatie Hosting dienst verbetert naadloos de prestaties van apps die werken met Meilisearch. Met een robuuste infrastructuur en gestroomlijnde serveromgevingen zorgt Kinsta voor een snelle zoekfunctionaliteit, waarmee de gebruikerservaring wordt verbeterd. De schaalbaarheid van het platform voldoet aan de eisen van Meilisearch en garandeert betrouwbare en efficiënte zoekactiviteiten.

Op welke zoekmachine vertrouw jij voor je projecten? Laat het ons weten in de comments!

Jeremy Holcombe Kinsta

Content & Marketing Editor bij Kinsta, WordPress Web Developer en Content Writer. Buiten alles wat met WordPress te maken heeft, geniet ik van het strand, golf en films. En verder heb ik last van alle problemen waar andere lange mensen ook tegenaan lopen ;).