Chrome中FileSystemFileEntry.file()生成的File对象缺失webkitRelativePath

拖拽包含目标文件的文件夹后，可获取到FileSystemFileEntry对象：

调用该对象的.file()方法转换为File对象后，不同浏览器的webkitRelativePath属性表现存在差异：

• Firefox：该属性会自动填充完整路径
  
• Chrome：该属性为空字符串
  

1. 如何让Chrome中的File对象保留完整路径？ #

直接通过FileSystemFileEntry的fullPath属性获取完整路径，手动赋值给File对象的webkitRelativePath即可，示例代码：

// entry为获取到的FileSystemFileEntry对象
entry.file(file => {
  // 手动填充相对路径
  file.webkitRelativePath = entry.fullPath;
  // 后续可直接使用该file对象
});

也可以在遍历文件夹的过程中，自行维护每个文件的相对路径信息，不依赖File对象的webkitRelativePath属性。

2. 这是预期行为还是Chrome的bug？ #

这是Chrome的预期行为。webkitRelativePath属性最初是为文件上传控件（<input type="file" webkitdirectory>）设计的，而Chrome的FileSystem API实现中，并没有为通过.file()转换得到的File对象自动填充该属性的逻辑。Firefox额外做了兼容处理，但这并非通用规范要求的行为。

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