通过前端 javascript 列出服务器上的文件

Question

A 有一个文件夹，里面装满了最终用户可以访问的文件，并且正在处理一个 javascript 文件来解析它们并根据需要交付它们。但是，我希望 javascript 扫描文件夹，然后列表迭代该文件夹中的文件数组，而不是手动更新列表。前端JS有没有好的方法来做到这一点？我研究过的所有解决方案都纯粹针对 Node.js。

例如，假设我有一个像这样的文件夹结构......

/ (Web Root)
|__ /Build_a_card
|__ /Cool pictures
  |__ /Summer Pictures
       summer_dog.gif
       smiling_sun.svg
  |__ /Winter Pictures
       snowman.png
  cat.jpg

然后在 javascript 中我会运行类似的东西

var image_list = get_list("/Cool Pictures");
build_select_list(image_list);

function get_list(folder_to_look_in){
   var the_list = ???
   return the_list;
}
...

然后，例如，运行 JS，经过一些解析后，用户会看到......

<select>
  <option value="summer_pictures/summer_dog.gif">summer_dog.gif</option>
  <option value="summer_pictures/smiling_sun.svg">smiling_sun.svg</option>
  <option value="winter_pictures/snowman.png">snowman.png</option>
  <option value="cat.jpg">cat.jpg</option>
</select>

在一个荒谬的世界中，由于 javascript 可以访问文件夹中的各个文件，假设我可以暴力破解文件夹中的每个可能的文件名，并在每个文件上返回成功：

function get_list(folder){
  var list_of_files = {};
  var starting_character = 0;
     list_of_files = every_single_option({starting_character}, 0, 40, folder)
  }
}
function every_single_option(existing_characters, current_depth, max_depth, folder){
  this_string = String.fromCharCode(existing_characters);
  if (request_url(this_string, folder)){
     there_array[this_string] = this_string;
  }
  var there_array = {}
  var i;
  if (current_depth < max_depth){
    while (i < 127){
        let temp_array = there_array;
        temp_array[i] = i;
        mix_source(there_array, every_single_option(existing_characters, current_depth + 1, max_depth, folder))
    }
}
return there_array;
}
function request_url(url, folder){
  var oReq = new XMLHttpRequest();
  oReq.addEventListener("load", reqListener);
  oReq.open("GET", "/" + folder + "/" + url);
  oReq.send();
}
function mix(source, target) {
   for(var key in source) {
     if (source.hasOwnProperty(key)) {
        target[key] = source[key];
     }
   }
}

但正如前面提到的，这样做是荒谬的（既慢得无法使用，又非常糟糕的代码设计，暴力破解你自己的网站简直是愚蠢的。）

但它确实假设证明 javascript 没有理由不能在假设公共权限的情况下获取目录列表。或者，我可以使用后端制作一些 API，允许获取列出它的 JSON，但这需要后端代码来处理前端进程。我试图用一些理智而简单的方法来实现这一目标，但问题是......如何实现？

（如果您坚持发布 jquery 方式来执行此操作，请同时发布非 jquery 方式，并且我的环境中没有可用的 jquery。）

Answer 1

因此，我拒绝承认这是不可能的，因此设计了一个可行的解决方案，并且不需要 API。\n也就是说，服务器不得主动阻止 javascript 查看目录。换句话说，服务器尚未关闭索引，并且目录没有 index.html 或等效的内容来重写任何索引尝试，并且服务器没有进行某些 url 重写。换句话说，这应该适用于任何不重写或阻止索引的服务器环境。

\n\n

这是一个草稿（仍然有问题，需要完成）：

\n\n

var request = new XMLHttpRequest();\nrequest.open(\'GET\', \'/my/directory/\', true);\n\nrequest.onload = function() {\n  if (request.status >= 200 && request.status < 400) {\n    // Success!\n    var resp = request.responseText;\n  }\n};\n\nrequest.send();\nvar directory_listing = resp;\nvar regexp = /\\b((?:[a-z][\\w-]+:(?:\\/{1,3}|[a-z0-9%])|www\\d{0,3}[.]|[a-z0-9.\\-]+[.][a-z]{2,4}\\/)(?:[^\\s()<>]+|\\(([^\\s()<>]+|(\\([^\\s()<>]+\\)))*\\))+(?:\\(([^\\s()<>]+|(\\([^\\s()<>]+\\)))*\\)|[^\\s`!()\\[\\]{};:\'".,<>?\xc2\xab\xc2\xbb\xe2\x80\x9c\xe2\x80\x9d\xe2\x80\x98\xe2\x80\x99]))/i;\nvar match, files = [];\n\nwhile ((match = regexp.exec(resp)) != null) {\n  files.push(match.index);\n}\n\nconsole.log(files);\n

\n