uni-app Einführung uni-app ist ein Front-End-Framework zur Entwicklung plattformübergreifender Anwendungen mit Vue.js. HTML-TeilIch habe ein Aufnahmebild geschrieben, bei dem beim Klicken eine Popup-Ebene angezeigt wird (im Stil von QQ). Ich werde nicht näher auf den Schreibstil eingehen, den kennt jeder. js-TeilDas ist der springende Punkt!!! Erstellen einer InstanzUm das Gesamtbild zu erhalten, können Sie die Aufnahme jederzeit starten und stoppen. Ich habe es in das Gesamtbild eingefügt. const recorderManager = uni.getRecorderManager();//Eine Aufnahmeinstanz erstellen const innerAudioContext = uni.createInnerAudioContext();//Instanz, die für die Wiedergabe verwendet wird // Um zu verhindern, dass das iPhone stummgeschaltet wird und nicht abgespielt werden kann uni.setInnerAudioOption({ obeyMuteSwitch: false }) innerAudioContext.autoplay = true; Standard exportieren { Aufnahme startenthis.timecount = '00:00:00'; //Aufnahmezeit initialisieren this.hour = 0; diese.Minute = 0; diese.Sekunde = 0; this.getTimeIntervalplus(); //Einen Timer einkapseln, aufrufen um die Zeitmessung zu starten const options = { //Parameter Dauer: 600000, Beispielrate: 44100, Anzahl der Kanäle: 1, encodeBitRate: 192000, Format: 'mp3', Rahmengröße: 50 } recorderManager.start(Optionen); Aufzeichnung beendenOb Sie die Mindestdauer begrenzen müssen, können Sie selbst entscheiden. Ich habe es hier nicht geschrieben. recorderManager.stop(); //Aufnahme beenden clearInterval(this.timer); //Zeitmessung beenden Aufnahme abspieleninnerAudioContext.src = this.voicePath; //Wiedergabeadresse (lokale Adresse, die oben aufgezeichnet wurde) innerAudioContext.play();//abspielen Wiedergabe pausiereninnerAudioContext.pause();//Wiedergabe pausieren clearInterval(this.timer);//Timer löschen Aufnahmen an das Backend übermitteln//Aufnahme beenden und Aufnahme übermitteln submitrecord: function() { this.count += 1; //Dies definiert eine globale Variable, um mehrere Übermittlungen zu verhindern, if (this.count == 1){ Konsole.log(dieser.Anzahl); var https = getApp().globalData.https; wenn (diese.aufgezeichneteNummer == 2) { diese.aufgezeichneteNummer = 3; recorderManager.stop(); : ClearInterval(dieser.Timer); } wenn (dieser.voicePath != '') { Konsole.log(dieser.voicePath); uni.uploadFile({ URL: https + 'Uploads/uploadVoiceVideo', Dateipfad: dieser.Sprachpfad, Name: "Datei", Erfolg: (res) => { dies.Anzahl = 0; //Initialisierung this.initialize()//Ich habe eine Funktion zum Initialisieren des Timers gekapselt this.timer = this.timecount; diese.show_recording = falsch; var Daten = JSON.parse(res.data); if (this.current == 0) {//Beurteilen, in welcher Spalte der Ton aufgezeichnet ist, und wieder einfügen this.firsvideo.push(data.address); } sonst wenn (dieser.aktuell == 1) { this.secovideo.push(Daten.Adresse); Konsole.log(dieses.secovideo); } sonst wenn (dieser.aktuell == 2) { this.thrivideo.push(Daten.Adresse); } uni.showToast({ Titel: „Übermittlung erfolgreich!“, Symbol: „keine“, Dauer: 1200 }) }, fehlgeschlagen: (Fehler) => { uni.hideLoading(); uni.showToast({ Titel: „Hochladen fehlgeschlagen~“, Symbol: „keine“, Dauer: 1200 }) zurückkehren } }); } anders { console.log("Aufzeichnung fehlgeschlagen") uni.showToast({ Titel: 'Aufnahme fehlgeschlagen', Symbol: „keine“, Dauer: 1200 }) uni.hideLoading(); diese.show_recording = falsch; dies.checkPermission() dies.rerecord() } } anders { uni.showToast({ Titel: 'Bitte nicht mehrfach absenden', Symbol: „keine“, Dauer: 2000 }) dies.Anzahl=0; } }, Neuaufnahme//Neu aufzeichnen neu aufzeichnen: function() { //Initialisiere den Timer this.initialize() this.getTimeIntervalplus();//Zeitmessung starten const options = { Dauer: 600000, Beispielrate: 44100, Anzahl der Kanäle: 1, encodeBitRate: 192000, Format: 'mp3', Rahmengröße: 50 } recorderManager.start(Optionen);//Aufnahme starten }, onLoad-Teilbeim Laden(Option) { var Terminnachricht = Option.Terminnachricht; Terminnachricht = JSON.parse(Terminnachricht); this.appointment_message = Terminnachricht; lass das = dies; recorderManager.onStop(Funktion(res) { console.log('Rekorder stoppen' + JSON.stringify(res)); that.voiceDuration = res.duration; that.voicePath = res.tempFilePath; konsole.log(res); }); }, Timer// Timer-Inkrement getTimeIntervalplus() { : ClearInterval(dieser.Timer); dieser.timer = setzeInterval(() => { diese.Sekunde += 1; wenn (diese.Sekunde >= 60) { diese.minute += 1; diese.Sekunde = 0; } wenn (diese.Minute >= 10) { diese.aufgezeichneteNummer = 3; recorderManager.stop(); : ClearInterval(dieser.Timer); } diese.Sekunde2 = diese.Sekunde; diese.Minute2 = diese.Minute; this.timecount = this.showNum(this.hour) + ":" + this.showNum(this.minute) + ":" + this .showNum(diese.Sekunde); - console.log("dieser.Zeitzähler", dieser.Zeitzähler) }, 1000); }, Abschnitt „Daten“Daten() { zurückkehren { Aktion: 'https://yl.letter-song.top/api/Uploads/uploadPicture', //Bildadresse hochladen textareavalue: '', //Textbeschreibungswert fileList2: [], //Bildpfad 2 zurückgeben fileList3: [], //Gibt Bildpfad 3 zurück fileList: [], //Bildpfad 1 zurückgeben firsvideo: [], //Aufnahmepfad 1 secovideo: [], //Aufnahmepfad 2 thrivideo: [], //Aufnahmepfad 3 appointment_message: '', //Termininformationen von der vorherigen Seite weitergegeben list: [{ //Name der Beschriftungstabelle: 'Frühere Symptome' }, { Name: „Neueste Symptome“ }, { Name: 'Dieses Symptom', }], aktuell: 0, //ausgewähltes Element sty: { //Schiebereglerstilhöhe: '4px', Rahmenradius: '2rpx', borderTopLeftRadius: '10px', Hintergrundfarbe: '#3ECEB5' }, activeItem: { //Ausgewählte Elementstilfarbe: '#333333', Schriftgröße: '600', Schriftgröße: '36rpx', }, show_recording: false, //Aufnahme-Popup-Fenster aufrufen recordednum: 1, //1: Ausgangszustand 2. Aufnahmezustand 3 Ende voicePath: '', //Dieser Audio-Aufnahmepfad voiceDuration: '', Zeitzählung: '00:00:00', timecount2: "", Stunde: 0, Minute: 0, Sekunde: 0, Stunde2: 0, Minute2: 0, Sekunde2: 0, isZant: falsch, Timer: '', yuming: 'Dies ist der Domänenname', Permiss: 0, //0 bedeutet Aufnahmeerlaubnis aktivieren, 1 bedeutet Aufnahmeerlaubnis aktivieren, Anzahl: 0 } }, Dies ist das Ende dieses Artikels über die Aufnahme-Upload-Funktion von Uniapp. Weitere relevante Inhalte zum Aufnahme-Upload von Uniapp finden Sie in den vorherigen Artikeln von 123WORDPRESS.COM oder in den folgenden verwandten Artikeln. Ich hoffe, dass jeder 123WORDPRESS.COM in Zukunft unterstützen wird! Das könnte Sie auch interessieren:
|
<<: MySQL- und SQLYog-Installationstutorial mit Bildern und Text
>>: Analyse des Prozesses zur Konfiguration des Alibaba Cloud-Proxy-Warehouses basierend auf Nexus
Baidu Cloud-Festplatte: Link: https://pan.baidu.c...
In diesem Artikelbeispiel wird der spezifische Co...
Zunächst einmal spielt der Blogger die Community-...
Inhaltsverzeichnis 1. Lernen Sie, je nach Anforde...
1.MySQL-Version [root@clq-System]# mysql -v Willk...
Fragen Sie zuerst die MySQL-Quelle ab Docker-Such...
Es wird empfohlen, Breite, Höhe etc. nicht direkt ...
JavaScript veröffentlicht mittlerweile jedes Jahr...
In diesem Artikel wird der spezifische Code von j...
Vorwort In Datenbanken wie Oracle und SQL Server ...
mktemp Erstellen Sie auf sichere Weise temporäre ...
<html> <Kopf> <meta http-equiv=&quo...
Bei der Web-Frontend-Entwicklung ist es unvermeidl...
1. Grundlinien 2. Spezialeffekte (die Effekte sin...
Die Lösung für das Problem, dass MySQL keine Verb...