Authentication code under MVC

Source: Internet
Author: User

Verification code technology is a security defense technology used by many Web applications, which is mainly used to prevent automatic and batch submission of forms using software programs. Mvccaptcha is a validation code control that is applied to an ASP. NET MVC Web application, powerful, easy to use, and the resulting captcha image effect is as follows:

Main features of Mvccaptcha:
    1. Support custom Captcha image font Distortion (None, Low, Medium, high, extreme level five) and the number of text in the picture;
    2. Background noise level (None, Low, Medium, high, extreme level five) for custom CAPTCHA images;
    3. Interference line level (None, Low, Medium, high, extreme level five) that supports custom CAPTCHA images;
    4. Can customize the code used in the image of the text, English letters, numbers and Chinese characters can be;
    5. Use the session to save the code text, to ensure security;
    6. The user can activate the Verification code input box to generate the picture (similar to the Baidu Post Code generation method), reduce the burden on the server;
    7. Support the Ajax way to load the picture, even if the current page of the application verification code is cached, it is guaranteed to generate a new verification code image each time;
    8. Supports global setting of validation code related attributes in Web. config;

  1. Download and add a reference to the MvcCaptcha.dll in the ASP. NET MVC project;
  2. In the current page of the form to add a verification code input text box for the user to manually enter the verification code, Verification Code text box can be placed anywhere in the form, examples are as follows:
    <input type= "text" name= "_mvccaptchatext" id= "_mvccaptchatext"/>
    The name and ID of the text box can be mvccaptcha default "_mvccaptchatext", or it can be a custom value, after the current form is committed, the Mvccaptcha control will get the value of the text box on the server side to verify, If the name and ID value of the text box is not the default "_mvccaptchatext", additional settings are required for the foreground registration code control and for validation in the background, which are described in detail below.
  3. Add a container element that places a captcha picture on the current page, which can be any element of a div, span, and set an ID value for it, as in the following example:
    <div id= "Captchaimage" ></div>
    The ID property value can default to "Captchaimage", and if set to a different value, you will need to set additional settings when registering the Mvccaptcha control, which is explained in more detail below.
  4. To register Mvccaptcha in a form, the example is as follows:

    Razor syntax:

    @Html. Mvccaptcha ()

    WebForm Syntax:

    <%:html.mvccaptcha ()%>
    If the ID of the code input text box above is not the default "_mvccaptchatext", or the ID of the CAPTCHA picture container element is not the default "Captchaimage", you need to specify it in the Mvccaptchaoptions property. Assuming that the ID of the captcha text box is "Captchainput", the ID of the container element of the picture verification code is "Imgcontainer", then the above registration code should read:

    Razor syntax:

    @Html. Mvccaptcha (new mvccaptchaoptions {validationinputboxid = "captchainput", Captchaimagecontainerid = " Imgcontainer "})

    WebForm Syntax:

    <%:html.mvccaptcha (new mvccaptchaoptions {validationinputboxid = "captchainput", Captchaimagecontainerid = " Imgcontainer "})%>
    The VALIDATIONINPUTBOXID is the client ID of the container element that contains the CAPTCHA picture, which is the Verification code input text box for the client Id,captchaimagecontainerid.

    To enable the Ajax lazy load Authenticode picture feature, you need to set the delayload of the Mvccaptchaoptions property to True, as shown in the following example:

    Razor syntax:

    @Html. Mvccaptcha (new mvccaptchaoptions {delayload = True,validationinputboxid = "Captchainput", Captchaimagecontainerid = "Imgcontainer"})

    WebForm Syntax:

    <%:html.mvccaptcha (new mvccaptchaoptions {delayload = True,validationinputboxid = "Captchainput", Captchaimagecontainerid = "Imgcontainer"})%>
  5. Add the Validatemvccaptchaattribute filter on the action method of the background controller, as shown in the following example:
    [Validatemvccaptcha] [Httppost]public actionresult Login (Loginmodel login) {...}
    If the Name property value of the Verification code input text box mentioned earlier is not the default "_mvccaptchatext", you need to explicitly specify the value in the filter, assuming that the code text box has the Name property value "Captchainput", then it should read:
    [Validatemvccaptcha ("Captchainput")] [Httppost]public actionresult Login (Loginmodel login) {...}
    In the action method, use Modelstate.isvalid for validation, as shown in the following example:
    [Validatemvccaptcha ("Captchainput")] [Httppost]public actionresult Login (Loginmodel login) {if (modelstate.isvalid) {//verify failed by}else{//}}
Small skill:
For client-side unobtrusive JavaScript validation, you can add Data-val= "true" data-val-required= "verification code cannot be empty" in the Code text box, as shown in the following example:
<input type= "text" name= "_mvccaptchatext" id= "_mvccaptchatext" data-val= "true" data-val-required= "verification code cannot be empty"/>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.