Skip to main content

Angular JDK

Installation

Install Package:

npm install @netrist-smartbridge/smartbridge

Import modules in app.module.ts (You will also need to import HttpClientModule and NgbModule as dependencies):

// ...
import { CacLoginButtonModule } from '@netrist-smartbridge/smartbridge';
import { CacButtonModule } from '@netrist-smartbridge/smartbridge';
import { HttpClientModule } from '@angular/common/http';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
@NgModule({
// ...
imports: [
// ...
CacLoginButtonModule,
CacButtonModule,
HttpClientModule,
NgbModule
],
// ...
})

This sdk contains two button components for integrating with the Smartbridge platform

CAC Login Button

<cac-login-button></cac-login-button>

For integration with Smartbridge’s CAC login flow. This button allows for a streamlined login process with CAC using Smartbridge.

Usage

InputRequired?DescriptionExample
cacLoginUrlYesURL for the Smartbridge CAC LoginendpointcacLoginUrl='example.netristsmartbridge.com/cac-login'
callbackUrlYesURL where the results will be POSTedcallbackUrl='netrist.com'
clientIdYesThe Client ID specifically being used for Authorization header on the callbackclientId='clientId-1234'
styleNoany styling need for the login button in JSON formatstyle={ 'padding': '10px', 'margin': '5px' }
textNotext displayed on the button. Defaults to ‘Login with CAC’ if none is enteredtext='CAC Login'

Outputs response: JSON response with authentication success or failure, and a JWT from the transaction. Emitted as a javaScript ‘$event’ upon clicking the button.

For example:


successful cac login (success = true)
{ 'success' : 'true', 'jwt' : 'xyz...' }
unsuccessful cac login (success = false)
{ 'success' : 'false', 'jwt' : 'xyz...', 'error' : 'description of error' }

A failed request will bring up an error modal.

For example:

<cac-login-button
[style]="{'padding': '10px', 'background-color': 'blue', 'color': 'white'}"
[cacLoginUrl]="'https://example.com/cac-login'"
[callbackUrl]="'https://example.com/login'"
[clientId]="'angularClientId'"
[text]="'CAC Login'"
(response)="onLoginResponse($event)">
</cac-login-button>

Note: onLoginResponse($event) is simply an example function that takes the response JSON as an argument. Such a function would be implemented by the SDK user.

CAC Login Button

<cac-button></cac-button>

For integration with Smartbridge’s associate CAC and register CAC flows. This button allows for a streamlined cac association or registration process with CAC using Smartbridge.

Usage

InputRequired?DescriptionExample
cacUrlYesURL for the Smartbridge CAC endpointcacUrl='example.netristsmartbridge.com/cac'
callbackUrlYesURL where the results will be POSTedcallbackUrl='netrist.com'
clientIdYesThe Client ID specifically being used for Authorization header on the callbackclientId='clientId-1234'
styleNoany styling need for the login button in JSON formatstyle={ 'padding': '10px', 'margin': '5px' }
textNotext displayed on the button. Defaults to ‘Login with CAC’ if none is enteredtext='CAC Login'

Outputs response: JSON response with authentication success or failure, and a JWT from the transaction. Emitted as a javaScript ‘$event’ upon clicking the button.

For example:

On successful CAC association (success = true):

{ 'success' : 'true', 'jwt' : 'xyz...' }

On unsuccessful CAC association (success = false):

{ 'success' : 'false', 'jwt' : 'xyz...', 'error' : 'description of error' }

A failed request will bring up an error modal.

For example


<cac-button
[style]="{'padding': '10px', 'background-color': 'green', 'color': 'white'}"
[callbackUrl]="'https://example.com/associateCac'"
[cacUrl]="'https://example.com/cac'"
[clientId]="'angularClientId'"
[text]="'Register a CAC'"
(response)="onCACResponse($event)"
>
</cac-button>

Note: onCACResponse($event) is simply an example function that takes the response JSON as an argument. Such a function would be implemented by the SDK user.