chrome語音文字互轉

zt123123發表於2024-11-04
Chrome

隨著瀏覽器技術發展，chrome越來越強大。可以實現越來越多的系統級功能，例如：檔案操作、剪下板、支付、NFC、通知、WASM、XR（VR、AR）、串列埠、藍芽、語音合成、AI等（可參考FUGU專案）

在以前想要實現語音文字互轉功能，基本都是接入第三方服務（例如訊飛、百度等）。這種方式優點是，提供各種定製化的服務，能夠滿足大部分需求。缺點是：需要高額的費用。如果沒有個性化的需求，現在完全可以藉助瀏覽器自帶的API來實現，優點是接入簡單，無需花錢。缺點就是：功能有限，滿足不了個性化需求。

文字轉語音

 // 檢查瀏覽器是否支援Speech Synthesis
if ('speechSynthesis' in window) {
    const text = '你好，歡迎使用文字轉語音功能！'; // 要合成的文字
    const utterance = new SpeechSynthesisUtterance(text); // 建立一個語音合成例項
    // 設定語言和其他屬性
    utterance.lang = 'zh-CN'; // 設定語言為中文
    utterance.rate = 1; // 語速（0.1到10）
    utterance.pitch = 1; // 音調（0到2）
    // 開始合成並播放
    speechSynthesis.speak(utterance);
} else {
    console.error('該瀏覽器不支援Speech Synthesis API');
}

語音轉文字

// 檢查瀏覽器是否支援
const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
if (SpeechRecognition) {
    const recognition = new SpeechRecognition();
    recognition.lang = 'zh-CN'; // 設定語言為中文
    recognition.interimResults = false; // 是否返回中間結果
    // 識別成功的回撥
    recognition.onresult = (event) => {
        const transcript = event.results[0][0].transcript; // 獲取識別結果
        console.log('識別結果:', transcript);
    };
    // 識別錯誤的回撥
    recognition.onerror = (event) => {
        console.error('識別錯誤:', event.error);
    };
    // 開始識別
    recognition.start();
} else {
    console.error('該瀏覽器不支援Web Speech API');
}

相關文章