Applying Javascript SDK

Apply SDK to project

You can download the latest file from SDK download page. Include downloaded JavaScript SDK script file path to web page.

SDK initialization

App information registered in developer center include client id and Javascript secret key.

process initialization using given data as follows

SDK import

include downloaded sdk file path to SDK-FILE-PATH

<script src="SDK-FILE-PATH"></script>

Initialize SDK

Assign client id and Javascript secret key to CLIENT-ID, SECRET-KEY, and URL to REDIRECT-URL in order to receive the result of authentication request

REDIRECT-URL should be the URL registered in the Login API setting of Developer center.

<script>
  var ifreeLogin = new ifree.Login();
  ifreeLogin.init({
    client_id: 'CLIENT-ID',
    secret_key: 'SECRET-KEY',
    is_popup: false,	// is popup being used?
    redirect_url: 'REDIRECT-URL'
  });
</script>

Login request

JavaScript SDK login request is provided in two styles : Redirect/Popup

Redirect style Login

If you opt out Popup when you initialize SDK, check the authentication request and response.

Authentication result is provided through REDIRECT-URL that you registered.

- Authentication Success : http://REDIRECT-URL?code={response code}&state={state value}&ptn_token={ptn_token}&ptn_cd={partner associated user code}
- Authentication Fail : http://REDIRECT-URL?code={response code}&state={state value}

Below is an example when the authentication request page and the authentication confirmation page are the same.

<script>
var ifreeLogin = new ifree.Login();
ifreeLogin.init({
  client_id: 'CLIENT-ID',
  secret_key: 'SECRET-KEY',
  is_popup: false,	// is popup used?
  redirect_url: 'REDIRECT-URL'
});

// Example for authentication request response
window.addEventListener('load', function(e) {
  ifreeLogin.getLoginResult(function(result) {
    if (result.code == 'success' && result.ptn_token) {
      // TODO login partner using ptn_token (REST API communication)
    } else {
      // Authentication fail message
      console.log(JSON.stringify(result));
    }
  });
});

...

// Request Authentication
// STATE-TOKEN : in order to prevent cross-site request forgery, apply URL Encoding to state token which was created in application
ifreeLogin.login('STATE-TOKEN');
</script>

Popup style Login

Check authentication request and result in case when popup is opted in during SDK initialization

<script>
var ifreeLogin = new ifree.Login();
ifreeLogin.init({
  client_id: 'CLIENT-ID',
  secret_key: 'SECRET-KEY',
  is_popup: true,	// is popup being used?
  redirect_url: 'REDIRECT-URL'
});

... 

// Request Authentication
// callback : calllback function to check result for login request
// STATE-TOKEN : in order to prevent cross-site request forgery, apply URL Encoding to state token which was created in application
ifreeLogin.popupLogin(function callback(result) {
  if (result.code == 'success' && result.ptn_token) {
    // TODO login partner using ptn_token (REST API communication)
  } else {
    // check authentication fail message
    console.log(JSON.stringify(result));
  }
}, 'STATE-TOKEN');
</script>

Login Response Information

LoginResult is provided as a result of each login request.
You can use the ptn_token in the response information provided to complete the login with the REST API communication, and use state to verify the STATE-TOKEN passed when the application requests a login.

LoginResult

export interface LoginResult {
  /** response code */
  code: ResultCode
  /** response message */
  message?: string
  /** authentication token for access-token issuance */
  ptn_token?: string
  /** partner associated user code */
  ptn_cd?: string
  /** state token to prevent CSRF */
  state?: string
}

ResultCode