0

Je développe une application utilisant Java Web avec JSF et souhaite intégrer l'API Speech en utilisant JavaScript. Ce que j'ai fait était d'insérer le fichier 'speech.1.0.0.js' dans mon application et j'ai utilisé le 'index.html' pour tester (informé la clé et SubscriptionId), mais rien ne se passe. J'ai oublié de faire quelque chose?Java Web intégré avec l'API Bing Speech

C'est le code source de la page:

<?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

Vous devez être plus précis sur ce que vous voulez dire " Rien ne se passe". Avez-vous chargé la page dans le navigateur ou quoi? Qu'y a-t-il quelque chose dans le journal de la console javascript? –

+0

Nikolay, c'est le problème. Il n'y a aucun message généré sur la console. Sélectionnez l'option pour capturer la parole par le microphone et lorsque je clique sur le bouton 'Démarrer', mon discours n'est pas converti en texte. Le bouton 'Démarrer' appelle un tmethod JavaScript pour commencer à capturer la parole et la convertir en texte –

+0

La démo ici https://www.microsoft.com/cognitive-services/en-us/speech-api fonctionne-t-elle pour vous? Quel navigateur utilisez-vous? –

Répondre

0

Je résolu le problème en réglant l'importation en javascript parce que j'utlizando JSF

<h:outputScript target="head" library="js" name="speech.1.0.0.js" /> 
<h:outputScript target="head" library="js" name="microsoft.js" />