使用JQuery和Python发送图像

Question

通过HTML前端将照片上传到后端Python的最佳实践是什么

我相信信息没有被发送出去

我制作了Python代码来接收，但是我无法在后端接收图像，它可能是空的

Python后端

@app.route('/api/uploadFoto', methods=['POST'])
def enviaFoto():

  #POST /api/uploadFoto

  ACCESS_KEY_ID = 'MINHA_KEY'
  ACCESS_SECRET_KEY = 'MINHA_SECRET_KEY'
  BUCKET_NAME = 'BUCKET
  SOURCE_FILENAME = request.files

  print(SOURCE_FILENAME)

  S3 = boto3.client('s3')

  S3.upload_fileobj(SOURCE_FILENAME, BUCKET_NAME, SOURCE_FILENAME)

  url = "https://" + BUCKET_NAME + ".s3.amazonaws.com/" + SOURCE_FILENAME + ""

  response = {'status': 'sucesso', 'urlFoto': '{}'.format(url)}

  response_pickled = jsonpickle.encode(response)

  return Response(response=response_pickled, status=200, mimetype="application/json")

打印中（源文件名）python返回：ImmutableMultiDict（[]）

JQuery前端

$(function() {
  $('#upload-file-btn').click(function() {
    var input = document.querySelector('input[type=file]').files[0]

    formData = input.name

    axios({
      method: 'post',
      url: 'http://localhost:5000/api/uploadFoto',
      headers: {
        "Access-Control-Allow-Origin": "http://localhost",
        "Access-Control-Allow-Headers": "Authorization", 
        "Access-Control-Allow-Methods": "GET, POST, OPTIONS, PUT, PATCH, DELETE"
      },
      data: formData
    });

  });
});

Answer 1

为什么要发送input.name？如果你想分享图片，你应该这样做

var formData = new FormData();
formData.append('my_file', this.file, this.file.name);

axios({
    method: 'POST',
    url: 'whatever',
    data: formData,
}).then..

当然，可以根据文件输入中的任何值更改this.file