如何将Blob转换为Base64？现有代码及失败尝试求助

你现有代码里已经通过fetch成功获取到了Blob对象，但直接调用readAsDataURL没生效，核心原因是FileReader的读取操作是异步的，必须监听它的load事件才能拿到转换后的Base64结果。

修正后的完整代码示例 #

把FileReader的逻辑正确插入到你的代码中，如下：

$.post("save-file.php", {text: txt}, function(data){ 
    if (data.length > 0) { 
        $("#out").html(''); 
        fetch(data) 
            .then(resp => resp.blob()) 
            .then(blob => { 
                // Blob转Base64的正确实现
                const reader = new FileReader();
                reader.onload = function(e) {
                    // e.target.result 就是转换完成的Base64字符串
                    const base64Str = e.target.result;
                    console.log("转换后的Base64:", base64Str);
                    // 这里可根据需求使用base64Str，比如上传、展示内容等
                };
                reader.readAsDataURL(blob);

                // 保留原有的文件下载逻辑（如果不需要可删除）
                const url = window.URL.createObjectURL(blob); 
                const a = document.createElement('a'); 
                a.style.display = 'none'; 
                a.href = url; 
                a.download = 'synonymizer-su-file-<?php echo date('YmdHis')?>.doc'; 
                document.body.appendChild(a); 
                a.click(); 
                window.URL.revokeObjectURL(url); 
            })
});

关键说明 #

• readAsDataURL()不会同步返回结果，必须通过onload回调获取e.target.result，该值是带MIME类型前缀的Data URL（格式示例：data:application/msword;base64,xxxxxx...）。
• 如果不需要保留文件下载功能，直接删除创建a标签的相关代码即可，只保留FileReader的转换逻辑。

内容的提问来源于stack exchange，提问作者Aleks