如何在Blob类型中使用UTF-8?

时间:2019-04-29 05:43:43

标签: javascript blob

我必须通过csv文件导出表格。

csv文件数据是按Blob类型来自服务器的。

Blob {size: 2067, type: "text/csv"}
async exportDocumentsByCsv() {
    this.commonStore.setLoading(true)
    try {
      const result = await DocumentSearchActions.exportDocumentsByCsv({
        searchOption: this.documentSearchStore.searchOption
      })

      // first
      // const blob = new Blob([result.body], { type: 'text/csv;charset=utf-8;' })

      // second
      // const blob = new Blob([`\ufeff${result.body}`], { type: 'text/csv;charset=utf-8;' })
      const blob = result.body
      console.log('result.body', result.body)
      const fileName = `document - search - result.csv`
      if (window.navigator && window.navigator.msSaveOrOpenBlob) {
        // for IE
        window.navigator.msSaveOrOpenBlob(blob, fileName)
      } else {
        FileSaver.saveAs(blob, fileName)
      }
      this.commonStore.setLoading(false)
    } catch (err) {
      alert(err.errorMessage)
      this.commonStore.setLoading(false)
    }
  }

由于我的语言,我必须设置utf-8。

我试图解决此问题,但我不知道如何解决。

我搜索了使用\ufeff来解决此问题的方法,但是当我尝试使用 第二种方法,对我不起作用。

| [object  | Blob]  |

1 个答案:

答案 0 :(得分:1)

Blob 不会为您处理编码,它只会看到二进制数据。唯一的转换是,如果在构造函数的BlobsList

中传入UTF-16 DOMString,

您所处的最佳状态是将应用程序中的所有内容(从服务器到前端)都设置为UTF-8,并确保使用UTF-8发送所有内容。这样,您将可以直接保存服务器的响应,并将其保存在UTF-8中。

现在,如果要将文本文件从已知编码转换为UTF-8,则可以使用TextDecoder,它可以解码来自以下位置的二进制数据的ArrayBuffer视图: DOMString的给定编码,然后可用于生成UTF-8 Blob:

/* const data = await fetch(url)
  .then(resp=>resp.arrayBuffer())
  .then(buf => new Uint8Array(buf));
*/
const data = new Uint8Array([147, 111, 152, 94 ]);
// the original data, with Shift_JIS encoding
const shift_JISBlob = new Blob([data]);
saveAs(shift_JISBlob, "shift_JIS.txt");

// now reencode as UTF-8
const encoding = 'shift_JIS';
const domString = new TextDecoder(encoding).decode(data);

console.log(domString); // here it's in UTF-16


// UTF-16 DOMStrings are converted to UTF-8 in Blob constructor
const utf8Blob = new Blob([domString]);
saveAs(utf8Blob, 'utf8.txt');


function saveAs(blob, name) {
  const a = document.createElement('a');
  a.href = URL.createObjectURL(blob);
  a.download = name;
  a.textContent = 'download ' + name;
  document.body.append(a);
}
a{display: block;}