在 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

尝试这个：

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, '')
      };