0

我开始开发一个涉及文本到语音的网络应用程序。使用从 youtube 用户 Wes Bos 那里学到的技术，每次单击按钮时，我的代码都会通过 Google 的英文文本转语音 API（字面意思是将其粘贴到 URL 并返回音频）传递一个随机数。

<!DOCTYPE html>
<html lang="en">
   <head>
       <meta charset="UTF-8">
       <title>SujiQ Dev.0</title>
       
 
   </head>
   
<body>

   <!--text display/button -->

        <p>generate random number</p>
  <div id="output1"></div>
  <button id="btn1" onclick="outText()">Random number</button>
 
 <!--Hidden audio player -->

        <audio src="" class="speech" hidden></audio>

<!--jQuery lib-->
       <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
 
<!--read number out loud each button click -->

       <script> 

/*displays random number-of-the-moment; called on button click */

  function outText() {
  

  var randNum = Math.round(Math.exp(Math.random()*Math.log(10000000-0+1))); /*that's more like it*/

  document.getElementById("output1").innerHTML = randNum;

/* play audio of random number */

  $(function(){
        $("button#btn1").on("click",function(e){
          e.preventDefault();
          
          
          var url = "https://translate.google.com/translate_tts?ie=UTF-8&q=" + randNum + "&tl=en";

          $(".speech").attr("src", url).get(0).play();
 
 
        });
       });

  }
     
 
       </script>

 </body>
 
</html>

当在我的浏览器上本地运行时，此代码可以流畅地执行，但是当在我的 godaddy 提供的站点上托管完全相同的代码时，随机数生成器可以工作，但访问谷歌的语音 API 几乎总是失败，返回一个网络控制台错误，如下所示：“获取https://translate.google.com/translate_tts?ie=UTF-8&q=152&tl=en 404（未找到）”。有趣的是，一旦在一个非常蓝的月亮上，它会通过并大声读出数字。

是什么赋予了？我环顾四周，但我很困惑。

[[编辑]] 当作为堆栈溢出片段运行时，代码也无法大声读出数字

4

1 回答 1

1

这是一个付费 API。您需要在Google 开发者控制台上设置您的项目，然后您必须输入您的 CC 计费信息。完成后，打开 API 选项卡下的 API。

然后转到“凭据”。在右侧，单击“编辑设置”，在提供的框中，将 URL 添加到您将托管文件的域，例如“ http://mywebsite.com ”。不要将完整地址放入“ http://mywebsite.com/mypage.html ”之类的文件中。保存您的更改。

至于为什么您的文件在本地运行时有效，以下是我的测试文件的地址：

本地文件，在mac上运行

file:///Volumes/Macintosh%20HD/Users/DoDSoftware/Desktop/soundTest.html

本地文件，在 PC 上运行

file:///C:/Users/Flights%20Trainer/Desktop/soundTest.html

托管文件

http://affordable-glass.com/test/soundTest.html

你看到file:///前面的本地文件了吗？我猜想谷歌已经设置了 API 来允许所有来源，file:///因为他们知道这些将是本地文件而不是托管文件。这样，开发人员可以在与他们签订付款计划之前测试 api 并创建他们的应用程序。但是，他们当然会阻止来自托管站点的任何请求，这些请求不在他们的付费计划中。

在此处输入图像描述

于 2015-01-09T23:55:49.317 回答