如何使用ionic angular项目的插件将音频文件转换为base64

6
我正在尝试使用媒体捕获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图像。”
还有其他选项吗?我们也尝试了下面的文件插件,但是无法向其发送所需的确切文件路径(它要么返回空,要么返回错误)。我们还尝试了一种更本地的JavaScript解决方案,使用getUserMedia,但由于安全问题,这在IOS上也无法工作。
使用的插件:
- https://github.com/apache/cordova-plugin-file - https://github.com/apache/cordova-plugin-media-capture - https://github.com/hazemhagrass/phonegap-base64
1个回答

3

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

读取文件URI,使用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没有做任何事情。 - tehlothi
你尝试过使用与FileReader相关的其他函数(如.onload)吗,以查看FileReader是否初始化了吗? - Jeffrey Skinner
有趣的是,我刚试了一下,调试器也没有触发onload事件。所以,目前我的onload、onloadend和onerror的调试器都没有被触发。与您原始代码中关于读取器的唯一更改是我将事件移到了.readAsDataURL之上,因为我看到很多人都这样做,但无论顺序如何,它都不起作用。 - tehlothi

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接