Estoy tratando de autorizar el sitio a través de Firebase, todo funciona como debería, los datos se envían al servidor de Firebase. Pero además, en la función de inicio de sesión, trato de crear un elemento h2 y poner los datos del correo en él, que el usuario ingresó y hizo clic en el botón Iniciar sesión (quiero que el correo se muestre en el sitio en lugar del nombre) , luego aparece un error en la línea donde resalté con una flecha roja: " nombre de autorización es nulo, indefinido ", no se envían datos a html. No puedo entender por qué, así que ayuda, por favor, recientemente estudié JS para resolverlo.
¿Esto puede suceder si agregué un script JS a dos páginas HTML ? Es decir, index.html y autorization.html a los dos que agregué autorization.js. Quería que se redirigiese a la página principal al autorizar desde una página.
const login = document.querySelector(".form-login") login.addEventListener('click', signIn) function signIn() { const email = document.querySelector(".email").value const password = document.querySelector(".password").value // e.preventDefault() signInWithEmailAndPassword(auth, email, password) .then((userCredential) => { // Signed in const user = userCredential.user; console.log("Email firebase: ", user.email); const user2 = JSON.parse(JSON.stringify(user.email)) const autorizationName = document.querySelector(".autorization-name__container"); const autorizationNameTitle = document.createElement("h2"); autorizationNameTitle.textContent = user2; autorizationNameTitle.classList.add("autorization-name__title"); autorizationName.appendChild(autorizationNameTitle); // Error: autorizationName is null, undefined window.location.replace("http://192.168.1.65:5500/") }) .catch((error) => { const errorCode = error.code; const errorMessage = error.message; alert(errorMessage + ", " + errorCode); }); }Aquí hay capturas de pantalla:
en la linea de
autorizationName.appendChild(autorizationNameTitle); está recibiendo un error que dice que authorizationName es nulo, indefinido. Entonces, lógicamente, debemos mirar el lugar donde se modificó su valor la última vez (en este caso, es su inicialización):
const autorizationName = document.querySelector(".autorization-name__container"); Y es un hecho conocido que si su llamada a document.querySelector produce undefined , entonces el selector no coincidió con ningún elemento. Entonces, el motivo del error es que no hay ningún elemento en su página con la class de authorization-name__container en el momento en que intenta encontrarlo. Por lo tanto, deberá corregir el selector o averiguar cuándo se crea el elemento dado.
Es 100% un error con la cadena '.authorization-name__container', intente copiar y pegar esta clase desde donde la tiene en su código y vuelva a verificar si hay palabras mal escritas. Luego, si eso no funciona, intente usar una identificación en lugar de una clase