代码之家 › 专栏 › 技术社区 › c-chavez

使用javascript生成和下载utf8格式的文件,并使用emojis

javascript

c-chavez · 技术社区 · 6 年前

我在生成和下载包含表情符号的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(例如使用记事本+),表情符号将正确显示在文件中。

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

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

编辑

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

2 回复 | 直到 6 年前

kshetline 6 年前

如前所述,您的代码似乎确实有效。我在这里创建了一个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编码打开它。

Patrick Roberts Benjamin Gruenbaum 6 年前

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

文本文件没有任何元数据或标头格式来指示其编码,因此您无法进一步处理此行为。

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

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