一般的に言って、大半のウェブサイトはユーザー登録とユーザーログインという基本的な機能を持っています。
では、ユーザー登録は具体的にどのように行われるのでしょうか？
この2日間は、登録のためのビジネスロジックがどのように書かれているかを学ぶことに重点を置きます。
簡単なビジネス分析から始めましょう：
登録とは、ユーザーが自分自身に関する情報を入力することで、基本的にはデータベースにデータを追加することです。
ブラウザはサーバーにアクセスするリクエストを送信し、サーバーはデータベースにアクセスしてデータを照会し、ユーザー登録が成功したかどうかを判断します：
- 成功：メールを送信し、対応するページにジャンプし、ユーザーが送信したデータをデータベースに追加します。
- 失敗：例えば、ユーザー名が既に存在する場合、登録に失敗した理由をユーザーにプロンプトする必要があります。
イラストを描くために小さな図を描いてください：
上記は基本的な登録ビジネスロジックです。
もちろん、その方法はバックエンドからユーザーによって送信されたデータが正しいかどうかをチェックすることであり、実際には最初にフロントエンドでチェックすることができます。
I. フォームのフロントエンド検証
フロントエンドのチェックサムは優先度判定として機能し、例えば多くの不要なリクエストを止めることができます：
- ユーザー名が空の場合、直接投稿することはできません。
- Eメールには書式がありますので、無差別に記入しないでください。
- また、携帯電話番号にも対応するフォーマットがあり、無差別に記入することはできません。
また、ユーザーが入力したデータが対応するフォーマットを満たしていない場合、リクエストを送信することができないため、より多くのリソースを節約することができます。
ですから、フロントエンドとバックエンドのそれぞれに明確な役割分担があります：
- フロントエンドはデータの完全性と正当性をチェックします。
- バックエンドはデータの一意性をチェックします。
フロントエンドのキャリブレーションはどのように行うのですか？
jQueryのフォーム検証ツールvalidateを使うだけです：
フォーム検証ツール validate
jquery.validate.jsを導入したら、このツールを使ってみましょう。
registerFormは私のプロジェクトの登録フォームに対応するidで、idセレクタを通してさらに検証する登録フォームを選択することができます。
フォーム検証ルール
ルールとは、フォームのバリデーションルールを定義できることを意味します。
- usernameとemail: フォームの属性に対応します。
- required: この属性に対応する値が NULL であってはならないことを示します。
- email: メールボックスに対応するチェックサム規則を示します。
もちろん、フォームの属性はこの2つだけではありません。
この2つを例に挙げただけで、そうでなければスクリーンショットに載せるには属性が多すぎますし、コードの書き方も実はほとんど同じです。
カスタムエラーメッセージ
II.カスタマイズされたチェック・ルール
上記はすべてvalidateプラグインに付属しているバリデーションルールですが、カスタマイズが必要なものもあります。
例えば、電話番号は国によって異なるため、チェックサムルールをカスタマイズする必要があります。
カスタム判定ロジックが追加されている以外は、コードはほとんど同じように書かれています。
チェックルールのカスタマイズ
私の側のカスタム名はphoneFmtで、パラメータはtrueです。
これは、対応するチェックサムの要件を満たす必要があることを意味し、そうでない場合はエラーメッセージが表示されます。
addMethodメソッド
特定のチェックサムロジックは、3つのパラメータを持つこのメソッドを使用して実装することができます：
- 校正ルール名：①の校正ルール名に対応します。
- 関数：つまり、特定のチェック・ロジック。
- 「不正な携帯電話番号」：エラーメッセージとしても知られています。
これらのパラメーターのうち、2番目のパラメーターは、関数にも3つのパラメーターがあります：
- value: チェックされているテキストボックスの値、この場合はユーザーが電話番号フィールドに入力したデータ。
- 要素: チェックされるルールのテキストボックス。
- params: チェックルールのパラメータを受け付けます。
校正ロジック
new RegExp() は、対応する正規マッチング規則を作成することを意味します。
正規表現については、完全に理解するのは難しいので、何度もウェブで調べる必要があります。
しかし、インターネット上に多くのリソースがあるとはいえ、それらを読んで理解できることが重要であり、照会情報は以下の通りです：
プロファイルは、特定のマッチングルールを2つのスラッシュ:/ /でラップして正規表現を作成します。
最初はnew RegExp()を使いました。
また、"^1[34578]˶d{9}$"とはどういう意味ですか？
- 1：これは、最初の桁が1でなければならないことを意味します。
- [34578]：2桁目が34578のいずれかでなければならないことを示します。
- d{9}$: あと9桁あることを示します。
合計で11桁になり、これはちょうど全国の携帯電話番号の長さです。
上記はカスタムチェックサムルール用に書かれたコードです。
実際、このルールは複数のページに必要です。例えば、登録ページにも必要ですし、ログインページにも必要です。
そうであれば、それをjsファイルにカプセル化し、そのチェック・ルールを使用する必要があるページがあれば、そのjsファイルを持ってくればいいのです：
上記は、カスタム・チェックサム・ルールのカプセル化で、ツール・クラスのカプセル化におけるJavaコードと多少似ています。
この2日間、未解決のバグに遭遇し、勉強の効率が少し悪くなってしまったので、早く調整したいです。
