Блог

Главная - Вопросы по программированию - когда я использую этот код для изменения размера и загрузки изображения, сервер получает ошибку 400

когда я использую этот код для изменения размера и загрузки изображения, сервер получает ошибку 400

#reactjs

Вопрос:

Это мой код:

 thisUploadImage = async(e) => {
  let file = e.target.files[0];
  const compress = new Compress();
  const resizedImage = await compress.compress([file], {
    size: 2,
    quality: 1,
    maxWidth: 300,
    maxHeight: 300,
    resize: true
  });
  const img = resizedImage[0];
  const base64str = img.data;
  const imgExt = img.ext;;
  const resizedFiile = Compress.convertBase64ToFile(base64str, imgExt);
  let fd = new FormData();
  fd.append('image', resizedFiile);
  const headers = {
    'Authorization': `Bearer ${localStorage.getItem("Token")}`
  };
  axios.post(`url`, fd, {
    headers
  }).then(response => {}).catch(error => {})
}

Когда я использую этот код для изменения размера и загрузки изображения, сервер получает ошибку 400.

Ответ №1:

A 400 status представляет собой a Bad Request , что означает, что сервер не может обработать запрос из-за ошибки клиента. Убедитесь, что вы отправляете данные в правильную конечную точку в API, и убедитесь, что конечная точка может обрабатывать объект, который вы ей отправляете.

Вы можете проверить это, сравнив выходные console.log(fd); данные с моделью, которую ожидает ваш API.

Попробуйте протестировать API с помощью такого инструмента, как, например, Postman, о котором вы можете прочитать подробнее 400 status в документах Mozilla.

Комментарии:

1. при проверке вывода файла с измененным размером это дает мне : Большой двоичный объект {размер: 147310, тип: «изображение/png»}, а при добавлении этого вывода в formdata и отправке на сервер возникает ошибка 400

Ответ №2:

 let file_name = new File([resizedFiile], file.name, {lastModified: file.lastModified, type: file.type});
Метки: ,