JS Framework
Ionic
Inicio de Sesión con Facebook en Aplicación Android con Ionic
11 min
cómo agregar inicio de sesión de facebook a tu aplicación ionic introducción esta sección explica cómo puedes crear una aplicación con registro de usuario utilizando el inicio de sesión de facebook y las características principales de parse server a través de back4app después de seguir este tutorial, podrás hacer esto en cualquier momento, puedes acceder al proyecto ionic completo construido con este tutorial en nuestro repositorio de github para completar este inicio rápido, necesitas visual studio code (o cualquier ide web que prefieras) ionic framework una aplicación creada en back4app sigue el tutorial de nueva aplicación parse para aprender cómo crear una aplicación parse en back4app una cuenta de facebook para crear la aplicación 1 configuración de facebook para comenzar a usar las funciones de facebook, necesitas ve al facebook developer sitio web y crea una cuenta e inicia sesión ve a mis aplicaciones y haz clic en agregar una nueva aplicación agregar una nueva aplicación en el panel izquierdo, haz clic en configuraciones configuraciones > básico básico en esta página toma nota de tu id de aplicación id de aplicación agrega una url de política de privacidad url de política de privacidad selecciona una categoría categoría desplázate hacia abajo y presiona guardar cambios guardar cambios 4\ en la parte superior de la misma página, haz clic en el apagar apagar botón y confirma para hacer que tu aplicación esté activa 5\ desplázate hacia abajo en la misma página y haz clic en agregar plataforma agregar plataforma para este tutorial, elijamos android agrega tu nombre del paquete de google play nombre del paquete de google play que en nuestro caso es com back4app myapp agrega los hash de clave hash de clave de tu máquina (ejecuta keytool exportcert alias androiddebugkey keystore / android/debug keystore | openssl sha1 binary | openssl base64 keytool exportcert alias androiddebugkey keystore / android/debug keystore | openssl sha1 binary | openssl base64 para averiguar el tuyo) guardar cambios guardar cambios 6\ en el panel izquierdo, vuelve a tablero tablero , desplázate hacia abajo y haz clic en inicio de sesión de facebook inicio de sesión de facebook 2 vincula tu aplicación de facebook con back4app ve a tu panel de control de la aplicación en sitio web de back4app y haz clic en configuración del servidor configuración del servidor encuentra el bloque “inicio de sesión de facebook” y haz clic en configuración configuración el bloque “inicio de sesión de facebook” se ve así 3\ agrega el id de la aplicación id de la aplicación que anotaste en el paso anterior 3 configurar en este tutorial, comenzaremos desde donde lo dejamos en el anterior registro de usuario con verificación de correo electrónico https //www back4app com/docs/ionic/user registration email verification 4 inicio de sesión de facebook primero instalemos los plugins de cordova de facebook ahora, implementemos el facebooklogin() facebooklogin() método login ts 1 async facebooklogin() { 2 try { 3 // log in to facebook and request user data 4 let facebookresponse = await this facebook login(\['public profile', 'email']); 5 let facebookauthdata = { 6 id facebookresponse authresponse userid, 7 access token facebookresponse authresponse accesstoken, 8 }; 9 10 // request the user from parse 11 let tolinkuser = new parse user(); 12 let user = await tolinkuser linkwith('facebook', {authdata facebookauthdata}); 13 14 // if user did not exist, updates its data 15 if (!user existed()) { 16 let userdata = await this facebook api('me?fields=id,name,email,first name,picture width(720) height(720) as(picture)', \[]); 17 user set('username', userdata name); 18 user set('name', userdata name); 19 user set('email', userdata email); 20 await user save(); 21 } 22 23 this navctrl setroot('homepage'); 24 } catch (err) { 25 console log('error logging in', err); 26 27 this toastctrl create({ 28 message err message, 29 duration 2000 30 }) present(); 31 } 32 } finalmente, añadamos un botón a nuestra login login página y hagamos que llame al método que acabamos de crear login html 1 2 3 log in with facebook 4 5 5 prueba tu aplicación dado que el inicio de sesión de facebook no funciona en un navegador, prueba tu aplicación ejecutando ionic cordova run android ionic cordova run android inicia sesión en sitio web de back4app https //www back4app com/ encuentra tu aplicación y haz clic en tablero tablero > núcleo núcleo > navegador navegador > usuario usuario para ver el usuario que has creado! ¡está hecho! en esta etapa, puedes iniciar sesión, registrarte y cerrar sesión en tu aplicación con facebook utilizando las características principales de parse server a través de back4app!