Nourishing Plushie Monster

    cap-authorization
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.9 • Public • Published

    CAP AUTHENTICATION

    This module implements ionic complements but maybe in future releases, we could implement bootstrap.

    CAP AUTHENTICATION it's a module that provides:

    • registration
    • login
    • change password

    This module implements ionic complements but maybe in future releases, we could implement bootstrap.

    Installation Authentication module

    Installation

    npm i cap-authorization
    

    Configuration

    Add the module into the app module or into the module that you want to implement this module after that write your credentials.

    import { AuthenticationModule } from 'cap-authorization'
    

    into the import section

    AuthenticationModule.forRoot({
          apiUrl: 'your-apiUrl',
          loginEndpoint: 'your-user',
          facebookId: 'your-facebook-id',
          googleId: 'your-google-id',
        }),
    

    Login Component

    The login component implement angular5-social-login for login with social media (Facebook and Google +). Into the module of Authentication write your credentials of Facebook and Google +.

    Facebook credentials

    For use the facebook login you have to create an account in Facebook for developers and add a new application.

    Google credentials

    Like Facebook you have to create an account in Google for developers and add a new product or service.

    Tags

    auth-app-login

    The tag or selector auth-app-login provides an interface with two inputs and four buttons.

    Example

    <h1>Login</h1>
    <auth-app-login></auth-app-login>
    

    previews

    auth-app-login

    The target or selector auth-app-change-password provides an interface with two inputs and two buttons.

    Example

    <h1>Change password</h1>
    <auth-app-change-password></auth-app-change-password>
    

    previews

    auth-app-register

    The target or selector auth-app-register provides an interface with two inputs and two buttons.

    Example

    <h1>Register</h1>
     <auth-app-register></auth-app-register>
    

    previews

    Services

    If you want yo get the information of the user login with Facebook or Google you could use the getUserData method. This method is inside of the Authentication service and returns an object with the data of the social media.

    Implementation into a module

    For use this module go to app module and into the sections of import put the authentintication module.

            ...
        imports: [
            AuthenticationModule.forRoot({
                apiUrl: 'http://localhost:3000', // API Url
                loginEndpoint: 'users'  // [users or admin] endPoint in Loopback (for http://localhost:3000/users/login)
                
            })
        ]
        ...

    import the authentication services to use in a component:

    import { AuthenticationService } from './services/authentication.service';
    ...
    constructor(private authenticationService: AuthenticationService) {
        this.authenticationService.isAuthenticated());
    } 
    

    Exposed Methods

    This method returns a Boolean value with the value isLoggedIn

    isAuthenticated()

    Receive a credentials interface

    login(values: CredentialsInterface)

    If is a login success set the token and isLoggedIn in localstorage and variable isLoggedIn as true.

    (email: string and password: string)

    Remove token and isLoggedIn from localStorage and the variable isLoggedIn set to false.

    logout(): void


    Component Selectors

    Each component refers to selectors.

    auth-app-login

        @Output()
        submit: EventEmitter<any> = new EventEmitter();
    
        @Output()
        changePage: EventEmitter<boolean> = new EventEmitter();
    

    auth-app-register

        @Output()
        submit: EventEmitter<any> = new EventEmitter();
        
        @Output()
        changePage: EventEmitter<boolean> = new EventEmitter(); 
    

    auth-app-change-password

        @Output()
        submit: EventEmitter<any> = new EventEmitter();
    
        @Output()
        changePage: EventEmitter<boolean> = new EventEmitter();
    

    More information HERE

    Install

    npm i cap-authorization

    DownloadsWeekly Downloads

    1

    Version

    0.0.9

    License

    MIT

    Unpacked Size

    261 kB

    Total Files

    62

    Last publish

    Collaborators

    • software-allies