前端文件上传时修改File对象name属性不生效如何解决

File对象是浏览器Web API的内置宿主对象，其name属性为只读属性，直接对该属性做赋值操作会被浏览器静默忽略，属性值始终保持初始状态，这就是代码中文件名修改不生效的核心原因。
你提到后端使用HttpPostedFileBase无法完成重命名的场景，不需要强行修改原File对象属性，FormData原生API已经提供了自定义上传文件名的能力。

调用formData.append()上传文件时，传入第三个参数即可指定服务端接收到的文件名，无需改动原File对象的任何属性，修改后的上传逻辑代码如下：

for (var i = 0; i < self.files().length; i++) {
    var file = self.files()[i];
    var randomNumberVal = randomNumber();
    var targetFileName = randomNumberVal + '-' + file.name;
    // append第三个参数为上传时使用的自定义文件名
    formData.append('Pdf' + i, file, targetFileName);
}

方案说明 #

• 该实现兼容所有支持FormData文件上传的主流浏览器，无额外第三方依赖
• 后端HttpPostedFileBase实例的FileName属性会直接读取到传入的自定义文件名，无需调整后端逻辑
• 不需要通过new File()构造新文件对象的方式实现重命名：该方式会额外复制文件二进制数据，大文件上传场景下会产生明显性能损耗，使用append第三个参数的方案直接复用原文件引用，性能最优

内容的提问来源于stack exchange，提问作者Greg