フロントエンド検証コード画像の生成と検証は、参照のためにスプリングブートの下に実装されています。特定のコンテンツは次のとおりです
1。効果
検証コードをクリックして、新しい検証コードを取得します
2。原則
背景は検証コード画像を生成し、写真をフロントデスクに渡します。
背景は、セッション内の検証コードコンテンツを保存します。
フロントデスクに確認コードを入力した後、それは背景に渡され、検証のためにセッションで保存された検証コードを取得します。
検証コードの平易なテキストをフロントエンドに送信できないことに注意してください。フロントエンドコンテンツは透明で安全ではありません。検証コードは、人だけでなくロボットを防ぐために使用されます。検証コードがフロントエンドに明確に送信されると、簡単にクラックできます。
3。画像生成
検証コード生成ツールクラスrandomvalidatecodeutil
public class randomvalidatecodeutil {public static final string randomcodekey "; //キープライベート文字列randString =" 0123456789 "; //数字のみの文字列をランダムに生成します//プライベート文字列randString =" abcdefghijklmnopqrstuvwxyz "; ruand with strings"; "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ"; //数字と文字のランダム生成文字プライベートint width = 95; //画像幅private height = 25; // image height private int linesize = 40; //干渉ラインの数字private int stringnum = 4; loggerfactory.getLogger（randomvalidatecodeutil.class）;プライベートランダムランダム= new Random（）; / *** get font*/ private font getfont（）{return new font（ "sixtsys"、font.center_baseline、18）; } / *** get color* / private color getRandColor（int fc、int bc）{if（fc> 255）fc = 255; if（bc> 255）bc = 255; int r = fc + random.nextint（bc -fc -16）; int g = fc + random.nextint（bc -fc -14）; int b = fc + random.nextint（bc -fc -18）;新しい色（r、g、b）を返します。 } / ***ランダムイメージを生成* / public void getRandCode（httpservletrequest request、httpservletResponse応答）{httpsession session = request.getSession（）; // bufferedimageクラスはバッファを備えた画像クラスであり、画像クラスは画像情報を記述するために使用されるクラスですbufferedimage画像= new bufferedimage（width、height、bufferedimage.type_int_bgr）;グラフィックg = image.getgraphics（）; //画像オブジェクトのグラフィックオブジェクトを生成します。オブジェクトG.fillRect（0、0、width、height）を変更することにより、画像上のさまざまな図面操作を実行できます。 i ++）{drawline（g）; } // randomstring randomstring = ""; for（int i = 1; i <= stringnum; i ++）{randomstring = drawstring（g、randomstring、i）; } logger.info（randomstring）; //生成されたランダム文字列をセッションセッションに保存します。RemoveAttribute（randomCodeKey）; session.setattribute（randomcodekey、randomstring）; g.dispose（）; try {// flowing form imageio.write（image、 "jpeg"、respons.getOutputStream（））を介してメモリ内の画像をクライアントに出力します。 } catch（Exception e）{logger.error（ "flow >>>>"、e）を介してメモリ内の画像をクライアントに出力できなかった。 }} / *** draw string* / private string drawstring（グラフィックG、文字列randomstring、int i）{g.setfont（getFont（））; g.setColor（new Color（random.nextint（101）、random.nextint（111）、random .nextint（121）））; string rand = string.valueof（getrandomsstring（random.nextint（randstring .length（））））; randomstring += rand; g.Translate（random.nextint（3）、random.nextint（3））; G.ドローストリング（Rand、13 * I、16）;ランダムストリングを返します。 } / ***干渉線を描画* / private void drawline（graphics g）{int x = random.nextint（width）; int y = random.nextint（height）; int xl = random.nextint（13）; int yl = random.nextint（15）; G.drawline（x、y、x + xl、y + yl）; } / ***ランダム文字を取得* / public string getRandomString（int num）{return string.valueof（randstring.charat（num））; }}コントローラーで、メソッドを呼び出して確認コード画像を生成し、画像をフロントエンドに渡します
/***検証コードを生成*/@requestMapping（value = "/getverify"）public void getverify（httpservletrequest request、httpservletresponse response）{try {respons.setcontenttype（ "image/jpeg"）; 「no-cache」）; //応答ヘッダー情報を設定して、このコンテンツResponse.setheader（ "cache-control"、 "no-cache"）をキャッシュしないようにブラウザーに伝えるように指示します。 Response.SetDateHeader（ "Expire"、0）; randomvalidatecodeutil randomvalidatecode = new RandomValidateCodeutil（）; randomValidateCode.getRandCode（request、response）; //出力検証コード画像メソッド} catch（例外e）{logger.error（ "検証コード>>>>"、e）; }}フロントエンドは、検証コード画像を取得します
HTML
<div> <div> <入力タイプ= "tel" id = "verify_input" placeholder = "を入力してください" maxlength = "4"> </div> </div> <div> <a href = "javascript：void（0）;" rel = "外部nofollow"> <img id = "imgverify" src = "" onclick = "getverify（this）;"> </a> </div> </div>
JS
//検証コード関数getverify（obj）{obj.src = httpurl + "/sys/getverify？" + math.random（）;}画像をクリックして初めて検証コードインターフェイスを更新するたびに、getverify（）メソッドを呼び出してください。
4。検証コード検証
フロントエンドは、ユーザーが入力した検証コードを取得し、検証のためにそれを背景に渡します。
背景検証コード
/***パスワードページ検証コードを忘れてください。コードを忘れてください*/@requestMapping（value = "/checkverify"、method = requestmethod.post、headers = "accept = application/json"）public boolean checkverify（@requestbody map <string、object> requestmap、httpsessionセッション）{try {// session string string = requeststr " string random =（string）session.getAttribute（ "randomvalidatecodekey"）; if（random == null）{return false; } if（random.equals（inputstr））{return true; } else {return false; }} catch（Exception e）{logger.error（ "検証コード検証が失敗した"、e）; falseを返します。 }}背景検証の後、フロントエンド検証の結果を真またはfalseに返します。
上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。