フォームアシスト機能
フォームアシストとは、会員の新規登録フォームなどに、ソーシャルログイン時に得られた個人情報(氏名やメールアドレス、住所など)をシステム的に自動入力し、ユーザのフォーム入力の利便性を向上させる機能です。
通常、この処理はお客様サーバ側で以下の処理実装が必要となります。
- ソーシャルPLUS Web API を用いてソーシャルログインを行なったユーザの個人情報を取得
- 取得した個人情報をフォームの初期値として埋め込んで表示する
ソーシャルPLUS が提供する「フォームアシスト機能」は、上記処理をお客様サーバ側で実装することなく、ソーシャルログインマネージャーでの設定と JavaScript タグの貼り付けのみで実現する機能となります。
事前準備
フォームアシストを利用するためにプロバイダ設定と個人情報取得設定が必要です。
フォームアシスト可能な個人情報項目
ソーシャルPLUS のフォームアシスト機能では、プロバイダごとに個人情報取得設定を行った個人情報項目を用いて、以下ような値をフォームに自動入力させることができます。 以下に記載がある項目でも、ご利用のプロバイダ設定で提供されていない個人情報項目は利用できません。
- 姓名
- 姓
- 姓(カナ)
- 姓(かな)
- 名
- 名(カナ)
- 名(かな)
- フルネーム
- フルネーム(カナ)
- フルネーム(かな)
- メールアドレス
- メールアドレス
- メールアドレス(@ より前)
- メールアドレス(@ より後)
- 電話番号
- 生年月日
- 年齢
- 生年月日
- 生年月日(年)
- 生年月日(月)
- 生年月日(日)
- 性別
- 郵便番号
- 郵便番号(7桁)
- 郵便番号(前3桁)
- 郵便番号(後4桁)
- 住所
- 全て(半角)
- 全て(全角)
- 都道府県
- 市区町村
- 番地以降(半角)
- 番地以降(全角)
- 市区町村および番地以降(半角)
- 市区町村および番地以降(全角)
すべての項目が確実に入力可能というわけではなく、ログインプロバイダでの取得可否、ユーザのソーシャルログイン時の同意状態やユーザ側のプロフィールの公開状態により、個人情報が入力されない場合があります。
ログインプロバイダごとに取得可能な個人情報については、個人情報取得設定の取得可能な個人情報ページをご確認ください。
制限事項
- フォームアシスト設定は、1つのサービス設定につき1パターンのみ登録可能です
- 対応するフィールドタイプは「テキストフィールド(一行)」、「テキストエリア(複数行)」、「ドロップダウン」、「ラジオボタン」のみとなります
- フォームアシストのタグを設置するページには、ソーシャルログイン成功時にコールバックURL に対して返される有効な「ワンタイムトークン」が
token
パラメータとして与えられている必要があります - フォームアシスト機能は JavaScript で提供されている仕様上、お客様サービスに導入されている他の JavaScript ライブラリと競合が発生する可能性があります。導入の際にはお客様サービス上で競合による問題が発生していないか検証をお願いいたします
すでに入力値のあるフォーム項目について
フォームアシスト機能では、基本的には、すでに入力値のあるフォーム項目にはフォームアシストされません。
詳しくは「フィールドタイプ」ごとに以下の条件となります。
- フィールドタイプが「ドロップダウン」の場合、選択済みの子要素が一番上の場合は選択状態を更新します
- フィールドタイプが「ラジオボタン」の場合、常に選択状態を更新します
- それ以外の場合、値が空のときのみフォームアシストします
ソーシャルログイン時のワンタイムトークンについて
フォームアシストのタグを設置するページには、ソーシャルログイン成功時にコールバックURL に対して返される有効な「ワンタイムトークン」が token
パラメータとして与えられている必要があります。
フォームアシスト機能で利用された「ワンタイムトークン」は新しい値に更新されます。そのため、コールバックURL で返された "初回のワンタイムトークン" はフォームアシスト後に無効となります。
フォームアシスト機能を実装したフォームには、自動的に、更新された新しい「ワンタイムトークン」が token
という name 属性の hidden パラメータとして追加されます。
<input type="hidden" name="token" value="{新しいワンタイムトークン}">
フォーム送信後、Web API で「ソーシャルPLUS ID」を取得するには、この "新しいワンタイムトークン" を利用して authenticated_user API を呼び出します。
設置先のフォームで先に token
というパラメータ名が使われている場合は ワンタイムトークンのパラメータ名 を参照してください。
導入の流れ
1. ソーシャルログインの設置
フォームアシストを行いたいフォームのあるページに、コールバック時に返す「ワンタイムトークン」のパラメータ token
が渡るようにソーシャルログインを設置します。
ソーシャルログインは、ポップアップ画面ではなく画面遷移で実装してください。スマートフォンのネイティブアプリ内ブラウザで正しく動作しなくなる可能性があります。
ソーシャルログイン URL は GET
メソッドのみサポートしています。
2. ソーシャルログインマネージャーでフォームアシスト設定を行う
お客様サービスのフォーム項目(name
属性値)と、利用したい「個人情報項目」の対応を[フォームアシスト設定]から設定します。
3. 貼り付けタグの設置
フォームアシストを行いたいフォームのあるページに「フォーム入力ページ」用タグ、フォームの送信完了ページに「フォーム送信完了ページ」用タグを設置します。
「フォーム送信完了ページ」用タグは、フォームアシスト機能で利用した Cookie の削除などの後処理を行いますので必ず設置してください。
4. 動作確認
設定と設置が完了しましたら、実際にソーシャルログインを行い、フォームアシストが動作するかご確認ください。
上手くフォームアシストされない場合は、以下をご確認ください。
ソーシャルログインマネージャー
- [設定]>[サービス設定]の「サービスURL」あるいは「サービスURL 以外でご利用になるドメイン」に、フォームアシストを設置するページのドメインが含まれているか
- 個人情報取得設定で、フォームアシストに必要な個人情報を取得するように設定されているか
- フォームアシスト設定で、正しく設定されているか
サービス画面(HTML)
- フォームアシスト用の貼り付けタグが正しく設置されているか
ブラウザの JavaScript コンソール
- JavaScript エラーが表示されていないか
- JavaScript エラーが表示されている場合は、一度フォームアシスト用のタグを外し、エラーが再現するかご確認ください