Question

我使用Flask + Python查找相关文件以供进一步处理。目前，我只能使用以下内容将文件上传到指定目录：

后端：

from flask import Flask, render_template, request
from werkzeug import secure_filename
app = Flask(__name__)

@app.route('/upload')
def upload_file():
   return render_template('upload.html')

@app.route('/uploader', methods = ['GET', 'POST'])
def upload_file():
   if request.method == 'POST':
      f = request.files['file']
      f.save(secure_filename(f.filename))
      return 'file uploaded successfully'

if __name__ == '__main__':
   app.run(debug = True)

前端：

<html>
   <body>

      <form action = "http://localhost:5000/uploader" method = "POST" 
         enctype = "multipart/form-data">
         <input type = "file" name = "file" />
         <input type = "submit"/>
      </form>
   </body>
</html>

但是我对这个解决方案有几个问题和疑问：

我不想实际触摸（移动/上传）任何文件，我只需要所选文件的文件名。如何放弃实际上传并将文件名作为列表？
有没有办法选择目录（而不是特定文件）进行批处理？

Answer 1

你可以使用Javascript;）

将服务器端代码更改为：

from flask import Flask, render_template, request
from werkzeug import secure_filename
app = Flask(__name__)

@app.route('/upload')
def upload_file():
   return render_template('upload.html')

@app.route('/uploader', methods = ['GET', 'POST'])
def uploader_file():
   print(request)
   if request.method == 'POST':
      f = request.form['filename']
      return f

if __name__ == '__main__':
   app.run(debug = True)

然后改变你的upload.html：

<html>
<body>
<script type="text/javascript">
function readURL(){
  var fullPath = document.getElementById('upload').value;
  if (fullPath) {
      var startIndex = (fullPath.indexOf('\\') >= 0 ? fullPath.lastIndexOf('\\') : fullPath.lastIndexOf('/'));
      var filename = fullPath.substring(startIndex);
      if (filename.indexOf('\\') === 0 || filename.indexOf('/') === 0) {
          filename = filename.substring(1);
      }
     document.getElementById("filename").value = filename;
  }
}
</script>
      <input id="upload" type ="file" name = "file" onchange="readURL();" />
      <form action = "http://localhost:5000/uploader" method = "POST" 
         enctype = "multipart/form-data">
         <input id="filename" type="hidden" name="filename" />
         <input type = "submit"/>
      </form>
   </body>
</html>

Answer 2

根据@RaminNietzsche的回答，我做了一些改变。

前端：input，其中包含属性webkitdirectory，可启用网络浏览器（Chrome，Firefox无效，Safari无法上传目录）

<input id="directory" type='file' onchange="readFiles()" webkitdirectory>
<form action="{{ url_for('upload') }}" method="POST" enctype="multipart/form-data">
    <input id="filenames" type="hidden" name="filenames"/>
    <input type="submit"/>
</form>
<script type="text/javascript">
    function readFiles() {
        var directory = document.getElementById('directory').files;
        var filenames = [];
        for (var i = 0; i < directory.length; i++) {
            filenames.push(directory[i].name);
        }
        document.getElementById("filenames").value = filenames;
    }
</script>

<强>后端：

@app.route("/upload", methods=["POST"])
def upload():
    filenames = request.form.get('filenames', '').split(',')
    # handle filenames here
    return 'file uploaded successfully'

获取输入文件名和扩展名，而无需实际上传Flask

2 个答案: