メール認証会員登録フォーム
最終更新日:2024年03月04日
SPIRALver.1では、各種サービスにおける会員登録の際に利用するWebフォームを作成することができます。
メール認証を用いることで、メールアドレスの誤登録や不正登録等を防止することができます。
今回はメール認証型の会員登録フォームについてご紹介します。
アプリ作成
アプリを作成します。
作成するWebフォームやDBはアプリに入れると管理しやすくなるため、アプリを作成します。
アプリの詳細については「アプリ-機能詳細」をご覧ください。
DB作成
アプリ作成後、会員登録フォームから登録されたデータを格納するDBを作成します。
DB作成はアプリ作成画面から行います。
今回は仮登録DB、本登録DBの2つのDBを作成します。
仮登録DBはトランザクションDB、本登録DBは通常DBで作成します。
トランザクションDBを利用することで、仮登録分のレコード数を節約できます。
通常DBの詳細についてはこちらをご確認ください。
トランザクションDBの詳細についてはこちらをご確認ください。
例えば会員登録フォームの場合、DBに必要なフィールドは以下が考えられます。
フィールドタイプの詳細については「フィールドタイプリファレンス」をご覧ください。
仮登録DB
| DBの種類 | トランザクションDB |
|---|
| フィールドタイプ | フィールド名 |
|---|---|
| 登録日時 | TRDB_登録日時 |
| メールアドレス（大・小文字無視） | メールアドレス
※「入力必須」に設定してください。 ※差し替えキーワードを「email」と設定してください。 |
本登録DB
| DBの種類 | 通常DB |
|---|
| フィールドタイプ | フィールド名 |
|---|---|
| メールアドレス（大・小文字無視） | メールアドレス
※「主キー」に設定してください。 ※差し替えキーワードを「email」と設定してください。 |
| テキストフィールド(64 bytes) | お名前（姓） |
| テキストフィールド(64 bytes) | お名前（名） |
| メッセージダイジェスト(SHA256) | パスワード |
| 電話番号 | 電話番号 |
| 郵便番号 | 郵便番号 |
| 都道府県 | 都道府県 |
| テキストフィールド(128 bytes) | 市区町村 |
| テキストフィールド(128 bytes) | 番地 |
| テキストフィールド(128 bytes) | 建物名・部屋番号 |
| 登録日時 | 登録日時 |
| 日付（○年○月○日 ○時○分○秒） | 最終更新日時 |
| 不正アドレスフラグ | 不正アドレスフラグ |
| モバイルドメインフラグ | モバイルドメインフラグ |
| 重複フラグ | 重複フラグ |
| エラーカウント | 配信エラーカウント |
| オプトアウト | オプトアウト |
| 簡易パスワード | 変更・停止キー |
| テキストフィールド(128 bytes) | ユーザーエージェント |
「差替キーワード」
差し替えキーワードには任意の値を入力します。
未入力の状態でDBを発行すると自動発番された値が設定されます。
「メールアドレス」について、仮登録DBと本登録DBとで同じ値に揃えておくと、後述のマイエリア設定時に設定しやすくなります。
「オプトアウト」フィールド設定
会員向けに広告宣伝メール等を配信する場合、メール受信者がメール購読の停止（解除）を申請できる導線を用意する必要があります。
オプトアウトフィールドを利用することで、配信停止受付および配信停止者の管理を行うことができます。
詳しい設定方法は「配信停止を受け付けたい」をご確認ください。
「変更・停止キー」の発番
「変更・停止キー」は、「認証キー」として使用するフィールドで、「フィールド値自動生成トリガ」を使用し「数字・アルファベット・記号」で値を自動生成してください。
「認証キー」は、今後会員情報変更フォーム等の更新フォームを作成する場合に必要となります。
詳細については以下をご覧ください。
・「フィールド値自動生成トリガとはどんな機能ですか」
・「フィールド値自動生成トリガ」
フォーム作成
会員登録フォームとしてWebフォームを作成します。
仮登録フォーム、本登録フォームの２つのフォームを作成します。
フォーム作成はアプリ作成画面から行います。
Webフォームの詳細は「フォーム」をご覧ください。
仮登録フォーム
完成形はこのようになります。
フォームの使用フィールドは以下を参考に作成ください。
| 基本情報 | |
|---|---|
| DB | 仮登録DB |
| 名前 | 仮登録フォーム
※任意の名前を設定できます。 |
| タイトル | form1
※任意のタイトルを設定できます。 |
| フォーム作成 | |
| デバイスの種類 | ※アクセスが想定されるデバイスを選択ください。 |
| タイプ | 新規登録 |
| 使用フィールド | |
| フィールド | 入力設定 |
| TRDB_登録日時 | 特殊入力 登録日時自動取得 |
| メールアドレス | 入力項目として使用する |
本登録フォーム
完成形はこのようになります。
フォームの使用フィールドは以下を参考に作成ください。
※メールアドレス等フォーム上に表示（編集不可）させたいフィールドは、「フィールド別チェック」で「フォーム表示：表示する」にしてください。
| 基本情報 | |
|---|---|
| DB | 本登録DB |
| 名前 | 本登録フォーム |
| タイトル | form2 |
| フォーム作成 | |
| デバイスの種類 | ※アクセスが想定されるデバイスを選択ください。 |
| タイプ | 新規登録 |
| 使用フィールド | |
| フィールド | 入力設定 |
| メールアドレス | 特殊入力 値を引継ぐ（hidden） |
| お名前（姓） | 入力項目として使用する |
| お名前（名） | 入力項目として使用する |
| パスワード | 入力項目として使用する |
| 電話番号 | 入力項目として使用する |
| 郵便番号 | 入力項目として使用する |
| 都道府県 | 入力項目として使用する |
| 市区町村 | 入力項目として使用する |
| 番地 | 入力項目として使用する |
| 建物名・部屋番号 | 入力項目として使用する |
| 登録日時 | 特殊入力 登録日時自動取得 |
| 最終更新日時 | 使用しない |
| オプトアウト | 使用しない |
| 変更・停止キー | 使用しない |
| ユーザーエージェント | 特殊入力 登録者ユーザエージェント自動取得 |
マイエリア発行
仮登録DBからマイエリアを発行し、発行したマイエリア内に本登録フォームを設置することで、仮登録フォームで入力されたメールアドレス情報を本登録フォームに引き継ぐことができます。
マイエリアの詳しい設定方法は「マイエリア＞クリックログインの設定方法」「マイエリア＞クリックログインページ」「マイエリア」をご確認ください。
フォーム機能で作成した本登録フォームのHTMLソースをマイエリア内に設置するため、フォーム機能でHTMLファイルをダウンロードしておきます。
フォーム機能の入力ページ設定にて、外部設置用HTML＞マイエリア用ファイルの「設定デザイン」をクリックし、HTMLファイルをダウンロードします。
※「仮登録フォーム」ではなく、「本登録フォーム」のマイエリア用ファイル（HTMLファイル）をダウンロードします。
以下の設定内容を参考にマイエリアを新規作成します。
設定例
| 基本設定 | |
|---|---|
| DB | 仮登録DB |
| 名前 | 会員マイエリア |
| タイトル | memberMyArea |
| 認証設定 | |
| 識別キー | ID |
| パスワード | 使用しない |
| FIDO認証 | 使用しない |
| 自動発行キー | 使用しない |
カスタムページにて「新規作成」をクリックし、本登録フォームを設置するページを作成します。
カスタムページに、フォーム機能で作成した本登録フォームのHTMLソースを適用します。
先ほどダウンロードしたフォームのHTMLファイルをテキストで開き、仮登録DBに存在しないフィールド（お名前、パスワード、住所等）の差替えキーワード（%val:usr:xxxxx%）を削除してください。
その際、メールアドレスの差し替えキーワード（%val:usr:email%）は削除しないようご注意ください。
HTMLソースに関する詳細はこちらをご確認ください。
削除前
削除後
編集したソースをカスタムページの「ページソース」へ貼り付け、「変更」ボタンをクリックし保存します。
※仮登録DBと本登録DBのメールアドレスの差し替えキーワードを同じ値にしていない場合は、「差替えキーワード」ボタンをクリックし、メールアドレスの差し替えキーワードをコピーの上、ソース内のメールアドレスの差し替えキーワードと差し替えてください。
クリックログインページ設定にて、使用設定を「使用する」に変更し、「変更」ボタンをクリックし保存します。
公開・非公開設定にて、作成したマイエリアのステータスを「公開」に変更し、「変更」ボタンをクリックし保存します。
サンクスメール設定
サンクス配信機能を利用し、仮登録フォーム登録後、本登録フォームの案内メールを送ります。
文面設定時に「差替えキーワード」を選択し、「クリックログインURL」から作成したカスタムページのURL（%url/https:XXXXXX%&mp=yyyyyy）を選択し、文面に反映してください。
サンクス配信の設定方法については「サンクス配信」をご確認ください。
本登録案内メール（仮登録完了メール）
| リスト作成 | |
|---|---|
| DB | 仮登録DB |
サンクス配信設定後、URL有効期間設定を行います。
任意の有効期間を入力し「設定」ボタンをクリックします。
URL有効期間設定に関する詳細は「URL有効期間設定とはどのような機能ですか」をご確認ください。
本登録フォーム登録後の登録完了メールもサンクス配信機能を利用して作成ください。
サンクス配信の設定方法については「サンクス配信」をご確認ください。
本登録完了メール
| リスト作成 | |
|---|---|
| DB | 本登録DB |
動作確認
作成した仮登録フォームおよび本登録フォームが正常に動作するか確認します。
仮登録フォームからテスト登録を行い、受信したサンクスメール内の本登録ＵＲＬをクリックして、ページの挙動やレコード情報をご確認ください。
仮登録フォームの動作確認
フォーム作成後のトップページに記載されているURLから実際にテスト登録を行います。
仮登録データの確認
仮登録フォームから送信したデータがDBに登録されているか「データ操作（DBオペレーション）」から確認します。
サンクスメールの確認
届いたサンクスメールの文面を確認し、クリックログインURLから本登録フォームへ遷移できるか確認します。
URL有効期間設定をしている場合、有効期間超過後、本登録フォームへ遷移できないようになったか確認します。
本登録フォームの動作確認
メール文中のURLから本登録フォームへ遷移し、動作確認を行います。
本登録データの確認
本登録フォームから送信したデータがDBに登録されているか「データ操作（DBオペレーション）」から確認します。
特に、メールアドレスは仮登録フォームから本登録フォームへ引き継いでいるフィールドのため、正常に登録できているかご確認ください。