在 JavaScript 中重命名 File() 对象

Question

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

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

更改 JavaScript File 对象上的 name 属性的最佳方法是什么？

Answer 1

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

Answer 2

试试这个：

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

注意：这是针对图像类型的，您必须将此类型更改为您实际使用的类型。

Answer 3

响应 Alexander Taborda 的回答... Blob.slice() 的第一个和第二个参数是应形成新 blob 的原始 blob 的开始和结束字节。通过说：

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

你不是在说"copy to the end of the file"（我认为这是你的目标），你是在说"copy the whole blob except the last byte"。

正如@carestad 所说

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

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

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

Answer 4

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

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

Answer 5

您可以使用

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

重命名文件或目录。

Answer 6

假设 f 是原始文件对象，只需使用扩展运算符，正则表达式名称示例：

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

Renaming a File() object in JavaScript