Uniapp verwendet Baidu Voice, um die Funktion zum Konvertieren von Aufnahmen in Text zu realisieren

Uniapp verwendet Baidu Voice, um die Funktion zum Konvertieren von Aufnahmen in Text zu realisieren

Nach drei Tagen voller Schwierigkeiten habe ich diese Funktion endlich realisiert. Ich habe viele Artikel im Internet gelesen, bevor ich eine Methode gefunden habe, die normal implementiert werden kann. Die im Internet gefundenen Beispiele haben nicht funktioniert. Ich glaube, viele Leute sind hier verwirrt. Um diese Situation für andere zu vermeiden, teile ich meinen Code, der absolut verwendbar ist, einschließlich des Uniapp-Frontends, das RecorderManager verwendet, und des Java-Ends, das Baidu Voice to Text aufruft. Ich glaube, viele Leute brauchen, was ich geschrieben habe. Ich habe es nur auf Android-Telefonen getestet, HTML5 + darin

Verwenden Sie nicht die Methode plus.speech. Sie ist nicht einfach zu verwenden. Wenn Sie die Spracherkennung von Baidu aufrufen, wird in der Verwaltungskonsole von Baidu ein Fehler angezeigt, dass der Parameter dev_id nicht übergeben wird. Sie können nicht finden, wo Sie diesen Parameter hinzufügen können, daher müssen Sie ihn in der App-Modulkonfiguration des aktuellen Projekts in hbuildx nicht auswählen.

1. Ein sehr wichtiger Schritt besteht darin, die Berechtigung android.permission.RECORD_AUDIO in manifest.json hinzuzufügen. Unabhängig davon, ob Sie auf einem realen Gerät debuggen oder eine benutzerdefinierte Basis verwenden möchten, müssen Sie es online verpacken, um diese Berechtigung in die Basis aufzunehmen. Anschließend müssen Sie in der Anwendungsverwaltung der aktuellen App im Mobiltelefonsystem die Aufnahmeberechtigung sehen.

2. Um mit dem RecorderManager die Seite aufrufen zu können, auf der die Aufnahmefunktion genutzt werden soll, und nachfragen zu können, ob eine solche Aufnahmeberechtigung erteilt werden soll, müssen Sie vor der Nutzung des RecorderManagers eine Hardware-Berechtigungsanwendung aufrufen. Auf dem Plug-in-Markt gibt es ein JS mit dem Namen https://ext.dcloud.net.cn/plugin?id=594. Diese Adresse dient zur Beurteilung und Eingabeaufforderung von App-Berechtigungen. Sie wird verwendet, um mithilfe der Funktion von native.js eine bestimmte Hardwareberechtigung zu beurteilen oder zu beantragen. Nachdem dieses Plug-In in das Projekt eingeführt wurde, befindet es sich in einem Ordner namens js_sdk im aktuellen Projektverzeichnis. Es wird eine Datei permission.js im Ordner wa-permission geben.

3. Verwandter Code

Uniapp-Code

  <Klasse anzeigen="Popup-Inhalt" >  
                    <Ansicht>{{msg}}</Ansicht>  
                    <view>Sie sprechen von {{voicetext}}</view>  
                    <button class="uni-btn" type="warn" @touchstart="startvoice" @touchend="endvoice">Zum Stoppen drücken und loslassen</button>  
                    <button class="uni-btn" type="warn" @tap="playvoice" >Aufnahme abspielen</button>  
    </Ansicht>  
<Skript>  
Berechtigung importieren aus "@/js_sdk/wa-permission/permission.js"  
    const recorderManager = uni.getRecorderManager();  
    const innerAudioContext = uni.createInnerAudioContext();  
