programing

vuex, firestore 및 createUserWithEmailAndPassword를 사용하여 사용자가 등록할 때 사용자 프로파일 컬렉션을 작성하려면 어떻게 해야 합니까?

copysource 2022. 7. 16. 13:21
반응형

vuex, firestore 및 createUserWithEmailAndPassword를 사용하여 사용자가 등록할 때 사용자 프로파일 컬렉션을 작성하려면 어떻게 해야 합니까?

빌드하고 있는 앱에 대해서, 유저가 등록할 때에 프로파일을 작성해 주었으면 합니다.프로파일에는 유저의 유저명, E-메일, 파이어베이스 인증에 의해서 작성된 UID가 포함됩니다.createUserWithEmailAndPassword를 사용한 인증부분이 있습니다.또, 유저명과 유저의 E-메일을 캡쳐 하는 「사용자」컬렉션도 작성할 수 있습니다.그러나 사용자 컬렉션에 있는 사용자 프로파일에 uid를 가져와 저장하는 데 문제가 있습니다.

현재 가지고 있는 코드는 다음과 같습니다.

import * as firebase from "firebase/app";
import db from "../../components/firebase/firebaseInit";

  actions: {
    registerUser({ commit }, payload) {
      commit("setLoading", true);
      commit("clearError");

      firebase
        .auth()
        .createUserWithEmailAndPassword(payload.email, payload.password)
        .then(user => {
          commit("setLoading", false);
          const newUser = {
            email: user.email,
            id: user.uid,
            courses: []
          };
          commit("setUser", newUser);

          db.collection("users")
            .add({
              username: payload.username,
              email: user.email,
              userId: user.uid
            })
            .then(() => {
              console.log("New user added!");
            })
            .catch(err => {
              console.log(err);
            });
        })
        .catch(err => {
          commit("setLoading", false);
          commit("setError", err);
        });
    },

제가 조사한 결과, 다음과 같은 권장 솔루션이 발견되었습니다.

프로파일 페이지에서 현재 사용자 로그인 사용자 정보 가져오기 - Firebase 및 Vuejs

Cloud Firestore 추가 사용자 데이터 저장

그리고 이 비디오:

https://www.youtube.com/watch?v=qWy9ylc3f9U

그리고 add() 대신 set() 메서드를 사용해 보았습니다.

하지만 적어도 나에게는 효과가 없는 것 같아.

잘 부탁드립니다.더 보고 싶은 코드가 있으면 알려주세요

표시되는 에러 메시지를 공유하지 않았습니다만, 대부분의 경우, 이 에러는 메서드가 가 아닌 를 반환하기 때문에 발생합니다.

따라서 다음과 같이 해야 합니다.

import * as firebase from "firebase/app";
import db from "../../components/firebase/firebaseInit";

  actions: {
    registerUser({ commit }, payload) {
      commit("setLoading", true);
      commit("clearError");

      firebase
        .auth()
        .createUserWithEmailAndPassword(payload.email, payload.password)
        .then(userCredential=> {
          commit("setLoading", false);

          const user = userCredential.user;  // <-- Here is the main change 

          const newUser = {
            email: user.email,
            id: user.uid,
            courses: []
          };
          commit("setUser", newUser);

          return db.collection("users")  
            .add({
              username: payload.username,
              email: user.email,
              userId: user.uid
            });

        })
        .then(() => {
              console.log("New user added!");
        })
        .catch(err => {
          commit("setLoading", false);
          commit("setError", err);
        });
    },

언급URL : https://stackoverflow.com/questions/59383748/using-vuex-firestore-and-createuserwithemailandpassword-how-do-i-create-a-use

반응형