在JavaScript中重命名File()对象

Question

我希望我的用户能够在上传文件之前重命名文件

我在Javascript中有一个File对象，它有一个已经设置的name属性，但我希望能够更新。现在做明显的myFile.name = "new-name.txt"返回一个错误，这个属性是只读的。

在JavaScript File对象上改变name属性的最好方法是什么?

Answer 1

既然file.name是一个只读属性，我发现这是在浏览器中重命名File对象的最佳方法:

const myNewFile = new File([myFile], 'new_name.png', {type: myFile.type});

Answer 2

try this:

var blob = file.slice(0, file.size, 'image/png'); 
var newFile = new File([blob], 'name.png', {type: 'image/png'});

注意:这是图片的类型，你需要把这个类型改成你实际使用的类型

Answer 3

您可以添加带有名称的input标记，并对用户隐藏name属性。在服务器上，只使用input作为名称，忽略默认名称。

Answer 4

对于Alexander Taborda的回答…blob. slice()的第一个和第二个参数是应该形成新blob的原始blob的开始和结束字节。:

var blob = file.slice(0,-1);

你不是在说"复制到文件的末尾"(我认为这是你的目标)，你是在说"复制整个blob，除了最后一个字节"。

正如@carestad所说的

var blob = file.slice(0, file.size);

之后创建一个新的File()对象应该创建一个具有新名称的精确副本。

请注意，对于png格式，如果没有最后一个字节，该文件将被视为无效。

从:https://developer.mozilla.org/en-US/docs/Web/API/Blob/slice

Answer 5

可以使用

FileSystemEntry.moveTo(newParent[, newName][, successCallback][, errorCallback]);

重命名文件或目录。

来自MDN:https://developer.mozilla.org/en-US/docs/Web/API/FileSystemEntry/moveTo

Answer 6

假设f是原始文件对象，只需使用扩展运算符，重新定义名称的示例:

let newF = {
        ...f,
        name: f.name.toString().replace(/[^0-9A-Za-z.-_()]/gi, '')
      };