如何将 javascript 对象转换为 utf-8 Blob 以供下载？

Question

我一直在努力寻找一种可行但找不到的解决方案。

我在 javascript 中有一个对象，其中有一些非英文字符。

我正在尝试使用以下代码将对象转换为 blob 以供下载。

当我点击下载内容时，打开下载的 JSON 时非英文字符是乱码。

这是一个像这样的简单对象： {name: "שלומית", last: "רעננה"}

 function setJSONForDownload(obj) {
    obj = obj || []; // obj is the array of objects with non-english characters
    const length = obj.length;
    if (length) {
      const str = JSON.stringify(obj);
      const data = encode( str );

      const blob = new Blob( [ data ], {
        type: "application/json;charset=utf-8"
     });

      const url = URL.createObjectURL( blob );
      const downloadElem = document.getElementById('download');
      downloadElem.innerText = `Download ${length} pages scraped`;
      downloadElem.setAttribute( 'href', url );
      downloadElem.setAttribute( 'download', 'data.json' );
    }
    else {
      document.getElementById('download').innerText = `No data to download...`;
    }
}

function encode (s) {
  const out = [];
  for ( let i = 0; i < s.length; i++ ) {
    out[i] = s.charCodeAt(i);
  }
  return new Uint8Array(out);
}

原文由 Loves2Develop 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您的 encode 函数已损坏，因为它将字符代码转换为字节。不要尝试自己实现，只需使用 Encoding API ：

 const str = JSON.stringify(obj);
const bytes = new TextEncoder().encode(str);
const blob = new Blob([bytes], {
    type: "application/json;charset=utf-8"
});

原文由 Bergi 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

调用 new Blob([DOMString]) 会自动将您的 DOMString (UTF-16) 转换为 UTF-8。

所以你只需要 new Blob( [JSON.stringify(obj)] ) 。

 setJSONForDownload([{ name: "שלומית", last: "רעננה"}]);

function setJSONForDownload(obj) {
  obj = obj || [];
  const length = obj.length;
  if (length) {

    // DOMString
    const str = JSON.stringify(obj);
    // text/plain;UTF-8
    const blob = new Blob([str]);

    const url = URL.createObjectURL(blob);
    const downloadElem = document.getElementById('download');
    downloadElem.innerText = `Download ${length} pages scraped`;
    downloadElem.setAttribute('href', url);
    downloadElem.setAttribute('download', 'data.json');
  } else {
    document.getElementById('download').innerText = `No data to download...`;
  }
}

 <a id="download">dl</a>

原文由 Kaiido 发布，翻译遵循 CC BY-SA 4.0 许可协议