Как отправить изображение на сервер?

Question

[n1ksON]

Необходимо получить изображение, а затем отправить его на сервер. Пока без всяких проверок на ошибки или содержание и тому подобное.
Вот код:

const App = () => {
  const record = (e) => firebase.storage().ref().put(new FileReader().readAsDataURL(e.target.files[0]))
  return (
    <>
      <input type="file" onChange={(e) => record(e)} />
    </>
  )
}

Ошибка:

Uncaught FirebaseError: Firebase Storage: The operation 'put' cannot be performed on a root reference, create a non-root reference using child, such as .child('file.png').

Подскажите, что я делаю не так.

UPD: Вообще с изображениями какой-то бред происходит. Даже если говорить не об отправке изображений на сервер, а просто об отображении его на странице. Обрабатываю данные input, затем получаю картинку в формате base64 и вывожу кодировку в консоль. Если попытаться вывести картинку на страницу, через <img src="здесь кодировка base64">, то на странице она не отображается, а если получившуюся кодировку base64 скопировать открыть на любом сайте, который развёртывает кодировку и отображает картинку, то всё хорошо и она отображается корректно. ВТФ?

Comments

[Kirill Makarov]

если на бэк будешь отправлять то лучше через формдата делать будет (axios). что качается отображения картинки выведи ее в консоль чтобы посмотреть, и проверь хватает ли там всех надписей, типа base64 запятые и экстейшн.

Answer 1

[Aleks_Ko]

День добрый,
А чего не в storage() отправляете изображение?
У меня как то так выглядит все.
Например, фото пользователя

const uid = await dispatch('getUid'); // получаем индификатор пользователя
             
            //отправляем в storage
              const storageData =  await firebase.storage().ref(`/profiles/${uid}/photo`)
             //получаем ссылку на картинку
                    storageData.put(photo)
              let newPhoto = await storageData.getDownloadURL();
              // грузим ссылку в данные к пользователю
              await firebase.database().ref(`/profiles/${uid}/info/`).update({
                  name: name,
                  department: department,
                  email: email,
                  photo: newPhoto})

Comments

[n1ksON]

Да, действительно. Вот сейчас пытаюсь отправить изображение в storage:

firebase.storage().ref().put(new FileReader().readAsDataURL(e.target.files[0]))

Ошибка :

Uncaught FirebaseError: Firebase Storage: The operation 'put' cannot be performed on a root reference, create a non-root reference using child, such as .child('file.png').