0

Я разрабатываю приложение с использованием Java Web с JSF и хотел бы интегрировать Speech API с помощью JavaScript.Java Web интегрирован с Bing Speech API

Что я сделал, это вставить файл 'speech.1.0.0.js' в мое приложение и использовать 'index.html' для тестирования (проинформировал ключ и SubscriptionId), но ничего не происходит. Я забыл что-то сделать?

Это страница в исходный код:

<?xml version="1.0" encoding="UTF-8" ?> 
<html xmlns="http://www.w3.org/1999/xhtml"><head><link type="text/css" rel="stylesheet" href="/webraf/javax.faces.resource/theme.css.jsf?ln=primefaces-start" /><link type="text/css" rel="stylesheet" href="/webraf/javax.faces.resource/estilo.css.jsf?ln=css" /><link type="text/css" rel="stylesheet" href="/webraf/javax.faces.resource/primefaces.css.jsf?ln=primefaces&amp;v=5.3" /><script type="text/javascript" src="/webraf/javax.faces.resource/jquery/jquery.js.jsf?ln=primefaces&amp;v=5.3"></script><script type="text/javascript" src="/webraf/javax.faces.resource/jquery/jquery-plugins.js.jsf?ln=primefaces&amp;v=5.3"></script><script type="text/javascript" src="/webraf/javax.faces.resource/primefaces.js.jsf?ln=primefaces&amp;v=5.3"></script><script type="text/javascript">if(window.PrimeFaces){PrimeFaces.settings.projectStage='Development';}</script> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <title>Web RAF - LABI</title> 
    <style type="text/css"> 
<!-- 
#logotipo { 
    text-align: center; 
} 
--> 
</style></head><body> 
    <div id="container"> 
     <div id="logotipo"> 
      <!-- &lt;h:graphicImage library="imagens" name="logotipo_g.png" /&gt; --> 
     </div> 
     <div id="barra_menu"> 
    <!-- Menu --> 
<form id="j_idt12" name="j_idt12" method="post" action="/webraf/restrito/laudo_teste.jsf" enctype="application/x-www-form-urlencoded"> 
<input type="hidden" name="j_idt12" value="j_idt12" /> 

      <div id="menu"><span id="j_idt12:messages"></span><script id="j_idt12:messages_s" type="text/javascript">$(function(){PrimeFaces.cw('Growl','widget_j_idt12_messages',{id:'j_idt12:messages',sticky:false,life:6000,escape:true,msgs:[]});});</script><div id="j_idt12:j_idt14" class="ui-menu ui-menubar ui-widget ui-widget-content ui-corner-all ui-helper-clearfix" role="menubar"><div tabindex="0" class="ui-helper-hidden-accessible"></div><ul class="ui-menu-list ui-helper-reset"><li class="ui-widget ui-menuitem ui-corner-all ui-menu-parent" role="menuitem" aria-haspopup="true"><a href="#" class="ui-menuitem-link ui-submenu-link ui-corner-all" tabindex="-1"><span class="ui-menuitem-text">LAUDO MÉDICO</span><span class="ui-icon ui-icon-triangle-1-s"></span></a><ul class="ui-widget-content ui-menu-list ui-corner-all ui-helper-clearfix ui-menu-child ui-shadow" role="menu"><li class="ui-menuitem ui-widget ui-corner-all" role="menuitem"><a tabindex="-1" class="ui-menuitem-link ui-corner-all" href="/webraf/restrito/laudo.jsf"><span class="ui-menuitem-text">Gerar</span></a></li><li class="ui-separator ui-state-default"></li><li class="ui-menuitem ui-widget ui-corner-all" role="menuitem"><a tabindex="-1" class="ui-menuitem-link ui-corner-all" href="/webraf/restrito/laudo_editar.jsf"><span class="ui-menuitem-text">Editar</span></a></li><li class="ui-separator ui-state-default"></li><li class="ui-menuitem ui-widget ui-corner-all" role="menuitem"><a tabindex="-1" class="ui-menuitem-link ui-corner-all" href="/webraf/restrito/laudo_teste.jsf"><span class="ui-menuitem-text">Gerar Laudo (Teste)</span></a></li><li class="ui-separator ui-state-default"></li></ul></li><li class="ui-widget ui-menuitem ui-corner-all ui-menu-parent" role="menuitem" aria-haspopup="true"><a href="#" class="ui-menuitem-link ui-submenu-link ui-corner-all" tabindex="-1"><span class="ui-menuitem-text">CADASTRAR</span><span class="ui-icon ui-icon-triangle-1-s"></span></a><ul class="ui-widget-content ui-menu-list ui-corner-all ui-helper-clearfix ui-menu-child ui-shadow" role="menu"><li class="ui-menuitem ui-widget ui-corner-all" role="menuitem"><a tabindex="-1" class="ui-menuitem-link ui-corner-all" href="/webraf/restrito/profissional.jsf"><span class="ui-menuitem-text">Profissional</span></a></li><li class="ui-separator ui-state-default"></li><li class="ui-menuitem ui-widget ui-corner-all" role="menuitem"><a tabindex="-1" class="ui-menuitem-link ui-corner-all" href="/webraf/restrito/paciente.jsf"><span class="ui-menuitem-text">Paciente</span></a></li></ul></li><li class="ui-widget ui-menuitem ui-corner-all ui-menu-parent" role="menuitem" aria-haspopup="true"><a href="#" class="ui-menuitem-link ui-submenu-link ui-corner-all" tabindex="-1"><span class="ui-menuitem-text">CONFIGURAR</span><span class="ui-icon ui-icon-triangle-1-s"></span></a><ul class="ui-widget-content ui-menu-list ui-corner-all ui-helper-clearfix ui-menu-child ui-shadow" role="menu"><li class="ui-menuitem ui-widget ui-corner-all" role="menuitem"><a tabindex="-1" class="ui-menuitem-link ui-corner-all" href="#"><span class="ui-menuitem-text">SRAF</span></a></li></ul></li><li class="ui-menuitem ui-menubar-options ui-widget ui-corner-all" role="menuitem"> 
         <!-- &lt;p:inputText style="margin-right:10px" placeholder="Search"/&gt; --> 
         <!-- Administrador --> 
