[聚合文章] .net core下验证码及二维码登录的实现

c# 2018-03-30 13 阅读
在上一篇.net core下访问控制层的实现主要介绍了通过中间件实现逻辑层面的权限控制,本篇主要介绍下在 .net core下如何生成验证码和二维码。

生成验证码

验证码实现的逻辑比较简单,生成一个随机数的图片,然后将随机数保存至cookie中,用于客户端校验。

首先是写个生成随机数的方法,下面提供个简单的生成算法,不是特别严谨,但作为后台管理应用基本够用了。

private static string RndNum(int VcodeNum)
{
    //验证码可以显示的字符集合  
    string Vchar = "0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f,g,h,i,j,k,l,m,n,p" +
        ",q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,P,P,Q" +
        ",R,S,T,U,V,W,X,Y,Z";
    string[] VcArray = Vchar.Split(new Char[] { ',' });//拆分成数组   
    string code = "";//产生的随机数  
    int temp = -1;//记录上次随机数值,尽量避避免生产几个一样的随机数  

    Random rand = new Random();
    //采用一个简单的算法以保证生成随机数的不同  
    for (int i = 1; i < VcodeNum + 1; i++)
    {
        if (temp != -1)
        {
            rand = new Random(i * temp * unchecked((int)DateTime.Now.Ticks));//初始化随机类  
        }
        int t = rand.Next(61);//获取随机数  
        if (temp != -1 && temp == t)
        {
            return RndNum(VcodeNum);//如果获取的随机数重复,则递归调用  
        }
        temp = t;//把本次产生的随机数记录起来  
        code += VcArray[t];//随机数的位数加一  
    }
    return code;
}

然后根据随机数生成图片流:

public static MemoryStream Create(out string code, int numbers = 4)
{
    code = RndNum(numbers);
    //Bitmap img = null;
    //Graphics g = null;
    MemoryStream ms = null;
    Random random = new Random();
    //验证码颜色集合  
    Color[] c = { Color.Black, Color.Red, Color.DarkBlue, Color.Green, Color.Orange, Color.Brown, Color.DarkCyan, Color.Purple };

    //验证码字体集合
    string[] fonts = { "Verdana", "Microsoft Sans Serif", "Comic Sans MS", "Arial", "宋体" };


    using (var img = new Bitmap((int)code.Length * 18, 32))
    {
        using (var g = Graphics.FromImage(img))
        {
            g.Clear(Color.White);//背景设为白色

            //在随机位置画背景点  
            for (int i = 0; i < 100; i++)
            {
                int x = random.Next(img.Width);
                int y = random.Next(img.Height);
                g.DrawRectangle(new Pen(Color.LightGray, 0), x, y, 1, 1);
            }
            //验证码绘制在g中  
            for (int i = 0; i < code.Length; i++)
            {
                int cindex = random.Next(7);//随机颜色索引值  
                int findex = random.Next(5);//随机字体索引值  
                Font f = new Font(fonts[findex], 15, FontStyle.Bold);//字体  
                Brush b = new SolidBrush(c[cindex]);//颜色  
                int ii = 4;
                if ((i + 1) % 2 == 0)//控制验证码不在同一高度  
                {
                    ii = 2;
                }
                g.DrawString(code.Substring(i, 1), f, b, 3 + (i * 12), ii);//绘制一个验证字符  
            }
            ms = new MemoryStream();//生成内存流对象  
            img.Save(ms, ImageFormat.Jpeg);//将此图像以Png图像文件的格式保存到流中  
        }
    }

    return ms;
}

最后将流输出,同时将随机数保存至cookie中:

/// <summary>
/// 获取图形验证码
/// </summary>
/// <returns></returns>
[HttpGet("VerifyCode")]
public async Task GetVerifyCode()
{
    Response.ContentType = "image/jpeg";
    using (var stream = VerifyCodeHelper.Create(out string code))
    {
        var buffer = stream.ToArray();

        // 将验证码的token放入cookie
        Response.Cookies.Append(VERFIY_CODE_TOKEN_COOKIE_NAME, await SecurityServices.GetVerifyCodeToken(code));

        await Response.Body.WriteAsync(buffer, 0, buffer.Length);
    }
}

这样就基本实现了验证码的生成,可以看下效果,输入对应的/VerifyCode就能出现对应的验证码:

生成二维码

在 .net core下生成二维码需要引入QRCoder.dll第三方组件,生成二维码代码就比较简单了:

/// <summary>
/// 
/// </summary>
/// <param name="url">存储内容</param>
/// <param name="pixel">像素大小</param>
/// <returns></returns>
public static Bitmap GetQRCode(string url, int pixel)
{

    QRCodeGenerator generator = new QRCodeGenerator();
    QRCodeData codeData = generator.CreateQrCode(url, QRCodeGenerator.ECCLevel.M, true);
    QRCode qrcode = new QRCode(codeData);

    Bitmap qrImage = qrcode.GetGraphic(pixel);

    return qrImage;
}

这样就可以将对应的登录地址放至二维码,返回至客户端了:

/// <summary>
/// 获取登录二维码
/// </summary>
/// <returns></returns>
[HttpGet("qrcode")]
public async Task GetQRCode()
{
    Response.ContentType = "image/jpeg";

    // 生成一个token并放入redis
    string qrToken = await SecurityServices.GetQRToken();

    var bitmap = QRCodeHelper.GetQRCode($"{domain}/Security/Login?token={qrToken}", 4);

    // 将二维码回调标识输出给cookie
    // 创建cookie
    Response.Cookies.Append(QRTOKEN_COOKIE_NAME, qrToken);

    bitmap.Save(Response.Body, ImageFormat.Jpeg);
}

这样输入地址/qrcode就能返回对应的二维码啦。

二维码登录实现

前面已经生成二维码给客户端了,如何实现登录呢,这里服务端还得提供一个接口给到客户端,用于二维码登录结果回调。

客户端轮询该接口,判断对应的token是否存在对应的登录记录,若存在则告诉客户端已经登录,客户端即可调转至首页了,若不存在,则等待。

当然你可以设置一个二维码失效时间,当二维码失效客户端自动跳转至账号密码登录页。

我们创建一个二维码登录结果回调服务:

/// <summary>
/// 二维码登录结果回调
/// </summary>
/// <returns></returns>
[HttpGet("qrresult")]
public async Task<LoginResult> GetQRResult()
{
string qrToken = Request.Cookies[QRTOKEN_COOKIE_NAME];
if (string.IsNullOrWhiteSpace(qrToken))
{
    return new LoginResult { Code = (int)LoginResultCode.InvalidAccess };
}

return await SecurityServices.QRResult(qrToken);
}

服务到redis中去找对应的登录记录,如果有则返回登录成功:

public static async Task<LoginResult> QRResult(string token)
{
    long temp = await redis.IncAsync(token);
    if (temp <= 1)
    {
        return new LoginResult { Code = (int)LoginResultCode.QRCodeExpired };
    }

    string sessionId = await redis.Get<string>($"{token}_1");
    if (string.IsNullOrWhiteSpace(sessionId))
    {
        return new LoginResult { Code = (int)LoginResultCode.QRCodeStandby };
    }

    return new LoginResult { Code = (int)LoginResultCode.Succeed, SessionId = sessionId };
}

这样就基本实现了二维码的登录啦。

总结

本篇主要讲验证码和二维码的实现和思路说了下,在小项目中基本够用,有兴趣的小伙伴可以尝试一下。

注:本文内容来自互联网,旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜,请你联系站长进行处理。