309 lines
9.3 KiB
JavaScript
309 lines
9.3 KiB
JavaScript
import { ref, onUnmounted } from 'vue'
|
||
|
||
const MIN_HOLD_MS = 280
|
||
|
||
/**
|
||
* 语音转文字（长按说话）：微信小程序 WechatSI；H5 Web Speech API。
|
||
*
|
||
* @param {{ onResult?: (text: string) => void, showToast?: (msg: string) => void }} options
|
||
*/
|
||
export function useSpeechToText({ onResult, showToast } = {}) {
|
||
const sttListening = ref(false)
|
||
const sttHolding = ref(false)
|
||
const sttSupported = ref(false)
|
||
|
||
let wxRecordManager = null
|
||
let h5Recognition = null
|
||
let holdStartTs = 0
|
||
let holdSessionId = 0
|
||
let startRequested = false
|
||
let recordAuthorized = null
|
||
// WechatSI 录音管理器是全局单例：跨页面/快速点按可能残留会话，
|
||
// 用以下两个标记把 start/stop 串行化，避免 "please stop after start"
|
||
let managerRecording = false
|
||
let pendingStartSession = 0
|
||
|
||
function notify(msg) {
|
||
if (!msg) return
|
||
if (typeof showToast === 'function') {
|
||
showToast(msg)
|
||
return
|
||
}
|
||
uni.showToast({ title: msg, icon: 'none', duration: 2000 })
|
||
}
|
||
|
||
function emitResult(text) {
|
||
const t = String(text || '').trim()
|
||
const heldMs = Date.now() - holdStartTs
|
||
if (!t) {
|
||
if (heldMs < MIN_HOLD_MS) return
|
||
notify('没听清，请再试一次')
|
||
return
|
||
}
|
||
if (typeof onResult === 'function') {
|
||
onResult(t)
|
||
}
|
||
}
|
||
|
||
function stopListening() {
|
||
// #ifdef MP-WEIXIN
|
||
if (wxRecordManager && (sttListening.value || startRequested || managerRecording)) {
|
||
try {
|
||
wxRecordManager.stop()
|
||
} catch (e) {}
|
||
}
|
||
// #endif
|
||
|
||
// #ifdef H5
|
||
if (h5Recognition && sttListening.value) {
|
||
try {
|
||
h5Recognition.stop()
|
||
} catch (e) {}
|
||
}
|
||
// #endif
|
||
|
||
startRequested = false
|
||
sttListening.value = false
|
||
}
|
||
|
||
function ensureRecordAuth(onGranted) {
|
||
// #ifdef MP-WEIXIN
|
||
if (recordAuthorized === true) {
|
||
onGranted()
|
||
return
|
||
}
|
||
uni.authorize({
|
||
scope: 'scope.record',
|
||
success() {
|
||
recordAuthorized = true
|
||
onGranted()
|
||
},
|
||
fail() {
|
||
recordAuthorized = false
|
||
sttHolding.value = false
|
||
uni.showModal({
|
||
title: '需要麦克风权限',
|
||
content: '请在设置中允许使用麦克风，以便长按说话',
|
||
confirmText: '去设置',
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.openSetting({})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
})
|
||
// #endif
|
||
// #ifndef MP-WEIXIN
|
||
onGranted()
|
||
// #endif
|
||
}
|
||
|
||
// #ifdef MP-WEIXIN
|
||
function actuallyStartWechat(session) {
|
||
if (!wxRecordManager || session !== holdSessionId || !sttHolding.value) {
|
||
return
|
||
}
|
||
try {
|
||
startRequested = true
|
||
managerRecording = true
|
||
wxRecordManager.start({
|
||
duration: 60000,
|
||
lang: 'zh_CN'
|
||
})
|
||
} catch (e) {
|
||
startRequested = false
|
||
managerRecording = false
|
||
sttHolding.value = false
|
||
notify('无法开始录音')
|
||
}
|
||
}
|
||
// #endif
|
||
|
||
function startWechatRecord(session) {
|
||
// #ifdef MP-WEIXIN
|
||
if (!wxRecordManager || session !== holdSessionId || !sttHolding.value) {
|
||
return
|
||
}
|
||
// 上一段会话还没结束（含全局单例残留）：先停止并排队，
|
||
// 待 onStop 回调后再真正开始，避免 "please stop after start"
|
||
if (managerRecording || startRequested) {
|
||
pendingStartSession = session
|
||
try {
|
||
wxRecordManager.stop()
|
||
} catch (e) {}
|
||
return
|
||
}
|
||
actuallyStartWechat(session)
|
||
// #endif
|
||
}
|
||
|
||
function startH5Record() {
|
||
// #ifdef H5
|
||
if (!h5Recognition) {
|
||
notify('当前浏览器不支持语音输入')
|
||
sttHolding.value = false
|
||
return
|
||
}
|
||
try {
|
||
startRequested = true
|
||
h5Recognition.start()
|
||
sttListening.value = true
|
||
} catch (e) {
|
||
startRequested = false
|
||
sttHolding.value = false
|
||
notify('无法开始语音识别，请检查麦克风权限')
|
||
}
|
||
// #endif
|
||
}
|
||
|
||
/** 长按开始：手指按下 */
|
||
function beginHoldSpeech() {
|
||
if (!sttSupported.value) {
|
||
notify('当前环境不支持语音输入')
|
||
return
|
||
}
|
||
if (sttHolding.value) return
|
||
|
||
const session = ++holdSessionId
|
||
holdStartTs = Date.now()
|
||
sttHolding.value = true
|
||
|
||
// #ifdef MP-WEIXIN
|
||
ensureRecordAuth(() => startWechatRecord(session))
|
||
// #endif
|
||
// #ifdef H5
|
||
startH5Record()
|
||
// #endif
|
||
// #ifndef MP-WEIXIN
|
||
// #ifndef H5
|
||
sttHolding.value = false
|
||
notify('当前端暂不支持语音输入')
|
||
// #endif
|
||
// #endif
|
||
}
|
||
|
||
/** 松手结束：手指抬起 */
|
||
function endHoldSpeech() {
|
||
if (!sttHolding.value && !sttListening.value && !startRequested && !managerRecording) {
|
||
return
|
||
}
|
||
sttHolding.value = false
|
||
// 松手后不再补开排队的录音
|
||
pendingStartSession = 0
|
||
if (sttListening.value || startRequested || managerRecording) {
|
||
stopListening()
|
||
return
|
||
}
|
||
holdSessionId += 1
|
||
}
|
||
|
||
// #ifdef MP-WEIXIN
|
||
try {
|
||
// eslint-disable-next-line no-undef
|
||
const plugin = requirePlugin('WechatSI')
|
||
wxRecordManager = plugin.getRecordRecognitionManager()
|
||
sttSupported.value = !!wxRecordManager
|
||
|
||
wxRecordManager.onStart = () => {
|
||
managerRecording = true
|
||
if (!sttHolding.value) {
|
||
try {
|
||
wxRecordManager.stop()
|
||
} catch (e) {}
|
||
return
|
||
}
|
||
startRequested = false
|
||
sttListening.value = true
|
||
}
|
||
wxRecordManager.onStop = (res) => {
|
||
managerRecording = false
|
||
sttListening.value = false
|
||
startRequested = false
|
||
// 有排队的开始请求（残留会话已停止 / 用户仍按住）：现在再真正开始
|
||
if (pendingStartSession && pendingStartSession === holdSessionId && sttHolding.value) {
|
||
const s = pendingStartSession
|
||
pendingStartSession = 0
|
||
actuallyStartWechat(s)
|
||
return
|
||
}
|
||
pendingStartSession = 0
|
||
emitResult(res?.result)
|
||
}
|
||
wxRecordManager.onError = (res) => {
|
||
managerRecording = false
|
||
sttListening.value = false
|
||
startRequested = false
|
||
const msg = (res && res.msg) || ''
|
||
// 上一段未停止就再次 start 触发：停止后若仍按住则自动重试，不打扰用户
|
||
if (/please stop after start/i.test(msg)) {
|
||
try {
|
||
wxRecordManager.stop()
|
||
} catch (e) {}
|
||
pendingStartSession = sttHolding.value ? holdSessionId : 0
|
||
return
|
||
}
|
||
pendingStartSession = 0
|
||
sttHolding.value = false
|
||
notify(msg || '语音识别失败')
|
||
}
|
||
} catch (e) {
|
||
console.warn('WechatSI record recognition not available', e)
|
||
}
|
||
// #endif
|
||
|
||
// #ifdef H5
|
||
try {
|
||
if (typeof window !== 'undefined') {
|
||
const SR = window.SpeechRecognition || window.webkitSpeechRecognition
|
||
if (SR) {
|
||
h5Recognition = new SR()
|
||
h5Recognition.lang = 'zh-CN'
|
||
h5Recognition.interimResults = false
|
||
h5Recognition.continuous = false
|
||
h5Recognition.maxAlternatives = 1
|
||
sttSupported.value = true
|
||
|
||
h5Recognition.onresult = (event) => {
|
||
const item = event.results?.[0]?.[0]
|
||
emitResult(item?.transcript || '')
|
||
}
|
||
h5Recognition.onend = () => {
|
||
sttListening.value = false
|
||
startRequested = false
|
||
sttHolding.value = false
|
||
}
|
||
h5Recognition.onerror = (event) => {
|
||
sttListening.value = false
|
||
startRequested = false
|
||
sttHolding.value = false
|
||
if (event?.error === 'not-allowed') {
|
||
notify('请允许浏览器使用麦克风')
|
||
} else if (event?.error !== 'aborted') {
|
||
notify('语音识别失败')
|
||
}
|
||
}
|
||
}
|
||
}
|
||
} catch (e) {
|
||
console.warn('H5 SpeechRecognition not available', e)
|
||
}
|
||
// #endif
|
||
|
||
onUnmounted(() => {
|
||
sttHolding.value = false
|
||
holdSessionId += 1
|
||
pendingStartSession = 0
|
||
stopListening()
|
||
})
|
||
|
||
return {
|
||
sttListening,
|
||
sttHolding,
|
||
sttSupported,
|
||
beginHoldSpeech,
|
||
endHoldSpeech,
|
||
stopSpeechToText: endHoldSpeech
|
||
}
|
||
}
|