@wepin/pin-js

⚠️ Notice:

This package is only available for web environments and cannot be used in Android or iOS hybrid apps (Webview).

If you are using this package in a Server Side Rendering (SSR) environment, make sure to load the package only on the Client Side Rendering (CSR) side.

Please refer to the following code for implementation:

const initWepinPin = async () => {
   const { WepinPin } = await import('@wepin/pin-js');
   const wepinPin = new WepinPin({
       appKey: '',
   });
   await wepinPin.init();
}

⏩ Document

⏩ Get App Key

After signing up for Wepin Workspace, go to the development tools menu and enter the information for each app platform to receive your App ID and App Key.

⏩ Installation

To install the WepinSDK, you can use npm or yarn:

npm install @wepin/pin-js

or

yarn add @wepin/pin-js

⏩ Import WepinPin

import { WepinPin } from '@wepin/pin-js'

⏩ Initialize

Create a new instance of WepinPin and initialize it with your application's key

• defaultLanguage: The language to be displayed on the widget (default: 'ko') Currently, only 'ko', 'en' and 'ja' are supported.

const wepinPin = new WepinPin({
  appKey: 'your-wepin-api-key',
})
await wepinPin.init({
  defaultLanguage: 'ko',
})

Then use login to log in to wepin.

const loginRes = await wepinPin.login.loginWithEmailAndPassword(...)
await wepinPin.login.loginWepin(loginRes)

Or you can also pass in the WepinLogin library you created.

const wepinLogin = new WepinLogin()
const wepinPin = new WepinPin({
  appKey: 'your-wepin-api-key',
  wepinLogin,
})
await wepinPin.init({
  defaultLanguage: 'ko',
})
const loginRes = await wepinPin.login.loginWithEmailAndPassword(...)
await wepinPin.login.loginWepin(loginRes)

isInitialized

wepinPin.isInitialized()

The isInitialized() method checks WepinPin is initialized.

⏩ Examples

Open Pinpad For Register

• generateRegistrationPINBlock

const pinBlock = await wepinPin.generateRegistrationPINBlock()

fetch({
  url: 'https://sdk.wepin.io/v1/app/register',
  method: 'POST',
  // Omit authentication headers
  body: {
    // Omit other bodies
    UVD: pinBlock.UVD,
    hint: pinBlock.hint,
  }
})

Open PinPad for sign

• generateAuthPINBlock

const pinBlock = await wepinPin.generateAuthPINBlock(count)
// Sort seqNum of uvd in ascending order from 1 because I need to write it in order starting from 1
pinBlock.UVDs.sort((a, b) => (a.seqNum ?? 0) - (b.seqNum ?? 0))

const resArray: any[] = []
for (const encUVD of pinBlock.UVDs) {
  await fetch({
    url: 'https://sdk.wepin.io/v1/tx/sign',
    method: 'POST',
    body: {
      userId: await getUserId(),
      walletId: await getWalletId(),
      accountId: (await getEthereumAccount()).accountId,
      type: 'msg_sign',
      txData: {
        data: '0x0',
      },
      pin: encUVD,
      otpCode: {
        code: pinBlock.otp,
      },
    }
  })
}

Open Pinpad for change pin

• generateChangePINBlock

const pinBlock = await wepinPin.generateChangePINBlock()
const res = await fetch({
  url: 'https://sdk.wepin.io/v1/wallet/pin/change'
  body: {
    userId: await getUserId(),
    walletId: await getWalletId(),
    UVD: pinBlock.UVD,
    newUVD: pinBlock.newUVD,
    hint: pinBlock.hint,
    otpCode: {
      code: pinBlock.otp
    }
  }
})

Open OTP for failed verify otp

• generateAuthOTP

let res = await getWepinSignMessage(pinBlocks.UVDs, pinBlock.otp)
if (res.body[0].message === 'OTP_MISMATCH_WRONG_CODE') {
  const otp = await wepinPin.generateAuthOTP()
  res = await getWepinSignMessage(pinBlocks.UVDs, otp.code)
}

finalize

wepinPin.finalize()

The finalize() method finalizes the WepinPin.