0

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

Я под Ионные Framework так вот код урока:

//Upload Profile Picture 
//Altered code from: Firebase Youtube Channel. 

     //Get Elements 
     var uploader = document.getElementById('uploader'); 
     var fileButton = document.getElementById('fileButton'); 

     //Listen for file 
     fileButton.addEventListener('change', function(e){ 

     //Get File 
     var file = e.target.files[0]; 


     //Create a Storage Ref 
     var storageRef = firebase.storage().ref('profilePictures/' + file.name); 

     //Upload file 
     var task = storageRef.put(file); 

     var user = firebase.auth().currentUser;   

     //Update Progress Bar 
     task.on('state_changed', 

     function progress(snapshot){ 
      var percentage = (snapshot.bytesTransferred/snapshot.totalBytes) *100; 
      uploader.value = percentage; 

      //if percentage = 100 
      //$(".overlay").hide();   
     }, 

     function error(err){ 

     }, 

     function complete(){ 

     } 

     );   
    }); 


//Display Profile Picture 

function showUserDetails(){ 

    var user = firebase.auth().currentUser; 
    var name, photoUrl; 

    if (user != null) { 
     name = user.displayName; 
     photoUrl = user.photoURL; 

     document.getElementById('dp').innerHTML=photoURL; 
     document.getElementById('username').innerHTML=name; 
}} 

А вот код моего знака до контроллера:

.controller('signupController', ['$scope', '$state', '$document', '$firebaseArray', 'CONFIG', function($scope, $state, $document, $firebaseArray, CONFIG) { 

$scope.doSignup = function(userSignup) { 
    //console.log(userSignup); 

    if($document[0].getElementById("cuser_name").value != "" && $document[0].getElementById("cuser_pass").value != ""){ 

     firebase.auth().createUserWithEmailAndPassword(userSignup.cusername, userSignup.cpassword).then(function() { 
      // Sign-In successful. 
      //console.log("Signup successful"); 
      var user = firebase.auth().currentUser; 
       var database = firebase.database(); 
      //Upload Profile Picture 
      //Altered code from: Firebase Youtube Channel. 
      //Get Elements 
      var uploader = document.getElementById('uploader'); 
      var fileButton = document.getElementById('fileButton'); 


      user.sendEmailVerification().then(function(result) { console.log(result) },function(error){ console.log(error)}); 

      firebase.database().ref().child('/accounts/' + user.uid).set({ 
       name: userSignup.displayname, 
       email: userSignup.cusername, 
      password: userSignup.cpassword, 
      description: "No description for this user", 
      facebook: "", 
      twitter: "", 

      }).then(function() { 
      // Update successful. 
      $state.go("login"); 
      }, function(error) { 
      // An error happened. 
      console.log(error); 
      }); 






     }, function(error) { 
      // An error happened. 
      var errorCode = error.code; 
      var errorMessage = error.message; 
      console.log(errorCode); 

      if (errorCode === 'auth/weak-password') { 
      alert('Password is weak, choose a strong password.'); 
      return false; 
      }else if (errorCode === 'auth/email-already-in-use') { 
      alert('Email you entered is already in use.'); 
      return false; 
      } 




     }); 



    }else{ 

     alert('Please enter email and password'); 
     return false; 

    }//end check client username password 


    };// end $scope.doSignup() 



}]) 

Как вы можете видеть, я бы как интегрировать первый код учебника в регистрации и по-прежнему приписывать его хранилищу моего пользователя с его UID, но я не могу найти способ сделать это ... Любая идея?

+0

После создания пользователя через createUserWithEmailAndPassword, попросите пользователя загрузить свою фотографию. Затем при завершении загрузки вызовите updateProfile для пользователя, чтобы обновить photoURL. – bojeil

ответ

1

// Код ниже не был проверен, но он должен работать или, по крайней мере, дать // вы представление о том, как подойти к вашим проблемам

.controller («signupController», [ «$» сферы, '$ state', '$ document', '$ firebaseArray', 'CONFIG', function ($ scope, $ state, $ document, $ firebaseArray, CONFIG) {

$ scope.doSignup = function (userSignup) { //console.log(userSignup);

if($document[0].getElementById("cuser_name").value != "" && $document[0].getElementById("cuser_pass").value != "" && $document[0].getElementById("fileButton").value != ""){ 

    firebase.auth().createUserWithEmailAndPassword(userSignup.cusername, userSignup.cpassword).then(function() { 

     // Sign-In successful. 
     //console.log("Signup successful"); 
     var user = firebase.auth().currentUser; 
      var database = firebase.database(); 

     //Upload Profile Picture 
     //Altered code from: Firebase Youtube Channel. 
     //Get Elements 
     var uploader = document.getElementById('uploader'); 
     var fileButton = document.getElementById('fileButton'); 


    user.sendEmailVerification().then(function(result) { console.log(result) },function(error){ console.log(error)}); 

     //Get File 
    var file = fileButton.value; // or however way the file path can be obtained 
    var storageRef = firebase.storage().ref('profilePictures/' + file.name); 

    //Upload file 
    var task = storageRef.put(file); 

    var user = firebase.auth().currentUser;   

    //Update Progress Bar 
    task.on('state_changed', 

    function progress(snapshot){ 
     var percentage = (snapshot.bytesTransferred/snapshot.totalBytes) *100; 
     uploader.value = percentage; 

     //if percentage = 100 
     //$(".overlay").hide();   
    }, 

    function error(err){ 

    }, 

    function complete(){ 

     //Obtain the URL for the uploaded photo 
     var photoURL = task.snapshot.downloadURL; 


      firebase.database().ref().child('/accounts/' + user.uid).set({ 
      name: userSignup.displayname, 
      email: userSignup.cusername, 
      photoURL: photoURL //add a photoURL attribute and assign it to the URL of the newly uploaded file 
      password: userSignup.cpassword, 
      description: "No description for this user", 
      facebook: "", 
      twitter: "", 

     }).then(function() { 
     // Update successful. 
     $state.go("login"); 
     }, function(error) { 
     // An error happened. 
     console.log(error); 
     }); 

    } 

    );   
}); 

    }, function(error) { 
     // An error happened. 
     var errorCode = error.code; 
     var errorMessage = error.message; 
     console.log(errorCode); 

     if (errorCode === 'auth/weak-password') { 
     alert('Password is weak, choose a strong password.'); 
     return false; 
     }else if (errorCode === 'auth/email-already-in-use') { 
     alert('Email you entered is already in use.'); 
     return false; 
     } 

    }); 

}else{ 

    alert('Please enter email and password'); 
    return false; 

}//end check client username password 

}; // конец $ Объем. doSignup()

}])