Сбой при попытке отправить файл из React в бэкэнд с помощью FileReader - PullRequest
0 голосов
/ 30 мая 2019

Я пытаюсь отправить файл на сервер из React, но он не работает.

Это компонент типа файла ввода:

          <FormFieldFile
            onChange={e => {
              const f = e.target.files[0];
              const fr = new FileReader();
              fr.onload = ev2 => {
                console.log(ev2);
                startupFourthStepFormActionHandler({
                  headerimage: ev2.target.result,
                });
              };

              if (f) fr.readAsDataURL(f);
            }}
          />

Это вызов API:

    const response = await fetch(`${API_URL}uploadFile`, {
      method: 'POST',
      headers: {
        Accept: 'application/json',
        Authorization: `Bearer ${userToken}`,
        'Content-Type': 'application/json', // already tried without this
      },
      // already tried without JSON.stringify
      body: JSON.stringify({ headerimage }),
    });

И вот как я это называю:

CompanyInfoFilesAPICall(startupFourthStepForm.headerimage)

Этот startupFourthStepForm.headerimage содержит очень большую закодированную строку, такую ​​как data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAyAAAAHGCAYAAACM8u/eAAAABmJLR0QA/wD/AP....

Ошибка, которую я получаю

POST http://some/path/public/api/uploadFile 500 (Internal Server Error)

«Вызов функции-члена getClientSize () при нулевом значении»

И эта ошибка выше, как если бы объект шел на сервер пустым.

...