Как вы кодируете файл в base64, а затем загружаете его как многослойный файл в бэкэнд API, используя JS? - PullRequest
5 голосов
/ 22 марта 2019

Я пытаюсь разработать микро-сервис для приема данных в кодировке base64. При попытке отправить более 6 МБ данных я получаю сообщение об ошибке ниже -

В запросе, состоящем из нескольких частей, были параметризованные данные (исключая загруженный файл), которые превысили предел maxPostSize, установленный для соответствующего соединителя

@RequestMapping(value = "/base64/upload", method = RequestMethod.POST,
                    consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
    public String base64(@RequestParam("file") String file) {

        System.out.println(file);
        return "done";
    }

Свойства моего приложения:

#http://docs.spring.io/spring-boot/docs/current/reference/htmlsingle/#common-application-properties
#search multipart
spring.http.multipart.max-file-size=200MB
spring.http.multipart.max-request-size=100MB

Так что я прочитал другие посты и изменил api оставшихся выше на * - 1011

@RequestMapping(value = "/base64/uploadFile", method = RequestMethod.POST,
            consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
    public String base64(@RequestParam("file") MultipartFile file) {

        if (file.isEmpty()) {
            return "redirect:uploadStatus";
        }else {
            return "redirect:success";
        }
}

Теперь, как мне загрузить преобразованные данные base64 в виде файла из интерфейсного приложения (приложения реакции)?

     function getBase64(file) {
            var reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onload = function () {
                console.log(reader.result); // file content is converted to base64

                makeRequest(reader.result,file);
            };
            reader.onerror = function (error) {
                console.log('Error: ', error);
            };
        }

В запросе make, как отправить его в виде файла? Как создать новый файл в JS или React?

      function makeRequest(base64data, actualFile) {

            var data = new FormData();
            // data.append("file", actualFile); // works

            data.append("file", base64data); // doesn't works  ???


            var xhr = new XMLHttpRequest();
            xhr.withCredentials = true;

            xhr.addEventListener("readystatechange", function () {
                if (this.readyState === 4) {
                    console.log(this.responseText);
                }
            });

            xhr.open("POST", "http://localhost:8080/base64/uploadFile");
            xhr.send(data);

        }

1 Ответ

0 голосов
/ 22 марта 2019

Преобразование read.result в буфер - единственный метод, о котором я могу подумать. Смотрите следующий код:

const buffer = Buffer.from(base64data, 'base64');

после преобразования read.result в буфер, многоэтапный пост-запрос может быть легко создан вручную:

const formData = new FormData();
formData.append("myFile", buffer, { filename: 'tmp' });

и затем вместо отправки данных отправьте форму data.

Я надеюсь, что это решение решит вашу проблему, ожидающей здесь частью является использование буфера и присоединение к форме для отправки файла с несколькими данными.

Примечание: вы можете изменить const на var. Ссылки:

NodeJS: Как декодировать строку в кодировке base64 обратно в двоичный файл?

Nodejs публикует строку base64 как данные формы

...