<script type="text/javascript" src="/webraf/javax.faces.resource/jsf.js.jsf?ln=javax.faces&amp;stage=Development"></script> 
<a href="#" title="Administrativo" onclick="mojarra.jsfcljs(document.getElementById('j_idt12'),{'j_idt12:j_idt29':'j_idt12:j_idt29'},'');return false"><img src="/webraf/javax.faces.resource/administrativo.png.jsf?ln=imagens" /></a> 
         <!-- Principal --><a href="#" title="Principal" onclick="mojarra.jsfcljs(document.getElementById('j_idt12'),{'j_idt12:j_idt32':'j_idt12:j_idt32'},'');return false"><img src="/webraf/javax.faces.resource/principal.png.jsf?ln=imagens" /></a> 
         <!-- Sair --> 
         <a onclick="document.location='/webraf/j_spring_security_logout'" title="Sair"><img src="/webraf/javax.faces.resource/logout.png.jsf?ln=imagens" /> 
         </a></li></ul></div><script id="j_idt12:j_idt14_s" type="text/javascript">PrimeFaces.cw("Menubar","widget_j_idt12_j_idt14",{id:"j_idt12:j_idt14",autoDisplay:true});</script> 
      </div><input type="hidden" name="javax.faces.ViewState" id="j_id1:javax.faces.ViewState:0" value="-3017596759583924659:90283694441848566" autocomplete="off" /> 
</form> 
     </div> 
     <div id="corpo"><head><link type="text/css" rel="stylesheet" href="/webraf/javax.faces.resource/theme.css.jsf?ln=primefaces-start" /><script type="text/javascript">if(window.PrimeFaces){PrimeFaces.settings.projectStage='Development';}</script> 
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />   
      <script src="/resources/js/speech.1.0.0.js" type="text/javascript"></script> 
      <script type="text/javascript"> 
     var client; 
     var request; 

     function useMic() { 
      return document.getElementById("useMic").checked; 
     } 

     function getMode() { 
      switch (document.getElementById("mode").value) { 
       case "longDictation": 
        return Microsoft.ProjectOxford.SpeechRecognition.SpeechRecognitionMode.longDictation; 
       default: 
        return Microsoft.ProjectOxford.SpeechRecognition.SpeechRecognitionMode.shortPhrase; 
      } 
     } 

     function getOxfordKey() { 
      return document.getElementById("oxfordkey").value; 
     } 

     function getLanguage() { 
      return "en-us"; 
     } 

     function clearText() { 
      document.getElementById("output").value = ""; 
     } 

     function setText(text) { 
      document.getElementById("output").value += text; 
     } 

     function getLuisConfig() { 
      var appid = document.getElementById("luis_appid").value; 
      var subid = document.getElementById("luis_subid").value; 

      if (appid.length > 0 <![CDATA[&&]]> subid.length > 0) { 
       return { appid: appid, subid: subid }; 
      } 

      return null; 
     } 

     function start() { 
      var mode = getMode(); 
      var luisCfg = getLuisConfig(); 

      clearText(); 

      if (useMic()) { 
       if (luisCfg) { 
        client = Microsoft.ProjectOxford.SpeechRecognition.SpeechRecognitionServiceFactory.createMicrophoneClientWithIntent(
         getLanguage(), 
         getOxfordKey(), 
         getOxfordKey(), 
         luisCfg.appid, 
         luisCfg.subid); 
       } else { 
        client = Microsoft.ProjectOxford.SpeechRecognition.SpeechRecognitionServiceFactory.createMicrophoneClient(
         mode, 
         getLanguage(), 
         getOxfordKey(), 
         getOxfordKey()); 
       } 
       client.startMicAndRecognition(); 
       setTimeout(function() { 
        client.endMicAndRecognition(); 
       }, 5000); 
      } else { 
       if (luisCfg) { 
        client = Microsoft.ProjectOxford.SpeechRecognition.SpeechRecognitionServiceFactory.createDataClientWithIntent(
         getLanguage(), 
         getOxfordKey(), 
         getOxfordKey(), 
         luisCfg.appid, 
         luisCfg.subid); 
       } else { 
        client = Microsoft.ProjectOxford.SpeechRecognition.SpeechRecognitionServiceFactory.createDataClient(
         mode, 
         getLanguage(), 
         getOxfordKey(), 
         getOxfordKey()); 
       } 
       request = new XMLHttpRequest(); 
       request.open(
        'GET', 
        (mode == Microsoft.ProjectOxford.SpeechRecognition.SpeechRecognitionMode.shortPhrase) ? "whatstheweatherlike.wav" : "batman.wav", 
        true); 
       request.responseType = 'arraybuffer'; 
       request.onload = function() { 
        if (request.status !== 200) { 
         setText("unable to receive audio file"); 
        } else { 
         client.sendAudio(request.response, request.response.length); 
        } 
       }; 

       request.send(); 
      } 

      client.onPartialResponseReceived = function (response) { 
       setText(response); 
      } 

      client.onFinalResponseReceived = function (response) { 
       setText(JSON.stringify(response)); 
      } 

      client.onIntentReceived = function (response) { 
       setText(response); 
      }; 
     }  
    </script></head> 
     <div align="right">Bem-vindo, thiago</div> 

      <table width="100%"> 
       <tr> 
        <td></td> 
        <td><h1>Speech.JS</h1> 
         <h2>Microsoft Cognitive Services</h2></td> 
       </tr> 
       <tr> 
        <td align="right"></td> 
        <td><input id="useMic" type="checkbox" />Use Microphone</td> 
       </tr> 
       <tr> 
        <td align="right">Mode:</td> 
        <td><select id="mode"> 
          <option selected="selected">shortPhrase</option> 
          <option>longDictation</option> 
        </select></td> 
       </tr> 
       <tr> 
        <td align="right"><A href="https://www.microsoft.com/cognitive-services/en-us/sign-up" target="_blank">Subscription</A>:</td> 
        <td><input id="oxfordkey" type="text" size="40" /></td> 
       </tr> 
       <tr> 
        <td align="right">LUIS AppId:</td> 
        <td><input id="luis_appid" type="text" size="40" /></td> 
       </tr> 
       <tr> 
        <td align="right">LUIS SubscriptionId:</td> 
        <td><input id="luis_subid" type="text" size="40" /></td> 
       </tr> 
       <tr> 
        <td></td> 
        <td><button onclick="start()">Start</button></td> 
       </tr> 
       <tr> 
        <td></td> 
        <td><textarea id="output" style="width: 400px; height: 200px"></textarea> 
        </td> 
       </tr> 

      </table> 
    </div></body> 
</html> 
+0

Вы должны быть более точным на то, что вы имеете в виду " Ничего не произошло". Загрузили ли вы страницу в браузере или что? Что там в журнале javascript? –

+0

Николай, в этом проблема. На консоли не создается никаких сообщений. Выберите способ захвата речи микрофоном, и когда я нажимаю кнопку «Старт», моя речь не преобразуется в текст. Кнопка «Пуск» вызывает метод JavaScript, чтобы начать захват речи и преобразование в текст –

+0

Есть ли здесь демо-версия https://www.microsoft.com/cognitive-services/en-us/speech-api? Какой браузер вы используете? –

ответ

0

Я решил проблему, регулируя импорт в JavaScript, потому что я utlizando JSF

<h:outputScript target="head" library="js" name="speech.1.0.0.js" /> 
<h:outputScript target="head" library="js" name="microsoft.js" /> 
Смежные вопросы