🎈 perf(app): audio base64 to blob

s045pd · Dec 25, 2024 · 15daab3 · 15daab3
1 parent e1f3237
commit 15daab3
Showing 1 changed file with 19 additions and 7 deletions.
diff --git a/gui/src/components/DataRecording.vue b/gui/src/components/DataRecording.vue
@@ -129,14 +129,26 @@ export default {
           startDate: this.dateRange.startDate,
           endDate: this.dateRange.endDate,
         });
-        this.info = response.recordings.map(item => ({
-          audioType: this.checkAudioType(item.recording),
-          data: `data:${this.checkAudioType(item.recording)};base64,${item.recording}`,
-          date: convertToCurrentTimeZone(new Date(item.createdAt))
-        }));
-        console.log(response,this.info);
+        this.info = response.recordings.map(item => {
+          // Convert base64 to Blob
+          const audioType = this.checkAudioType(item.recording);
+          const binaryString = atob(item.recording);
+          const bytes = new Uint8Array(binaryString.length);
+          for (let i = 0; i < binaryString.length; i++) {
+            bytes[i] = binaryString.charCodeAt(i);
+          }
+          const blob = new Blob([bytes], { type: audioType });
+          const blobUrl = URL.createObjectURL(blob);
+
+          return {
+            audioType,
+            data: blobUrl,
+            date: convertToCurrentTimeZone(new Date(item.createdAt))
+          };
+        });
+        console.log(response, this.info);
         this.totalRows = response.pagination.total;
-    } catch (error) {
+      } catch (error) {
         console.error('Error fetching recordings:', error);
       }
     },