flask----jquery+ajax上传文件

flask+jquery+ajax上传文件

• html

  <form id="form1" action="/upload_file" enctype='multipart/form-data' method='POST'>
      <input id="upload_file" type="file" name="file">
      <label id="filename"></label>
  </form>
  <button onclick="uploadFile()">上传</button>
  

• js

  $("#upload_file").change(function () {
      var arrs = $(this).val().split('\\');
      var filename = arrs[arrs.length - 1];
      console.log($(this).val())
      $("#filename").html(filename);
  });
  
  function uploadFile() {
      var formData = new FormData($("#form1")[0])
      $.ajax({
          url: "/upload_file",
          type: 'post',
          async:true,
          cashe:false,
          processData: false,
          contentType: false,
          data: formData,
          success: function (data) {
              console.log(data.data)
          }
      })
  }
  

• flask

  @app.route("/upload_file", methods=["GET", "POST"])
  def upload_file():
      file = request.files['file']
      file_name = file.filename
      basepath = os.path.dirname(__file__)  # 当前文件所在路径
      upload_path = os.path.join(basepath, 'static', file_name)  
      file.save(upload_path)
      return jsonify({"status": 200, "data": "上传成功"})