【问题标题】:How to covert audio file to base64 using plugins for ionic angular project如何使用离子角度项目的插件将音频文件转换为 base64
【发布时间】:2019-11-25 13:15:12
【问题描述】:

我正在尝试从媒体捕获 ionic 插件中获取录音并将文件转换为 base64 字符串。我附上了适用于 Android 但不适用于 IOS 或 Microsoft 的代码。

public captureAudio(name: string, notes: string): void {

    this.mediaCapture.captureAudio().then(res => {
        var filePath = res[0].fullPath;

        this.getBase64StringByFilePath(filePath)
            .then((res) => {
                var base64Only = res.slice(34);
                //do something with base64 string
            });
    });
}

public getBase64StringByFilePath(fileURL: string): Promise<string> {

    return new Promise((resolve, reject) => {
        this.base64.encodeFile(fileURL).then((base64File: string) => {
            resolve(base64File);
        }, (err) => {
            console.log(err);
        });
    })
}

我注意到在我使用的 base64 转换插件中:

“获取任何图像的base64编码的插件,可以为android的任何文件检索Base64,但仅支持iOS图像”

还有其他选择吗?我们也研究了下面的文件插件,但在发送它想要的确切文件路径时遇到了麻烦(它要么不返回任何内容,要么返回错误)。我们还尝试了使用 getUserMedia 的更原生的 javascript 解决方案,但由于安全原因,它在 IOS 上也不起作用。

使用的插件:

【问题讨论】:

    标签: angular ionic-framework plugins base64


    【解决方案1】:

    此功能已从在线教程 [https://medium.com/@JordanBenge/ionic-converting-video-to-base64-a95158de3b2a]

    读取 fileURI,使用 FileReader() 将其编码为 base64,然后我们必须对其进行修复。 @param aAudioRecording 捕获视频的视频文件源(URI)

        private async convertAudioToBase64(aAudioRecording): Promise<{}> {
            return new Promise(async resolve => {
                let lAudioSource: any = await this.file.resolveLocalFilesystemUrl(aAudioRecording);
    
                lAudioSource.file(resFile => {
                    let lReader = new FileReader();
                    lReader.readAsDataURL(resFile);
                    lReader.onloadend = async (evt: any) => {
                        let lEncodingType: string;
    
                        if (this.dataProvider.getPlatform() == "ios") {
                            lEncodingType = "data:audio/mp3;base64,";
                        } else {
                            lEncodingType = "data:audio/x-m4a;base64,";
                        }
    
                        /*
                         * File reader provides us with an incorrectly encoded base64 string.
                         * So we have to fix it, in order to upload it correctly.
                         */
                        let lOriginalBase64 = evt.target.result.split(",")[1]; // Remove the "data:video..." string.
                        let lDecodedBase64 = atob(lOriginalBase64); // Decode the incorrectly encoded base64 string.
                        let lEncodedBase64 = btoa(lDecodedBase64); // re-encode the base64 string (correctly).
                        let lNewBase64 = lEncodingType + lEncodedBase64; // Add the encodingType to the string.
    
                        resolve(lNewBase64);
                    };
                });
            });
        }
    

    【讨论】:

    • 我得到了这个代码来构建它,它通过了 lReader.readAsDataURL(),但是它的 .onloadend 事件永远不会触发,有什么线索会导致这种情况吗?我添加了一个 .onerror 事件处理程序,但没有错误,什么也没有。代码找到了文件,只是readAsDataURL什么也没做。
    • 您是否尝试过使用其他链接到 FileReader 的函数,例如 .onload 来查看 FileReader 是否初始化
    • 有趣,我刚试过,调试器也没有触发 onload。因此,此时我的 onload、onloadend 和 onerror 调试器没有被命中。我对读者的原始代码所做的唯一更改是我将事件移到 .readAsDataURL 上方,只是因为我看到人们经常这样做,但无论顺序如何,它都不起作用。跨度>
    猜你喜欢
    • 2020-12-08
    • 1970-01-01
    • 2015-09-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-05-19
    • 1970-01-01
    相关资源
    最近更新 更多