SDK リファレンスを埋め込む

インストール

<script src="https://checkify.me/sdk/v1/checkify.min.js"></script>

読み込み後、 window.Checkify.version は SDK リリース (現在 1.0.4) を報告します。

HTML 自動マウント

SDK はページ読み込み時に次の属性を持つ要素を自動マウントします:

<div
  data-checkify-pass="YOUR_PASS_ID"
  data-checkify-request="human"
  data-checkify-text="Verify with Checkify"
  data-checkify-return-url="https://yoursite.com/done"
></div>

非推奨: data-checkify-launcher 引き続き機能しますが、ログが記録されます。コンソールの警告。代わりにパス + リクエスト タイプを使用してください。

フォーム統合属性

Checkify.bindFormを使用する場合、フォーム要素に以下の設定を行うこともできます。

Checkify.configure(options)

ウィジェットをマウントする前にグローバル デフォルトを設定します。

Checkify.configure({
  baseUrl: 'https://checkify.me',
  completeUrl: '/checkify/complete'
});

Checkify.bindForm(form, options)

Render は検証ボタンであり、非表示の入力にトークンを書き込み、検証されるまで送信を無効にします。

Checkify.bindForm('#my-form', {
  passId: 'YOUR_PASS_ID',
  requestType: 'human',
  buttonTarget: '#checkify-wrap',
  submitButton: '#submit',
  hiddenInput: '#checkify_token',
  disableSubmitUntilVerified: true
});

bindFormオプション

Checkify.bindForm(form, options) の 2 番目の引数として渡される一般的なオプション:

Checkify.createHumanGate(options)

検証が完了するまでコンテンツをブロックするフルページまたはコンテナ ゲート。

Checkify.createHumanGate({
  passId: 'YOUR_PASS_ID',
  requestType: 'human',
  container: '#gate-root',
  title: 'Verify to continue'
});

戻り URL フロー

ユーザーが Checkify アプリで検証を完了すると、クエリ文字列に checkify_request_id が含まれてサイトに戻る可能性があります。 SDK は、ロード時に Checkify.checkReturnedVerification() を自動的に呼び出します。

Checkify.verify(options)

bindForm なしのプログラム開始。DOM 要素を target として渡します（container ではありません — container は createHumanGate 専用）。フォームには bindForm を推奨します。ユーザーが完了またはキャンセルすると解決する Promise を返します。

const result = await Checkify.verify({
  passId: 'YOUR_PASS_ID',
  requestType: 'human',
  target: document.getElementById('checkify-root'),
  autoOpenModal: true
});
console.log(result.requestId); // send to your server as request_id

イベント

window.addEventListener('checkify:verified', (e) => {
  console.log('Verified', e.detail);
});

window.addEventListener('checkify:return', (e) => {
  console.log('Returned from app', e.detail);
});

window.addEventListener('checkify:status', (e) => {
  console.log('Status', e.detail);
});

window.addEventListener('checkify:error', (e) => {
  console.error('Checkify error', e.detail);
});

ステータスポーリング（オプション）

ほとんどの連携機能では、フォーム送信時に POST /v1/qr/results/verify を使用して検証を行う必要があります。埋め込み機能のないカスタムフロントエンドの場合は、ユーザーがアプリ内で検証を完了するまでの間、ステータスをポーリングすることができます。

• 古い埋め込みコードからのレガシー投票トークン:
• 開始レスポンスからのリクエストIDとステータストークン：

サーバー検証

メソッド