1.0.1 • Published 7 years ago

ekiras-angular-social-auth v1.0.1

Weekly downloads
1
License
MIT
Repository
github
Last release
7 years ago

ekiras-angular-social-auth

This Plugin will work with Angular version ^4.0.0. It provides three basic functionalities 1. Login 2. Status 3. Logout

Installation

To install this library, run:

$ npm install ekiras-angular-social-auth --save

Setup

You need to include the EkirasSocialAuthModule in the main module of your project.

Including Module in the main module of the Angular Project.

If you want to include the EkirasSocialAuthModule in the main module of the project, then you can do so as follows.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { EkirasSocialAuthModule } from 'ekiras-angular-social-auth';

@NgModule({
  declarations: [
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,

    // inlcude EkirasSocialAuthModule in the main module
    EkirasSocialAuthModule.forRoot({
      facebook: {
        appId: '<app-id>',
        options: {
          scope: '<permissions>'
        }
      }
    })
  ]
})
export class AppModule {

}

Including the Module in Shared Module of the Angular Project.

If you want to include the EkirasSocialAuthModule in a shared moduled, then you can include the module as follows

import { NgModule } from '@angular/core';
import { EkirasSocialAuthModule } from 'ekiras-angular-social-auth';

@NgModule({
  declarations: [
  ],
  imports: [

    // inlcude EkirasSocialAuthModule in the main module
    EkirasSocialAuthModule.forRoot({
      facebook: {
        appId: '<app-id>',
        options: {
          scope: '<permissions>'
        }
      }
    })
  ],
  exports: [
    EkirasSocialAuthModule
  ]
})
export class SharedModule {

}

Configuring the Module

You can configure the module with the following social provider's configurations.

Facebook Configurations.

OptionDescriptionDefault Value
appIdfacebook app idMandatory (no default value)
versionfacebook sdk version'v2.8'
asyncIf the facebook sdk should be loaded asynchronouslytrue
cookieEnable cookies to allow the server to access the sessiontrue
xfbmlparse social plugins on this pagetrue

|options 1. scope 2. returnScopes | Provide the comma separated scopes or pemissions for which the data will be fetched | public_profile | |options.returnScopes|the granted scopes will be returned in a comma-separated list in the grantedScopes| false|

Including SocialAuthService.

SocialAuthService

import { Component } from '@angular/core';
import { SocialAuthService, FacebookUserData } from 'ekiras-angular-social-auth';

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

  data: FacebookUserData;

  constructor(private socialAuthService: SocialAuthService) {

  }

  public login(provider: string) {
    this.socialAuthService.login(provider).subscribe((data: FacebookUserData) => {
       // {FacebookUserData} user data
    });
  }

  public status(provider: string) {
    this.socialAuthService.status(provider).subscribe((status: boolean) => {
      //  boolean status
    });
  }

  public logout(provider: string) {
    this.socialAuthService.logout(provider).subscribe((status: boolean) => {
      // boolean status
    });
  }

}

app.component.html

<button (click)="login('facebook');">Fb Login</button>
<button (click)="status('facebook');">Fb Status</button>
<button (click)="logout('facebook');">Fb Logout</button>

License

MIT © Ekansh Rastogi