Flutter Web中如何将Google Apps Script返回的Blob字符串转为Blob对象

我来帮你搞定这个问题——你遇到的UTF-8编码错误，根源是Google Apps Script那边把二进制PDF数据直接当成UTF-8字符串返回了，这肯定会乱码啊！PDF是二进制文件，不能这么传输，得用Base64编码转成安全的文本格式才行。下面分两步修复：

原来的getDataAsString()会把PDF的二进制字节强行按UTF-8解析，导致数据损坏。我们要把Blob转成Base64编码，同时返回文件的MIME类型，方便Flutter这边正确创建Blob：

function doGet(){
  var base64File = getFileAsBase64("1wzR-7fWT_vA7jVSUnDwSj28j82scazkkup8Ovr9kwjv");
  // 返回包含Base64数据和MIME类型的JSON
  return ContentService.createTextOutput(JSON.stringify({
    base64: base64File,
    mimeType: "application/pdf"
  })).setMimeType(ContentService.MimeType.JSON);
}

function getFileAsBase64(fileId) {
  var file = DriveApp.getFileById(fileId);
  // 将Blob的原始字节转为Base64编码的字符串
  return file.getBlob().getBytes().reduce(function(a,b){
    a.push(String.fromCharCode(b));
    return a;
  },[]).join("");
}

现在Flutter需要接收Base64字符串，解码成二进制字节数组，再创建Blob对象：

首先，在文件顶部添加必要的导入：

import 'dart:convert'; // 用于Base64解码和JSON解析

然后修改_getFileFromGoogleDrive函数：

Future<String> _getFileFromGoogleDrive() async {
  final driveUrl = "https://script.google.com/macros/s/AKfycbzY-XQxMfq6KeeRL_-4y8DnnBanu3PX813Ipfz8xogD7dgQKb2Y/exec";
  return await http.get(Uri.parse(driveUrl)).then((response) {
    // 解析返回的JSON数据
    final jsonData = jsonDecode(response.body);
    final base64String = jsonData['base64'];
    final mimeType = jsonData['mimeType'];

    // 将Base64字符串解码为二进制字节数组
    final Uint8List fileBytes = base64Decode(base64String);

    // 创建正确的Blob对象，指定PDF的MIME类型
    final html.Blob blob = html.Blob([fileBytes], mimeType);

    // 生成URL并在新窗口打开
    final url = html.Url.createObjectUrlFromBlob(blob);
    html.window.open(url, "_blank");
    html.Url.revokeObjectUrl(url);

    return null;
  });
}

为什么这样能解决问题？ #

• PDF是二进制文件，直接转UTF-8字符串会破坏非文本字节，导致编码错误。
• Base64编码把二进制数据转换成纯文本格式，能安全地在HTTP请求中传输，不会丢失数据。
• Flutter这边解码Base64得到原始字节数组后，就能创建出正确的Blob对象，从而用createObjectUrlFromBlob生成可访问的PDF链接。

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