Introducing Know Your HealthDocs: Learn more

onymos-logo

“How Do I Add Social Login to an Ionic App?”

Social auth providers

Adding plugins to your app to support social login for Apple, Facebook, or Google is tedious, but at least it’s relatively straightforward. Sometimes. Depending. And not counting the part where you have to figure out if that Youtube tutorial from 9 months ago is still relevant. That’s not everything there is to social login though.

That’s why we made Onymos Access. Access isn’t just a plugin or a wrapper over an API. It manages the auth data in your app and user data on the server side.

More solutions “out of the box”

We think implementing social login is annoying and time-consuming. So we decided to make it… not. No more managing developer dashboards or bug-fixing breaking changes when the providers make updates. Access takes care of all of that, then goes even further.

Offline sessions for ease of use

Offline Sessions

What happens when your users lose Internet connectivity? Access uses offline mode to persist those sessions by default.

Refreshing auth tokens is automatic

Refresh Tokens

Access refreshes user auth tokens stored in your app’s local sandbox 30 minutes before they expire, six months from the time they’re generated.

The Access API has multiple functions

Access API

We didn’t just stop at login(). We’ve got functions like getAuth() and getOtherUsersInfo() too. Nine (so far).

Curated user data for social login

Curated Data

Whether it’s connected to Onymos Hosting or your own database, Access manages your user data with a simple JSON tree optimized for “write-several-times-for-easy-reads.”

Oh, and we’re really copypastable…

Seriously. Once you install Access you can use this code to instantly have social login for Apple, Facebook, and Google — plus everything else you just read about.

 import { Component } from '@angular/core';
 import { Platform } from '@ionic/angular';
    
 declare var OnymosInitialize: any;
 declare var OnymosAccess: any;
    
 @Component({
   selector: 'app-root',
     templateUrl: 'app.component.html',
     styleUrls: ['app.component.scss'],
  })
  
  export class AppComponent {
    constructor( private platform: Platform ){ 
       this.initializeApp();
    }
    
     initializeApp(){
        this.platform.ready().then(() => {
    
          const OnymosConnectObject={
            appId : 'Your appId goes here', 
            onymosAuthToken : 'Your onymosAuthToken goes here',  
            envType: 'PRD'
            }
    
          OnymosInitialize.initialize(
            OnymosConnectObject,
          
            function onymosInitializeSuccess(status){
              console.log("Onymos initialized Successfully.", status);
            },
    
            function onymosInitializeFaulure(error){
              console.log("Onymos failed to initialize.", error);
           })
         })
     }


     socialLogin(authProvider){
        let accessObj = { authProvider: authProvider }
 
        OnymosAccess.login(
           accessObj, 

           function onymosAccessLoginSuccess(data){
              console.log('A user logged in:', Date.now());
           }, 
		
           function onymosAccessLoginFailure (error){
              console.log(error);
           });

     }


   }

Think differently about app development

Download our free white paper today to learn how Onymos Features can maximize the value of your developer resources — and shave days or weeks off your development timeline.

Get your free white paper