Question

我是网络开发的新手，我正在尝试使用Web Speech API开发一个简单的语音驱动的Web应用程序。我使用this简单教程来学习语音驱动应用程序的基础知识。

这是我作为一个简单的开始编写的代码。

<!DOCTYPE html>
<html>
  <head>    
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">
    </script>
    <script>        
       var recognition = new webkitSpeechRecognition();
       recognition.continuous = true;
       recognition.onresult = function(event) {
           alert("onresult even handler");
       }
       function startButton(event) {
          recognition.start();
       }
    </script>
  </head>
  <body>
    <div id = "text">
      <button id="start_button" onclick="startButton(event)">
        start
      </button>
    </div>
  </body>
</html>

但是当我在谷歌浏览器浏览器中打开我的html页面并点击开始时，这就是我所看到的：

enter image description here

当我点击交叉相机图标时，我会看到以下内容：

enter image description here

即使我选择＆＃34;询问是否文件 - 想要访问您的相机和麦克风＆＃34;选项并重新加载页面同样的事情重演。

当我对此进行更多研究时，我发现谷歌浏览器只允许安全网站（即https：//）访问您的相机和麦克风。如果它不是https，则chrome会在不询问用户的情况下阻止它。但我无法理解为什么我的本地文件被阻止使用麦克风。任何人都可以帮助我。提前谢谢。

Answer 1

您需要在服务器上部署HTML项目。您可以通过在任何localhost服务器上部署它来实现。

除非在服务器上部署，否则与媒体相关的HTML文件无法正常工作。

Answer 2

WebSpeechAPI仅适用于通过https：//或http：// NOT file：///

处理的文件

您需要一个您可以访问的网络服务器/存储文件的位置。

如果您没有可用的网络服务器，您可以使用Google天空作为网络服务器/托管您的index.html（名称必须是index.html）以及所有javascript和css内容： https://googledrive.com/host/0B716ywBKT84AMXBENXlnYmJISlE/GoogleDriveHosting.html

Answer 3

我可能有一个解决方案：

1. 进入谷歌浏览器设置
2。点击高级设置
3。点击显示高级设置 4. 在“隐私”下点击内容设置
5. ：转到媒体部分（靠近底部），然后点击“允许所有网站在我的计算机上使用插件”

真的希望这有帮助！

如果您需要额外帮助，请查看此link以获取更多信息。

使用Web语音API开发简单的语音驱动Web应用程序

3 个答案: