Ссылка на хранилище Firebase не работает с переменной

Question

Я хочу хранить фотографии профиля пользователей в моем хранилище Firebase. Поскольку у каждого пользователя может быть только 1 фотография профиля в моем проекте, я закодировал электронную почту, используя window.btoa(emailInput), и это должно быть имя файла загруженного изображения профиля.

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

/* Upload the profile picture to Firebase Storage and get the URL */
let fileButton = document.getElementById("signupProfilePicFile"); /* "Choose a file" button */
let uploader = document.getElementById("uploadProgressBar"); /* Progress bar */
fileButton.addEventListener("change", function(e) {
    // Get the file
    let file = e.target.files[0];
    let emailInput = document.getElementById("signupEmail").value;
    let encodedEmail = window.btoa(emailInput);
    
    // Create a storage ref
    var storageRef = firebase.storage().ref("profile-pictures/");
    var profilePicRef = storageRef.child(encodedEmail) /* !!!HERE IS THE PROBLEM!!! */
    
    // Upload the file
    var task = profilePicRef.put(file);

    // Update progress bar
    task.on("state_changed",
        function progress(snapshot) {
            var percentage = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
            uploader.value = percentage;
        },
        function error(err) {

        },
        function complete() {

        }
    );
})

<p>Email:</p>
<input type="text" name="email" id="signupEmail">
<br>
<p>Profile picture file input:</p>
<input type="file" name="file" id="signupProfilePicFile">
<progress value="0" max="100" id="uploadProgressBar">0%</progress>

Когда я удаляю переменную «encodedEmail» и заменяю ее строкой (например, «profile-pi c»), она работает.

Может ли кто-нибудь помочь мне решить мою проблему, или вы действительно не можете ввести переменную в .child()?

Answer 1

Вы можете использовать пользовательские метаданные:

const storageRef = firebase.storage().ref(`profile-pictures/${encodedEmail}`);

var metadata = {
  contentType: 'image/jpeg',
  customMetadata: {
    'yourEncodedEmail': encodedEmail
  }
};

var task = storageRef.put(file, metadata);