Standard exportieren {  
     Daten() {  
    zurückkehren {  
            Sprachtext:"",  
        Nachricht:"",  
        Sprachpfad:""  
       }  
   },  
  beim Laden() {  
      dies.initaudio()  
 
   },  
Methoden: {  
   asynchron initaudio(){  
                           //Beachten Sie, dass dies „await“ sein muss, da dies ein asynchrones Ereignis auslöst. Das Dialogfeld mit der Berechtigungsanforderung wird auf dem Telefon angezeigt und Sie können erst nach der Verarbeitung mit dem nächsten Aufnahmeschritt fortfahren. let recordauth = await permision.requestAndroidPermission("android.permission.RECORD_AUDIO")  
                 console.log("Beurteilen, ob eine Aufzeichnungsberechtigung vorliegt>>>>>"+recordauth)  
                  wenn(recordauth==1){  
                               recorderManager.onStart((res)=>{  
                                        console.log("Aufzeichnung starten>>>>>>>>...")  
                                    });  
                               recorderManager.onStop((res)=>{  
                                    Konsole.log("Recorderstop....res.tempFilePath>>>"+res.tempFilePath)  
                                    dieser.voicepath = res.tempFilePath  
                                    dies.uploadvoicefile()  
                                    //Verwenden Sie uni.uploadFile zum Hochladen auf den Server, dieses Mal im MP3-Format});  
 
                                recorderManager.onError( (res)=> {  
 
                                 console.log('beiFehler'+JSON.stringify(res));  
                                });  
                  }   
            }, //initaudio-Methode endet startvoice(){  
                console.log("Aufnahme starten")  
                recorderManager.start({  
                    Format: "mp3",  
                    sampleRate: 16000 // Dieser Parameter muss im Hintergrund festgelegt werden, sonst funktioniert die Baidu-Spracherkennung nicht});  
         },  
        EndeStimme(){  
 
              console.log("Aufzeichnung beenden")  
              //Beachten Sie, dass zur Vermeidung des API-Fehlers, der durch eine zu kurze Sprechzeit verursacht wird, einige Verzögerungen hinzugefügt werden sollten setTimeout(()=>{  
                recorderManager.stop()  
             },1000)  
 
            },  
            Stimme abspielen(){  
                console.log("Klicken Sie auf "Playvoice")  
                wenn (dieser.Voicepath) {  
                    console.log("Ton abspielen")  
                    innerAudioContext.src = dieser.voicepath;  
                    innerAudioContext.play();  
                }  
            },  
            Sprachdatei hochladen(){  
                // this.msg = "Dateipfad des Java-Dienstes aufrufen" + this.voicepath  
                 uni.uploadFile({  
                URL: „http://ip:port/uploadFile (Name der Java-End-Empfangsdateischnittstelle)“,   
                filePath: this.voicepath, //Der temporäre Pfad, der nach Abschluss der Aufnahme zurückgegeben wird,  
                Name: "Datei",  
                formData: {  
                   dev_id:1537 // Chinesisch mit Satzzeichen},  
                Erfolg: (uploadFileRes) => {  
                    let word = uploadFileRes.data  
                    console.log("Audio erfolgreich hochgeladen"+word);  
                },  
                fehlgeschlagen: (res) => {  
 
                    console.log("Audio konnte nicht hochgeladen werden"+JSON.stringify(res));  
                }  
                });  
            }  
    }  
}  
</script> ```   
 //Beachten Sie, dass die IP im URL-Attribut von uploadFile nicht localhost oder 127 sein kann. Wenn Sie den Java-Dienst auf Ihrem eigenen Computer starten, muss es die echte IP des lokalen Computers sein, z. B. 192.xxx, oder ein Domänenname, und die Java-Schnittstelle muss domänenübergreifend sein. Viele Leute bleiben bei dieser IP hängen, und es ist schwierig für mich, im Internet einen Beitrag zu finden, der das Problem löst. Beachten Sie, dass der Pfad filePath der Pfad ist, der mit _doc beginnt und durch das Ereignis onStop von recorderManager erhalten wurde. Es ist nicht erforderlich, eine Datei hinzuzufügen:, nicht wie einige Leute im Internet sagen, dass man so etwas hinzufügen soll.

Java-Seite

Zwei Pakete müssen in pom referenziert werden

            <Abhängigkeit>  
            <groupId>com.baidu.aip</groupId>  
            <artifactId>java-sdk</artifactId>  
            <version>4.16.3</version>  
        </Abhängigkeit>  
 
        <Abhängigkeit>  
            <groupId>com.googlecode.soundlibs</groupId>  
            <artifactId>mp3spi</artifactId>  
            <version>1.9.5.4</version>  
        </Abhängigkeit>  
 
 ```importieren Sie com.baidu.aip.speech.AipSpeech;  
importiere javazoom.spi.mpeg.sampled.file.MpegAudioFileReader;  
importiere org.apache.commons.io.IOUtils;  
importiere org.json.JSONArray;  
importiere org.json.JSONObject;  
 
importiere org.springframework.web.bind.annotation.*;  
importiere org.springframework.web.multipart.MultipartFile;  
 
importiere javax.sound.sampled.AudioFormat;  
importiere javax.sound.sampled.AudioInputStream;  
importiere javax.sound.sampled.AudioSystem;  
importiere java.io.IOException;  
importiere java.io.InputStream;  
importiere java.util.HashMap;  
 
@RestController  
@CrossOrigin(Ursprünge = "*")  
öffentliche Klasse BaiduSpeech {  
    //APPID/AK/SK festlegen  
    public static final String APP_ID = ""; //Gehe zur Baidu-Sprachdienstanwendung public static final String API_KEY = ""; //Gehe zur Baidu-Sprachdienstanwendung public static final String SECRET_KEY = ""; //Gehe zur Baidu-Sprachdienstanwendung @RequestMapping(value = "/uploadFile")  
    öffentliche String uploadFile( @RequestParam("dev_id") int dev_id, @RequestParam("file") MultipartFile Datei) wirft Exception {  
        byte[] pcmbytedata = mp3Convert2pcm(file.getInputStream());  
        HashMap<String,Objekt> Optionen = neues HashMap<String,Objekt>();  
        Optionen.put("dev_pid",dev_id);//  
        JSONObject jsonfrombaidu = basicBydata(pcmbytedata,"pcm",Optionen);  
        JSONArray jsonArray = jsonfrombaidu.getJSONArray("Ergebnis");  
        String-Ergebnis = jsonArray.getString(0);  
        System.out.println(Ergebnis); //Das Ergebnis der Analyse return result;  
    }  
    // Holen Sie sich das AipSpeech-Objekt. Es wird empfohlen, eine einzelne Instanz zu verwenden. public static AipSpeech getClient() {  
        AipSpeech-Client = neues AipSpeech (APP_ID, API_KEY, SECRET_KEY);  
        // Optional: Netzwerkverbindungsparameter festlegen client.setConnectionTimeoutInMillis(2000);  
        client.setSocketTimeoutInMillis(60000);  
        wiederkehrender Kunde;  
    }  
 
    // Spracherkennung (aus Datei)  
    öffentliches statisches JSONObject basicBydata(byte[] voicedata, String fileType,HashMap<String,Object> options) {  
        AipSpeech-Client = getClient();  
 
        return client.asr(Sprachdaten, Dateityp, 16000, Optionen);  
    }  
    /**  
     * MP3 in PCM konvertieren  
     * @param inputStream MP3-Eingabestream * @throws Exception  
     */  
    öffentliches statisches Byte[] mp3Convert2pcm(InputStream inputStream) löst Ausnahme aus {  
        //PCM-AudioInputStream-Daten konvertieren AudioInputStream audioInputStream = getPcmAudioInputStream(inputStream);  
        byte[] pcmBytes = IOUtils.toByteArray(audioInputStream);  
        pcmBytes zurückgeben;  
    }  
 
    /**  
     * PCM AudioInputStream-Daten abrufen * @param inputStream MP3-Eingabestream * @return AudioInputStream PCM-Eingabestream */  
    privater statischer AudioInputStream getPcmAudioInputStream(InputStream inputStream) {  
        AudioInputStream audioInputStream = null;  
        AudioFormat Zielformat = null;  
        versuchen {  
            AudioInputStream in = null;  
            MpegAudioFileReader mp = neuer MpegAudioFileReader();  
            in = mp.getAudioInputStream(inputStream);  
            AudioFormat baseFormat = in.getFormat();  
            Zielformat = neues Audioformat (Audioformat.Encoding.PCM_SIGNED, Basisformat.getSampleRate(), 16,  
                    baseFormat.getChannels(), baseFormat.getChannels() * 2, baseFormat.getSampleRate(), false);  
            audioInputStream = AudioSystem.getAudioInputStream(targetFormat, in);  
        } Fang (Ausnahme e) {  
            e.printStackTrace();  
        }  
        AudioInputStream zurückgeben;  
    }  
 
} ```

Dies ist das Ende dieses Artikels über den Aufruf von Baidu Voice durch Uniapp, um die Funktion „Aufnahme in Text“ zu realisieren. Weitere relevante Inhalte zu Uniapps „Aufnahme in Text“ finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass alle 123WORDPRESS.COM in Zukunft unterstützen werden!

Das könnte Sie auch interessieren:
  • Uniapp implementiert Beispielcode für die Anmeldung mit DingTalk-Scancode
  • uniapp implementiert Datums- und Zeitauswahl
  • Vue Uniapp realisiert den Segmentierungseffekt
  • Uniapp realisiert gleitenden Scoring-Effekt
  • uniapp realisiert die Aufnahme-Upload-Funktion
  • Uniapp implementiert verschiebbare Tabs

<<:  So implementieren Sie Eingabe-Checkboxen zur Erweiterung der Klickreichweite

>>:  Bedeutung der Hintergrundfarbdeklaration beim Schreiben von Stilen

Artikel empfehlen

Drei Möglichkeiten zum Kopieren von MySQL-Tabellen (Zusammenfassung)

Tabellenstruktur und deren Daten kopieren Die fol...

So funktionieren React Hooks

Inhaltsverzeichnis 1. React Hooks vs. reine Funkt...

So erstellen Sie einen SVN-Server unter Linux

1: SVN installieren yum install -y Subversion 2. ...

CSS3 zum Erreichen eines Menü-Hover-Effekts

Ergebnis: html <nav id="nav-1"> &...

Strategie zur Optimierung der Leistung von MySQL-Datenbankabfragen

Optimieren von Abfragen Verwenden der Explain-Anw...

Vue implementiert eine einfache Slider-Verifizierung

Dieses Artikelbeispiel zeigt die Implementierung ...

Schritte zum Wiederherstellen von Code aus einem Docker-Container-Image

Manchmal geht der Code verloren und Sie müssen de...

HTML-Sonderzeichen-Konvertierungstabelle

Charakter Dezimal Zeichennummer Entitätsname --- ...

Tutorial zum Erstellen eines Zookeeper-Servers unter Windows

Installation und Konfiguration Die offizielle Web...

Detaillierte Analyse des HTTP-Statuscodes 502 des Dienstes nginx+php-fpm

Bei einem unserer Webprojekte ist aufgrund der Zu...

MySQL 5.6.23 Installations- und Konfigurations-Umgebungsvariablen-Tutorial

In diesem Artikel finden Sie das Installations- u...

Der vollständige Code der im Uniapp-Applet enthaltenen Radardiagrammkomponente

Effektbild: Der Implementierungscode lautet wie f...