Topics
Many automatedProgramThe form is automatically submitted, causing a large amount of junk data on the Internet. To prevent this situation, we have implemented a graphic Verification Code (CAPTCHA:Completely automated public Turing test to tell computers and humans
Apart), You must enter the correct characters displayed on the image in the text box when submitting the request.
Solution
InBookcommentscontrollorController InstallationASP. NET web helper LibraryMediumNugetProvidedCAPTCHA.
Discussion
Contains a newLibrary package, AddCAPTCHA.MicrosoftInNuget Web
Helpers LibraryBuilt-inCAPTCHAClass, so that we can easily verify the user inputCAPTCHA.
InVisual StudioOfMVCIn the Application project, click "Tools">"Library Package Manager"→"Add Library
Package reference". After loading, select"Online"Category, select"Microsoft-web-helpers", If it is not in the list, search in the upper right corner. Click"Install".
The most typical case of submitting a form is submitting a comment. In the previous formula, adding a book comment is to addCAPTCHA. Before starting, You need to register the domain nameReCAPTCHAWebsite. After registration, you will receive the private key and public key for your website. Copy and save them for future use.
Modify the settingsCode. InBookcomments/IndexMake a small modification to the view. This is the previously created page for adding comments.AjaxRequest, displayedCAPTCHAWhen the request is complete,Displaycaptcha"JavascriptMethod.
@ Model ienumerable < Mvcapplication4 . Models. bookcomment >
@{
Viewbag. Title = "Index ";
}
< H2 > Index </ H2 >
< P >
@ Ajax. actionlink ("create new", "CREATE", new {
Bookid = viewbag. bookid },
New ajaxoptions {updatetargetid = "addcomment ",
Oncomplete = "displaycaptcha "})
</ P >
< Div ID = "Addcomment" > </ Div >
...
< Script Type = "Text/JavaScript" SRC =
Http://www.google.com/recaptcha/api/js/recaptcha_ajax.js" >
</ Script >
< Script Type = "Text/JavaScript" >
Function Displaycaptcha (){
ReCAPTCHA. Destroy ();
ReCAPTCHA. Create ( " <Your_public_key> " , " CAPTCHA " ,{});
}
</ Script >
NowBookcomments/createMake a small modification to the view. First, you need to create a region displayCAPTCHAAnd a newHtmlMark, the error message is displayed when the user inputs an error. Finally, modifyReloadcommentMethod to displayCAPTCHA(Only when no error occurs ).
@ Model mvcapplication4.models. bookcomment
@{
Viewbag. Title = "CREATE ";
}
< H2 > Create </ H2 >
@ Section javascriptandcss {
< Script SRC = "@ URL. Content (" ~ /Scripts/jquery. Validate. Min. js ")"
Type = "Text/JavaScript" > </ Script >
< Script SRC ="
@ URL. Content (" ~ /Scripts/jquery. Validate. unobtrusive. Min. js ")"
Type = "Text/JavaScript" > </ Script >
}
< Script Type = "Text/JavaScript" >
Function Reloadcomments (){
VaR Reload = " @ Viewbag. refreshcomments " ;
If (Reload = " False " ){
Displaycaptcha ();
} Else {
$ ( " # Comments " ). Load (
" /Bookcomments/index? Bookid = @ viewbag. bookid " );
}
}
</ Script >
@ Using (Ajax. beginform (New ajaxoptions {
Updatetargetid = "addcomment", oncomplete = "reloadcomments "}))
{
@ Html. Hidden ("bookid", (INT) viewbag. bookid );
@ Html. validationsummary (true)
< Fieldset >
< Legend > Bookcomment </ Legend >
< Div Class = "Editor-label" >
@ Html. labelfor (model => model. Comment)
</ Div >
< Div Class = "Editor-field" >
@ Html. textareafor (model => model. Comment)
@ Html. validationmessagefor (model => model. Comment)
</ Div >
< Div Class = "Editor-label" >
Are you human?
</ Div >
< Div Class = "Editor-field" >
< Div ID = "CAPTCHA" > </ Div >
@ Html. validationmessage ("CAPTCHA ")
</ Div >
< P >
< Input Type = "Submit" Value = "CREATE" />
</ P >
</ Fieldset >
}
Finally, you need to modifyBookCommentscontrollerVerify user inputCAPTCHA. If the verification fails, add the error messageModelstateIs returned to the view.
Using System;
Using System. Collections. Generic;
Using System. Data;
Using System. Data. entity;
Using System. LINQ;
Using System. Web;
Using System. Web. MVC;
Using Mvcapplication4.models;
Using Microsoft. Web. helpers;
Namespace Mvcapplication4.controllers
{
Public Class Bookcommentscontroller: Controller
{
Private Bookdbcontext DB = New Bookdbcontext ();
//
// Get:/bookcomments/
Public Actionresult index ( Int Bookid)
{
Viewbag. bookid = bookid;
VaR Bookcomments = dB. bookcomments. Include (
B => B. Book). Where (B => B. bookid = bookid );
Return Partialview (bookcomments. tolist ());
}
//
// Get:/bookcomments/create
Public Actionresult create ( Int Bookid)
{
Viewbag. bookid = bookid;
Viewbag. refreshcomments = False ;
Return Partialview ();
}
//
// Post:/bookcomments/create
[Httppost]
Public Actionresult create (bookcomment)
{
Viewbag. refreshcomments = False ;
VaR Captchasuccess = reCAPTCHA. Validate (
" <Your_private_key> " );
If (Modelstate. isvalid & captchasuccess)
{
Bookcomment. Created = datetime. now;
DB. bookcomments. Add (bookcomment );
DB. savechanges ();
Viewbag. refreshcomments = True ;
}
// If CAPTCHA failed add error message
If (! Captchasuccess)
{
Modelstate. addmodelerror ( " CAPTCHA " ,
" Invalid CAPTCHA " );
}
Viewbag. bookid = bookcomment. bookid;
Return Partialview (bookcomment );
}
Protected Override Void Dispose (Bool Disposing)
{
DB. Dispose ();
Base . Dispose (disposing );
}
}
}
Reference
Original book addressBooksSource code