Как разместить изображение с помощью axios? - PullRequest
Новая
       18

Как разместить изображение с помощью axios?

1 голос
/ 09 июля 2019

это моя попытка, но она не работает.

Я получаю ошибку на бэкэнде: file = request.files['file'] с wrap.<locals>.newcls: 400 Bad Request: KeyError: 'file'

мой код на странице для загрузки изображения 

$("#image-selector").change(function () {
  let reader = new FileReader();
  reader.onload = function () {
    let dataURL = reader.result;
    $("#selected-image").attr("src", dataURL);

отправить 

  let image = $('#selected-image').get(0);

  var formData = new FormData();
  formData.append('file', image);

  axios.post('/file', formData, {
    headers: {
      'Content-Type': 'multipart/form-data'
    }
  })
  .then(res => {
    console.log("TEST:", res.data);
  })
  .catch(error => {
    console.log(error);
  });

и это код бэкенда Python / фляги 

@app.route('/file', methods=['GET', 'POST'])
def upload_file():
    if request.method == 'POST':
        file = request.files['file']
        if file and allowed_file(file.filename):

1 Ответ

1 голос
/ 09 июля 2019 
formData.append('file', image);

Вам необходимо опубликовать файл , выбранный в элементе ввода, а не сам элемент ввода. 

formData.append('file', image.files[0]);
...