Curso de Firebase para Web 2019

Curso de Firebase para Web 2019

Juan Guillermo G贸mez Torres

Juan Guillermo G贸mez Torres

Firebase Web Login con Facebook

10/32

Lectura

隆Un saludo, Platzinauta!馃憢馃徎

隆Ups! De momento, esta clase no est谩 disponible en nuestra plataforma, pero s铆 la tenemos en YouTube.

Para no interrumpir tu aprendizaje te dejamos el video y link para que puedas verla en YouTube.

Link a YouTube

Pronto estar谩 disponible en Platzi como el resto de clases.

Gracias por tu comprensi贸n y nunca pares de aprender馃挌

Aportes 32

Preguntas 6

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesi贸n.

esas laptops ya las venden estampadas? son igualitas

Actualizaci贸n Diciembre de 2020
Para poder obtener la imagen de facebook es necesario enviar un acces_token; Este m茅todo ya no funciona sin un token, aqu铆 pueden consultar mas respecto de esta actualizaci贸n https://developers.facebook.com/docs/graph-api/reference/user/picture/

Creo que a todo el curso le falto explicar todo el HTML de como funciona.

los que lo quieran hacer con twitter deben:

  1. registrarse en : developer.twitter.com
  2. repetir en autenticacion.js
authTwitter () {  
    const provider = new firebase.auth.TwitterAuthProvider();

    firebase.auth().signInWithPopup(provider)
    .then(result => {
      $('#avatar').attr('src', result.user.photoURL)
      $('.modal').modal('close')
      Materialize.toast(`Bienvenido ${result.user.displayName} !! `, 4000)
    })
    .catch(error => {
      console.error(error)
      Materialize.toast(`Error al autenticarse con Twitter: ${error} `, 4000)
    })
  }```

3. en authController.js 


$("#authTwitter").click(() => objAuth.authTwitter());

4. Agregar las llaves que les da twitter en su firebase
5. agregar a twiter la url que les da firebas. (https://developer.twitter.com/en/docs/apps/app-permissions)

Es mas lento que en facebook pero la metodologia en igual.

con la aplicacion de invie solicite la autorizacion por twitter para utilizar la autenticacion y nunca la aprobaron. a lo mejor estoy haciendo algo mal?

Buenos d铆as un favor muy grande a煤n no logro autenticarme con email, Google, Facebook, ya he revisado en varias ocasiones y el c贸digo esta correcto. solo que cuando reviso en la consola me sigue marcando error aqu铆:

.catch(err => {
_ console.error(error)_ --> Esto en mi c贸digo lo tengo como comentario
** console.error(err)** indicando que esta indefinido
Materialize.toast(Error al autenticarse con Facebook: ${err}, 4000)
})

Les comento que cambien un poco el c贸digo por que la forma en que nos ense帽aron me marcaba m谩s errores(que es la que esta en comentario)

Excelente, estoy haciendo esto a la vez que hice un tutorial de Dominicode en youtube y el curso de Angular y todo se complementa perfecto. Recomendado Dominicode, Angular 9 con Firebase.

Pueden usar la consola del navegar para ver los posibles problemas.

Excelente curso!!
Autenticaci贸n google 鉁
Autenticaci贸n Facebook 鉁

Para los que tienen problemas con firefox y el error 鈥渉e popup has been closed by the user before finalizing the operation鈥 es debido a una extension en mi caso que bloquea el seguimiento por parte de facebook, solo hay que desistalarlo o desactivarlo y permitir谩 el inicio automatico con fb

驴Alguien pudo mostrar su foto de perfil? A mi no me carga. Ya prob茅 con otro facebook y me sigue saliendo el avatar por defecto.

Al d铆a de hoy Enero 2020, no permite login sin https, alguna idea de como hacer pruebas en fase de desarrollo?

Para ambos casos Facebook y Twitter es necesario soplicitar accesos Elevados para poder acceder a la informacion del Login, es facebook es facil en twitter, solo deben agregar un peque帽o texto diciendo que es para fines de estudio y ya te aprueban.

Al parecer ahora solo se puede probar en local con un servidor ssl, toca instalar algo para ello o usar herramientas como Laragon, que te generan el ssl para los proyectos.

Incre铆ble lo f谩cil que es esto jaja, con Facebook desarrollado desde un back igual es un problema, me encanta!

Buena clase !

Al parecer hay un problema con la carga de este video. @teamplatzi

Qu茅 tan bueno es desarrollar una p谩gina grande en Firebase?, o es para proyectos sencillos?

lo mismo pero en flutter 馃槂

Comentas que facebook clasifica las cuentas que van a tener autorizaci贸n para acceder a la App.
Si la App se pone en producci贸n que se debe hacer para que cualquiera pueda logearse desde su cuenta de Facebook?

nice

Hola, no logra autenticarme ni con Google, ni con Facebook, logro entender por que si todo el codigo esta ok. ayuda . por . favorrrrr
. .(

Estimadas y estimados, respecto a lo del problema con localhost y el https, he visto el siguiente link en stackoverflow: https://stackoverflow.com/questions/39800216/working-with-facebook-login-from-localhost

Busquen la respuesta de 鈥淒agmar鈥 sobre crear una 鈥渢est app鈥. As铆 he logrado que me funcionara a mi con localhost

perdon olvide la parte donde tiene que agregar los dominio de la app de prueba asi, img : https://prnt.sc/rjxs7d

carga sin problemas gamil pero facebook nada ni el error

Hola amigos siguiendo el link de ValdDark, para crear una app de prueba de la original que creamos, segui la info del link: https://stackoverflow.com/questions/39800216/working-with-facebook-login-from-localhost
1.- Cree la app de prueba url de la img: https://prnt.sc/rjxn93
2.- Colocar los datos a esta app de prueba los mismos que la original , la url de reedireccino esta en su consola de firebase, link de img : https://prnt.sc/rjxo4x
3.- Colocar los datos de la app de prueba en la consola de firebase en la parte de login con facebook asi; link img : https://prnt.sc/rjxoo4

Espero les sirva. Saludos

interesante, es momento de probar?.

como paso mi app de modo desarrollo a modo terminado ? porque no me deja autenticar y me menciona ese error

Muy buena la gu铆a clase para probar esta herramienta.

well i try pero siguen sin darme developer access en twitter

Buena me gusto mucho lo de login con facebook y google muy util!

Tengo un gran problema, no me despliega el div para iniciar sesi贸n, he realizado todo al pie de la letra hasta el video anterior (Autenticaci贸n con Google).
Si alguien me pudiera apoyar se lo agradecer铆a mucho!