corp
1
みなさん、お晩です。
いつもお世話になっております!
5桁の認証コードを使って2段階認証を実装します。
普通に実装するのはできました。しかし、以下を実現したくて方法が分からず困っています。
★認証コードの入力欄は1つのInputではなく、5つのInputにしたいです
★Input code1〜5の値を合体させて5桁の整数にしたいです
解決できるアプローチをご存知の方がいたらぜひアドバイスしていただけると助かります。
よろしくお願いいたします!
実装したい機能や前提条件
───────────────────
■使用しているプラグイン
Random Number Generator
■signup
・名前やメールアドレス入力欄、「登録」ボタンがある画面です
・登録ボタンをクリックしたら添付画像のようなワークフローでメールアドレス宛に認証コード5桁を送信します
・認証コードはRandom Number Generatorで生成します
■signup_confirm
・認証コードを入力する画面です
・認証コード入力欄と「登録」ボタンを設置します
・認証コードの入力欄は1つのInputではなく、添付画像のように5つのInputにしたいです
・InputのContent formatはIntegerです
・登録ボタンをクリックしたらMake changes to Userで、認証ステータスをyesに更新します
スクリーンショット
corp
2
昔、エキスパートのあき様がX(旧:Twitter)で紹介していたものが実装イメージです!
本人登場で恐縮ですが、Javascriptを書くと可能です。
Toolboxのプラグインを入れて、RunJavascriptのアクションの中にJSを書いて、
その値をJavascripttoBubbleで受け取って評価する、という流れです。
まずはローカルでJSを書いてフォームを作成したのち、
それを上記の方法でBubbleに落とし込む、という順序でやるとスムーズにできると思います
「いいね!」 2
あと、入力されたコードの正否の評価は、
クライアント側で行うと認証コードの正解がバレるので、
Privacy ruleを正しく設定した後、Backend workflowを使って行います。
「いいね!」 2
corp
5
あきさんご本人からご指導いただけて光栄です!ありがとうございます!
ひとまずご教示いただいた以下の手順で頑張ってみます!
・ローカル環境でJSを書いて認証コード入力フォームを実装する
・プラグイン「Toolbox」をインストール
・ワークフローでPlugin > Run javascriptでJSのコードを貼り付ける
・その値をJavascript to Bubbleで受け取って正否を評価する
corp
6
クライアント側で行うと認証コードの正解がバレるので、Privacy ruleを正しく設定した後、Backend workflowを使って行います。
こちらも補足していただき、誠にありがとうございます!
そこ考慮できていなかったのでご指摘大変ありがたいです。
頂いた情報を整理して実装引き続き頑張ってみます!
corp
8
完成形にかなり近づいてきました。
JavaScriptで各Inputに入力された数字を左から順に合体させて5桁の数字にする
その数字をJavaScriptで1つのInputのvalueにセットする