使用javascript使用emojis生成并下载utf8中的文件

时间:2018-05-05 03:31:04

标签: javascript

我在使用包含表情符号的UTF8生成和下载文本文件时遇到问题。问题是,当我下载包含和表情符号的文件时,生成的文件不是用UTF8编码的,并且表情符号没有正确显示。

我使用this solution生成并下载了我需要的文件。这是我使用的代码:

function download(filename, text) {
    let element = document.createElement('a');
    element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
    element.setAttribute('download', filename);
    document.body.appendChild(element);
    element.click();
    document.body.removeChild(element);
}

所以,如果我这样使用它:

downloadFile('withoutEmoji.txt','This is a test without emoji');

以UTF8下载文件。

但是,当我像这样使用它时:

downloadFile('withEmoji.txt','This is a test with emoji ');

我下载的文件没有正确显示表情符号,文件的编码不再是UTF8。

如果我将'withEmoji.txt'文件转换为UTF8(例如使用notepad ++),表情符号会在文件中正确显示。

如何强制文件或文字为UTF8?或者有没有办法在生成文件之前转换表情符号? 我需要该文件包含表情符号,并且是UTF8。

您可以在this fiddle中看到此行为。

修改

Notepad ++使用ANSI编码识别'withEmoji.txt'文件。 Vanilla记事本使用“UTF8”编码识别文件。 使用this service文件被识别为“文件类型:ASCII文本,没有行终止符”。

2 个答案:

答案 0 :(得分:1)

如上所述,您的代码似乎确实有效。我在这里创建了一个Plunker:http://plnkr.co/edit/IMpOJ6SCXCuw5VkKzkzo?p=preview

......对我来说效果很好。

function downloadFile(filename, text) {
  let element = document.createElement('a');
  element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent('\uFEFF' + text));
  element.setAttribute('download', filename);
  document.body.appendChild(element);
  element.click();
  document.body.removeChild(element);
}

function saveSample() {
  downloadFile('withEmoji.txt','This is a test with emoji ');
}

我能想到的唯一两个原因是你没有取得好成绩,你的文本编辑器不能用正确的UTF-8编码保存你的JavaScript代码,和/或当你打开时保存的文件,没有使用正确的UTF-8编码打开。

答案 1 :(得分:1)

文件只是存储在内存和/或磁盘上的字节序列。编码是将这些字节序列解释为字符序列或字符串的方式。您不能“强制”文本编辑器以特定方式解释字节序列,只是使用emojis会导致某些编辑器错误地预测文件编码并默认使用错误的编辑器打开。

文本文件没有任何表示其编码的元数据或标题格式,因此您无法对此行为采取任何进一步措施。

正如评论中所建议的,BOM可能会用于提示UTF-8编码,但根据The Unicode Standard, p. 36

  

对UTF-8既不要求也不建议使用BOM,但可以   在使用BOM的其他编码表单或将BOM用作UTF-8签名的UTF-8数据转换的上下文中遇到。