问题描述
我正在使用HTML和JavaScript开发一个简单的语音识别页面。对于Google Chrome的语音识别实现,api文档中显然没有定义某些保留的单词和短语。
以下是一些常见示例:
- “新段落”-效果不错,没有歧义
- “句点”-无条件返回字符“。”即使您将麦克风中的字母拼写为“ p e r i o d”,它仍会输出“。”。
- “逗号”-无条件地返回字符“,”即使您将麦克风中的字母拼写为“ c o m a”,它仍会输出“,”。
可能还有更多,我很想获得它们的完整列表。
有人知道如何或说什么来逃脱“。”拼写出“句号”一词?
这是我针对chrome-speech-to-text.PHP的测试代码
<?PHP
simple_speech();
?>
<?PHP
function simple_speech(){
?>
<!DOCTYPE html>
<Meta charset="utf-8">
<title>Simple Speech to Text</title>
<?PHP
$browser="";
if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("MSIE"))){?>
<p id="info_upgrade" style="text-align:center;">Simple Speech to Text is not supported by this browser.
Upgrade to <a href="//www.google.com/chrome">Chrome</a>
version 25 or later.</p>
<?PHP }
else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("Presto")))
{
//$browser="opera";
}
else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("CHROME")))
{?>
<?PHP
}
else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("SAFARI")))
{ ?>
<p id="info_upgrade" style="text-align:center;">Simple Speech to Text is not supported by this browser.
Upgrade to <a href="//www.google.com/chrome">Chrome</a>
version 25 or later.</p>
<?PHP }
else if(strpos(strtolower($_SERVER["HTTP_USER_AGENT"]),strtolower("FIREFOX")))
{ ?>
<p id="info_upgrade" style="text-align:center;">Simple Speech to Text is not supported by this browser.
Upgrade to <a href="//www.google.com/chrome">Chrome</a>
version 25 or later.</p>
<?PHP }
else
{
//$browser="other";
}
echo $browser;
?>
<div style="margin-bottom:50px">
<div style="width:100%">
<textarea name="q" id="transcript" rows="15" style="width:100% !important;"></textarea>
</div>
<div style="margin-top: 20px;margin-left: 10px;float:left;">
<a id="copy_dictation" onclick="speakcopy();" style="padding: 6px 11px;background-color:#2111c4;cursor:pointer;color:#fff;margin-top:10px;border-radius:5px;"> copy</a>
</div>
<div style="margin-top: 20px;margin-left: 10px;float:left;">
<a id="clear_dictation" onclick="speakclear()" style="padding: 6px 11px;background-color:#e5225c;cursor:pointer;color:#fff;margin-top:10px;border-radius:5px;"> Clear</a>
</div>
</div>
<!-- HTML5 Speech Recognition API -->
<script>
startDictation()
function startDictation() {
var recognition = new webkitSpeechRecognition();
console.log(recognition);
recognition.continuous = true;
recognition.interimResults = true;
recognition.lang = "en";
recognition.onend = function(e) {
console.log('ended');
var textarea = document.getElementById('transcript');
if (textarea.value != '') {
textarea.value = textarea.value.trim();
textarea.value += ' ';
}
recognition.start();
}
recognition.onresult = function(e) {
var textarea = document.getElementById('transcript');
for (var i = e.resultIndex; i < e.results.length; ++i) {
if (e.results[i].isFinal) {
textarea.value += e.results[i][0].transcript;
}
}
}
// start listening
recognition.start();
}
function speakcopy() {
var recognition = new webkitSpeechRecognition();
recognition.stop();
copyToClipboard(document.getElementById("transcript"));
}
function speakclear() {
var recognition = new webkitSpeechRecognition();
recognition.stop();
document.getElementById("transcript").value = "";
}
function copyToClipboard(elem) {
// create hidden text element,if it doesn't already exist
var targetId = "_hiddencopyText_";
var isInput = elem.tagName === "INPUT" || elem.tagName === "TEXTAREA";
var origSelectionStart,origSelectionEnd;
if (isInput) {
// can just use the original source element for the selection and copy
target = elem;
origSelectionStart = elem.selectionStart;
origSelectionEnd = elem.selectionEnd;
} else {
// must use a temporary form element for the selection and copy
target = document.getElementById(targetId);
if (!target) {
var target = document.createElement("textarea");
target.style.position = "absolute";
target.style.left = "-9999px";
target.style.top = "0";
target.id = targetId;
document.body.appendChild(target);
}
target.textContent = elem.textContent;
}
// select the content
var currentFocus = document.activeElement;
target.focus();
target.setSelectionRange(0,target.value.length);
// copy the selection
var succeed;
try {
succeed = document.execCommand("copy");
} catch (e) {
succeed = false;
}
// restore original focus
if (currentFocus && typeof currentFocus.focus === "function") {
currentFocus.focus();
}
if (isInput) {
// restore prior selection
elem.setSelectionRange(origSelectionStart,origSelectionEnd);
} else {
// clear temporary content
target.textContent = "";
}
return succeed;
}
</script>
<?PHP
}
?>
解决方法
很抱歉回答我自己的问题,但是我有一个很严格的截止日期。 这是一个要对着麦克风讲话的示例句子。 “这是一个很棒的时间点” 解决方案分为两个部分:
- 对点字符说“点”。
- 遍历替代的最终结果以找到单词“ period”并使用该替代。 (返回“这是一段美好的时光。”)
以下是带有替代最终结果迭代的清理代码(注意:该文件必须具有“ .PHP”扩展名!它将无法与HTML扩展名一起使用”),我使用了文件名chrome-speech- to-text.php
<html>
<head>
<meta charset="utf-8">
<title>Simple Speech to Text</title>
</head>
<body>
<div style="margin-bottom:50px">
<div style="width:100%">
<textarea name="q" id="transcript" rows="15" style="width:100% !important;"></textarea>
</div>
<div style="margin-top: 20px;margin-left: 10px;float:left;">
<a id="copy_dictation" onclick="speakcopy();" style="padding: 6px 11px;background-color:#2111c4;cursor:pointer;color:#fff;margin-top:10px;border-radius:5px;"> Copy</a>
</div>
<div style="margin-top: 20px;margin-left: 10px;float:left;">
<a id="clear_dictation" onclick="speakclear()" style="padding: 6px 11px;background-color:#e5225c;cursor:pointer;color:#fff;margin-top:10px;border-radius:5px;"> Clear</a>
</div>
</div>
<script>
startDictation()
function startDictation() {
var recognition = new webkitSpeechRecognition();
console.log(recognition);
recognition.continuous = true;
recognition.interimResults = true;
recognition.lang = "en";
recognition.maxAlternatives = 10;
recognition.onend = function(e) {
//console.log('ended');
var textarea = document.getElementById('transcript');
if (textarea.value != '') {
textarea.value = textarea.value.trim();
textarea.value += ' ';
}
recognition.start();
}
recognition.onresult = function(e) {
//console.log(e); // DO NOT UNCOMMENT ELSE ENDLESS LOOP
//e.results[0][0].forEach(iterate);
var textarea = document.getElementById('transcript');
var finalText = '';
for (var i = e.resultIndex; i < e.results.length; ++i) {
if (e.results[i].isFinal) {
var alternatePeriod = searchForAlternative(e.results[i],'period');
if (alternatePeriod != '') {
textarea.value += alternatePeriod;
} else {
textarea.value += e.results[i][0].transcript;
}
}
}
}
// start listening
recognition.start();
}
function searchForAlternative(resultItem,searchString) {
for (var i = 0; i < resultItem.length; ++i) {
//console.log(resultItem[i].transcript);
if (resultItem[i].transcript.includes(searchString)) {
//console.log(resultItem[i].transcript);
return (resultItem[i].transcript);;
}
}
return ('');
}
function speakcopy() {
var recognition = new webkitSpeechRecognition();
recognition.stop();
copyToClipboard(document.getElementById("transcript"));
}
function speakclear() {
var recognition = new webkitSpeechRecognition();
recognition.stop();
document.getElementById("transcript").value = "";
}
function copyToClipboard(elem) {
// create hidden text element,if it doesn't already exist
var targetId = "_hiddenCopyText_";
var isInput = elem.tagName === "INPUT" || elem.tagName === "TEXTAREA";
var origSelectionStart,origSelectionEnd;
if (isInput) {
// can just use the original source element for the selection and copy
target = elem;
origSelectionStart = elem.selectionStart;
origSelectionEnd = elem.selectionEnd;
} else {
// must use a temporary form element for the selection and copy
target = document.getElementById(targetId);
if (!target) {
var target = document.createElement("textarea");
target.style.position = "absolute";
target.style.left = "-9999px";
target.style.top = "0";
target.id = targetId;
document.body.appendChild(target);
}
target.textContent = elem.textContent;
}
// select the content
var currentFocus = document.activeElement;
target.focus();
target.setSelectionRange(0,target.value.length);
// copy the selection
var succeed;
try {
succeed = document.execCommand("copy");
} catch (e) {
succeed = false;
}
// restore original focus
if (currentFocus && typeof currentFocus.focus === "function") {
currentFocus.focus();
}
if (isInput) {
// restore prior selection
elem.setSelectionRange(origSelectionStart,origSelectionEnd);
} else {
// clear temporary content
target.textContent = "";
}
return succeed;
}
</script>
</body>
</html>