Блог

Главная - Вопросы по программированию - Как отправить файл в виде данных в следующем Js?

Как отправить файл в виде данных в следующем Js?

#node.js #reactjs #api #next.js

Вопрос:

Я создал API в узле js для загрузки файлов. С почтальоном все работает нормально.

Я сделал форму для загрузки файлов Excel в Next Js. Я могу видеть выбранные файлы в консоли.

Но я не могу установить файл в formdata. Я получаю пустые данные формы в консоли.

 <div>
        <input
          class="form-control w-25"
          multiple={false}
          type="file"
          id="ExcelFile"
          onChange={uploadFile}
          required
        ></input>
        {/* </label> */}
        <button
          type="button"
          // disabled={!selectedImage}
          class="btn btn-primary "
        >
          ADD SOLUTION
        </button>
      </div>

 
 const uploadFile = ({ target: { files } }) => {
    console.log(files[0]);
    // let data = new formData();
    let FilesData = new FormData();
    FilesData.append("excel_file", files[0]);
    console.log("Files in multipart");
    console.log(FilesData);
    // data.append("file", files[0]);
  };

https://codesandbox.io/embed/next-js-forked-th22n?fontsize=14amp;hidenavigation=1amp;theme=dark

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

1. Пожалуйста, добавьте немного кода, чтобы показать, что вы хотите сделать и что происходит.

2. вот FilesData идет пустая @AnkushVerma

3. не могли бы вы добавить его в какую-нибудь песочницу и поделиться ссылкой ?

4. Вот ссылка https://codesandbox.io/embed/next-js-forked-th22n?fontsize=14amp;hidenavigation=1amp;theme=dark @Анкушверма

5. Содержимое FormData невидимо в консоли браузера. Вы пытались загрузить его с помощью API

Ответ №1:

Если вы попытаетесь использовать объект console.log FormData , вы просто получите пустой объект.Вместо этого вы должны вызвать entries метод для FormData объекта.

 for (const pair of FilesData.entries()){
  console.log(pair)
}

Он вернет список arrays пар ключ-значение.

Метки: