FAQ

Le domande più comuni su Search

Ricerca Vocale #

Questo codice è pensato per essere un punto di partenza che può essere adattato alle tue esigenze.

Molti browser supportano nativamente la ricerca vocale, rendendo abbastanza semplice per gli sviluppatori implementarla nelle funzionalità di ricerca di Clerk.io.

Di seguito è riportato un esempio di script che può essere utilizzato per trascrivere testo utilizzando un microfono. In particolare, inserirà il testo nel campo di input di Clerk.io Omnisearch.

Aggiunge un pulsante che, quando cliccato, attiva l’API di riconoscimento vocale del browser e inserisce il testo nel campo di input.

Puoi aggiungere questo script come un code block a un design dell’editor di design per una Ricerca Istantanea o direttamente in un code design per Ricerca Istantanea o Omnisearch.


<button class="mic-button" onclick="startVoiceSearch()">🎙️</button>

<script>
function startVoiceSearch() {
    if (!('webkitSpeechRecognition' in window)) {
        alert("Il tuo browser non supporta il riconoscimento vocale.");
        return;
    }

    let recognition = new webkitSpeechRecognition();
    recognition.lang = "en-US";
    recognition.interimResults = false;
    recognition.maxAlternatives = 1;
    recognition.onstart = () => console.log("In ascolto...");
    recognition.onerror = (event) => console.error("Errore di Riconoscimento Vocale:", event);
    recognition.onend = () => console.log("Il riconoscimento vocale è terminato.");
    recognition.onresult = function(event) {
        let transcript = event.results[0][0].transcript;
        updateSearchInput(transcript);
    };
    recognition.start();
}

function updateSearchInput(text) {
    let input = document.getElementById("clerk-omnisearch-input");
    input.value = text;
    // Attiva eventi per aggiornare correttamente la ricerca
    ['input', 'change', 'keydown', 'keyup'].forEach(eventType => {
        let event = new Event(eventType, { bubbles: true });
        input.dispatchEvent(event);
    });
    console.log("Input vocale aggiunto:", text);
}
</script>

Questa pagina è stata tradotta da un'utile intelligenza artificiale, quindi potrebbero esserci errori linguistici. Grazie per la comprensione.