8.0.0 • Published 5 years ago

ng-social v8.0.0

Weekly downloads
9
License
MIT
Repository
github
Last release
5 years ago

Social login api for Angular 8. Includes Facebook and Google login.

AOT Compatible.

Getting started

Install via npm

npm install --save ng-social

Import the module

In app.module.ts,

import { 
	NgSocialModule, 
	AuthServiceConfig, 
	GoogleLoginProvider, 
	FacebookLoginProvider 
} from 'ng-social'; 


// Configs

export function getAuthServiceConfigs() {
  let config = new AuthServiceConfig(
      [
        {
          id: FacebookLoginProvider.PROVIDER_ID,
          provider: new FacebookLoginProvider("1758555154405794")
        },
        {
          id: GoogleLoginProvider.PROVIDER_ID,
          provider: new GoogleLoginProvider("1074764438873-k221gusckcgqaalhqnsqn891kjoigcas.apps.googleusercontent.com")
        },
      ]
  );
  return config;
}

@NgModule({
  imports: [
    ...
    NgSocialModule

  ],
  providers: [
    ...
    {
      provide: AuthServiceConfig,
      useFactory: getAuthServiceConfigs
    }
  ],
  bootstrap: [...]
})



export class AppModule { }

Usage :

In app.component.ts,

import {Component, OnInit} from '@angular/core';
import {
    SocialAuthService,
    FacebookLoginProvider,
    GoogleLoginProvider
} from 'ng-social';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})


export class AppComponent {

   constructor(private socialAuthService: SocialAuthService) {}
  
  public socialLogin(platform: string) {
    let socialPlatformProvider;

    if(platform == "facebook") {
      socialPlatformProvider = FacebookLoginProvider.PROVIDER_ID;
    } else if(platform == "google") {
      socialPlatformProvider = GoogleLoginProvider.PROVIDER_ID;
    }

    this.socialAuthService.signIn(socialPlatformProvider).then((userData) => {
      console.log(platform + " login in data : " , userData);
    });

  }
  
}

In app.component.html,

<h1>
     Log in
</h1>

<button (click)="socialLogin('facebook')">Log in with Facebook</button>
<button (click)="socialLogin('google')">Log in with Google</button>           

Facebook App Id :

You need to create your own app by going to Facebook Developers page. Add Facebook login under products and configure Valid OAuth redirect URIs.

Google Client Id :

Follow this official documentation on how to Create a Google API Console project and client ID.