.NET 6 实现滑动验证码(九)、搭建验证码API服务端

上一篇介绍了实现验证码生成的方法跟验证方法。本篇文章介绍如何在项目中使用。

目录

项目配置

在实际应用中,我们可以添加打包好的.nupkg文件,也可以使用添加现有项目的方式,把源码添加到现有项目中。
appsettings.json中,添加ImageCaptcha节点。

"ImageCaptcha": {
    "ExpiresIn": 60,
    "CacheKey": "", 
    "Tolerant": 0.02, 
    "Backgrounds": [
      {
        "Type": "file",
        "Data": "wwwroot/captcha/background/1.jpg"
      }
    ],
    "Templates": [
      {
        "Slider": {
          "Type": "file",
          "Data": "wwwroot/captcha/template/1/slider.png"
        },
        "Notch": {
          "Type": "file",
          "Data": "wwwroot/captcha/template/1/notch.png"
        }
      }
    ]
  }

ExpiresIn:缓存过期时长,单位秒。
CacheKey:缓存名称前缀。
Tolerant:容错值,凹槽位置与实际滑动位置匹配容错范围。
Backgrounds:验证码背景图
Templates:凹槽与滑块模板,如果不配置此项。使用默认的嵌入资源。需要注意的是,Templates下的滑块与凹槽,必须成对出现。

配置完appsettings.json后,进行代码配置,Program.cs中:

简单配置

builder.Services.AddSlideCaptcha(configuration);

详细配置:

builder.Services.AddSlideCaptcha(configuration, options =>
{
    options.Backgrounds.Add(new Resource(FileResourceHandler.TYPE, @"wwwroot/captcha/background/1.jpg"));
    options.Templates.Add(
        TemplatePair.Create(
            new Resource(FileResourceHandler.TYPE, @"wwwroot/captcha/template/1/slider.png"),
            new Resource(FileResourceHandler.TYPE, @"wwwroot/captcha/template/1/notch.png"),
            CaptchaTypeConstant.SLIDER
            )
        );
});

配置完成后,定义接口:ApiController


    [Route("api/[controller]")]
    public class CaptchaController : ControllerBase
    {
        private readonly ICaptcha _captcha;

        public CaptchaController(ICaptcha captcha)
        {
            _captcha = captcha;
        }

        public async Task<AjaxResult<CaptchaData>> Captcha(string type = "SLIDER")
        {
            var captcha = await _captcha.GenerateCaptchaImageAsync(type);

            return new AjaxResult<CaptchaData>
            {
                data = captcha,
                success = true
            };
        }

        [HttpPost]
        public AjaxResult Validate(string id, SlideTrack track)
        {
            var result = new AjaxResult();
            track.StartTime = track.StartTime.ToLocalTime();
            track.EndTime = track.EndTime.ToLocalTime();
            ValidateResult validateResult = _captcha.Validate(id, track);
            //成功
            if (validateResult.Result == ValidateResultType.Success)
            {
                result.message = "验证成功";
                result.success = true;
                return result;
            }
            //超时
            if (validateResult.Result == ValidateResultType.Timeout)
            {
                result.success = false;
                result.message = "验证超时, 请重新操作";
                return result;
            }
            //失败
            if (validateResult.Result == ValidateResultType.ValidateFail)
            {
                result.success = false;
                result.message = "验证未通过, 请重新操作";
                return result;
            }
            result.success = false;
            result.message = "未知错误, 请重新操作";
            return result;
        }
    }


代码中AjaxResult.cs

public class AjaxResult
    {
        /// <summary>
        /// 是否成功
        /// </summary>
        public bool success { get; set; } = true;

        /// <summary>
        /// 错误代码
        /// </summary>
        public int code { get; set; } = 0;

        /// <summary>
        /// 返回消息
        /// </summary>
        public string message { get; set; }
    }

AjaxResult.T.cs

 public class AjaxResult<T> : AjaxResult
    {
        /// <summary>
        /// 返回数据
        /// </summary>
        public T data { get; set; }
    }

我们完成了在实际项目中搭建滑动验证码的服务。
下一篇,介绍前端滑动验证码的实现,前端验证码组件我写了2个,1个是普通HTML+CSS+Jquery的。另一个是vue3的。

下载方式:
点击下方公众号卡片,关注我,回复captcha 免费领取!

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

倾斜的水瓶座

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值