admin管理员组

文章数量:1426901

I'm trying to implement a directory upload feature with limited browser support (namely Chrome or Chromium based browsers). To that end I'm using an HTMLInput element with the webkitdirectory attribute. What I need to know is will the directory separators in the webkitRelativePath property of the selected File objects use operating system specific directory separators. It looks like according to this W3C draft it is specified to always be unix style separators, but it would be good to have confirmation of this (if possible for FireFox as well). Unfortunately the MDN documentation doesn't specify.

Here is a snippet that demonstrates the functionality:

var dirInput = document.getElementById('dirInputTest');
var output = document.getElementById('dirListing');
dirInput.addEventListener(
  'change',
  function () {
    var files = Array.from(dirInput.files);
    output.innerHTML = '';
    for (var i = 0; i < files.length; i++) {
      output.innerHTML += files[i].webkitRelativePath + '\n';
    }
  }
);
<body>
<input id="dirInputTest" type="file" webkitdirectory />
<pre id="dirListing">
</pre>
</body>

I'm trying to implement a directory upload feature with limited browser support (namely Chrome or Chromium based browsers). To that end I'm using an HTMLInput element with the webkitdirectory attribute. What I need to know is will the directory separators in the webkitRelativePath property of the selected File objects use operating system specific directory separators. It looks like according to this W3C draft it is specified to always be unix style separators, but it would be good to have confirmation of this (if possible for FireFox as well). Unfortunately the MDN documentation doesn't specify.

Here is a snippet that demonstrates the functionality:

var dirInput = document.getElementById('dirInputTest');
var output = document.getElementById('dirListing');
dirInput.addEventListener(
  'change',
  function () {
    var files = Array.from(dirInput.files);
    output.innerHTML = '';
    for (var i = 0; i < files.length; i++) {
      output.innerHTML += files[i].webkitRelativePath + '\n';
    }
  }
);
<body>
<input id="dirInputTest" type="file" webkitdirectory />
<pre id="dirListing">
</pre>
</body>

  • javascript
  • html
Share Improve this question asked Jul 9, 2020 at 2:01 Paul WheelerPaul Wheeler 20.2k3 gold badges31 silver badges45 bronze badges 2
  • Well... that's what the current specs text ask for, so if you are only interested in implementations that do follow these specs, you can be sure that "A relative path is a string consisting of one or more path segments joined by '/' (U+002F SOLIDUS) that does not start with '/' (U+002F SOLIDUS).", and if you find an implementation that doesn't follow that rule, then it's a buggy implementation. Also, just for curiosity, what are you willing to do with these pathes? – Kaiido Commented Jul 9, 2020 at 5:49
  • This is for an upload feature that preserves the directory structure of the uploaded folder. So I have to turn the flat list of files into a tree structure to create the respective containers before uploading the files. – Paul Wheeler Commented Jul 13, 2020 at 20:26
Add a ment  | 

1 Answer 1

Reset to default 9

So I got around to spinning up a Windows VM and I can confirm that all of the major browsers (Chrome, Fire-Fox, Edge) use the forward slash path separator regardless of operating system (I did not test Opera or Internet Explorer).

本文标签： javascriptWhen using webkitRelativePath is the path separator operating system specificStack Overflow

版权声明：本文标题：javascript - When using webkitRelativePath is the path separator operating system specific? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1745488063a2660473.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。