Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -32,5 +32,7 @@ Desktop.ini
**/*.ngfactory.ts

# Build files
dist/*
# dist/*
build/*

package-lock.json
146 changes: 146 additions & 0 deletions dist/README.MD
Original file line number Diff line number Diff line change
@@ -0,0 +1,146 @@
# Original project : sabyasachibiswal https://github.com/sabyasachibiswal/angular5-social-login


Social login api for Angular 6. Includes Facebook, Google login and Linkedin.

![Generic badge](https://img.shields.io/badge/build-passing-green.svg)
![Generic badge](https://img.shields.io/badge/Angular-6-green.svg)
[AOT](https://angular.io/guide/aot-compiler) Compatible.


## Getting started


### Install via npm

```sh
npm install --save angular-6-social-login
```

### Import the module

In `app.module.ts`,

```javascript
...

import {
SocialLoginModule,
AuthServiceConfig,
GoogleLoginProvider,
FacebookLoginProvider,
LinkedinLoginProvider,
} from "angular-6-social-login";


// Configs
export function getAuthServiceConfigs() {
let config = new AuthServiceConfig(
[
{
id: FacebookLoginProvider.PROVIDER_ID,
provider: new FacebookLoginProvider("Your-Facebook-app-id")
},
{
id: GoogleLoginProvider.PROVIDER_ID,
provider: new GoogleLoginProvider("Your-Google-Client-Id")
},
{
id: LinkedinLoginProvider.PROVIDER_ID,
provider: new LinkedinLoginProvider("1098828800522-m2ig6bieilc3tpqvmlcpdvrpvn86q4ks.apps.googleusercontent.com")
},
];
);
return config;
}

@NgModule({
imports: [
...
SocialLoginModule
],
providers: [
...
{
provide: AuthServiceConfig,
useFactory: getAuthServiceConfigs
}
],
bootstrap: [...]
})

export class AppModule { }

```

### Usage :

In `signin.component.ts`,

```javascript
import {Component, OnInit} from '@angular/core';
import {
AuthService,
FacebookLoginProvider,
GoogleLoginProvider
} from 'angular-6-social-login';

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


export class SigninComponent implements OnInit {

constructor( private socialAuthService: AuthService ) {}

public socialSignIn(socialPlatform : string) {
let socialPlatformProvider;
if(socialPlatform == "facebook"){
socialPlatformProvider = FacebookLoginProvider.PROVIDER_ID;
}else if(socialPlatform == "google"){
socialPlatformProvider = GoogleLoginProvider.PROVIDER_ID;
} else if (socialPlatform == "linkedin") {
socialPlatformProvider = LinkedinLoginProvider.PROVIDER_ID;
}

this.socialAuthService.signIn(socialPlatformProvider).then(
(userData) => {
console.log(socialPlatform+" sign in data : " , userData);
// Now sign-in with userData
// ...

}
);
}

}
```



In `signin.component.html`,

```html
<h1>
Sign in
</h1>

<button (click)="socialSignIn('facebook')">Sign in with Facebook</button>
<button (click)="socialSignIn('google')">Sign in with Google</button>
```



### Facebook App Id :

You need to create your own app by going to [Facebook Developers](https://developers.facebook.com/) 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](https://developers.google.com/identity/sign-in/web/devconsole-project).

5 changes: 5 additions & 0 deletions dist/angular-6-social-login.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
/**
* Generated bundle index. Do not edit.
*/
export * from './index';
export { BaseLoginProvider as ɵa } from './entities/base-login-provider';
1 change: 1 addition & 0 deletions dist/angular-6-social-login.metadata.json
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
{"__symbolic":"module","version":3,"metadata":{"SocialLoginModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule"},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule"}],"providers":[{"__symbolic":"reference","name":"AuthService"}]}]}],"members":{}},"AuthService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable"}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"AuthServiceConfig"}]}],"signIn":[{"__symbolic":"method"}],"signOut":[{"__symbolic":"method"}]},"statics":{"LOGIN_PROVIDER_NOT_FOUND":"Login provider not found"}},"AuthServiceConfig":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"Array","arguments":[{"__symbolic":"reference","name":"any"}]}]}]}},"LoginProvider":{"__symbolic":"interface"},"SocialUser":{"__symbolic":"class","members":{}},"LoginProviderClass":{"__symbolic":"class","members":{}},"LinkedInResponse":{"__symbolic":"class","members":{}},"FacebookLoginProvider":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵa"},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"string"}]}],"initialize":[{"__symbolic":"method"}],"signIn":[{"__symbolic":"method"}],"signOut":[{"__symbolic":"method"}]},"statics":{"PROVIDER_ID":"facebook"}},"GoogleLoginProvider":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵa"},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"string"}]}],"initialize":[{"__symbolic":"method"}],"drawUser":[{"__symbolic":"method"}],"signIn":[{"__symbolic":"method"}],"signOut":[{"__symbolic":"method"}]},"statics":{"PROVIDER_ID":"google"}},"LinkedinLoginProvider":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"ɵa"},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"string"}]}],"initialize":[{"__symbolic":"method"}],"onLinkedInLoad":[{"__symbolic":"method"}],"drawUser":[{"__symbolic":"method"}],"signIn":[{"__symbolic":"method"}],"signOut":[{"__symbolic":"method"}]},"statics":{"PROVIDER_ID":"linkedin"}},"ɵa":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor"}],"initialize":[{"__symbolic":"method"}],"signIn":[{"__symbolic":"method"}],"signOut":[{"__symbolic":"method"}],"loadScript":[{"__symbolic":"method"}]}}},"origins":{"SocialLoginModule":"./auth.module","AuthService":"./auth.service","AuthServiceConfig":"./auth.service","LoginProvider":"./entities/login-provider","SocialUser":"./entities/user","LoginProviderClass":"./entities/user","LinkedInResponse":"./entities/user","FacebookLoginProvider":"./providers/facebook-login-provider","GoogleLoginProvider":"./providers/google-login-provider","LinkedinLoginProvider":"./providers/linkedin-login-provider","ɵa":"./entities/base-login-provider"},"importAs":"angular-6-social-login"}
Loading