[Asp。网络核心]怎么用Blazor服务器端实现图片验证码功能 - 行业资讯

　　介绍

这篇文章主要讲解了”[Asp。网络核心]怎么用Blazor服务器端实现图片验证码功能”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习”[Asp。网络核心]怎么用Blazor服务器端实现图片验证码功能”吧!

<强>关于Blazor

由于在国内,Blazor一点都不普及,在阅读此文前,建议读者先翻看我之前写的随笔,了解Blazor服务器端的特点。

在一段时间内,我会写一些解说分析型的“为什么选择Blazor服务器Side",在适当的时候再写快速入门系列。(无论是针对编程新学者还是多年经验人士)

<强>验证码

我们很多场合都实现过图片验证码。

图片验证码的主要关键是呈现图片,需要一个URL,而这个URL需要传递参数以确定显示什么东西。

这个验证码如何在服务器保存,如何传递一个参数公开给客户端,还不能让别人解密这个参数破解验证码,都是<强>麻烦事

这个例子是讲述如何用极短的“单页“代码,实现验证过程。

先上图:

@page “/BlazorVerificationCode" 　　　　& lt; p> 　　,(Blazor) A sample for 请;用show verification code 以及verify 它。　　& lt;/p> 　　　　@inject IJSRuntime jsr 　　　　@ { 　　,if (imgurl ==, null), MakeNewImage (); 　　} 　　　　& lt; img , src=癅imgurl",/比; 　　& lt; button @onclick=癕akeNewImage"祝辞Renew 　　& lt; hr /比; 　　& lt; div> Type 从而,number image<拷贝/div> 　　& lt; EditForm 模型=皌his", OnSubmit=癉oCheck"比; 　　,& lt; input 类型=皌ext", @bind-value=癷np_code",,/比; 　　,& lt; button> Check 　　& lt;/EditForm> 　　　　@code { 　　,string inp_code; 　　,string vericode; 　　,string imgurl; 　　　　,void DoCheck () 　　,{ 　　string 才能;msg =,“你typed a wrong value"; 　　if 才能;(inp_code ==, vericode) 　　,,msg =,“Yes 从而number is “, +, vericode; 　　jsr.InvokeAsync<才能;object> (“alert",, msg); 　　,} 　　　　,void MakeNewImage () 　　,{ 　　　　时间=vericode 才能;new 随机(). next (100000,, 999999) .ToString (); 　　　　using 才能SkiaSharp.SKBitmap bmp =, new SkiaSharp.SKBitmap (200,, 80); 　　　　using 才能;(SkiaSharp.SKCanvas canvas =, new SkiaSharp.SKCanvas (bmp)) 　　{才能　　,,canvas.Clear (SkiaSharp.SKColors.White); 　　,,using SkiaSharp.SKPaint skp =, new SkiaSharp.SKPaint (); 　　,,skp.Color =, SkiaSharp.SKColors.Red; 　　,,skp.TextSize =, 40; 　　,,canvas.DrawText (vericode, 30岁,55岁,skp); 　　,,canvas.Save (); 　　,,} 　　　　using 才能;System.IO.MemoryStream 小姐=,new System.IO.MemoryStream (); 　　using 才能SkiaSharp.SKManagedWStream ws =, new SkiaSharp.SKManagedWStream(女士); 　　bmp.Encode才能(ws, SkiaSharp.SKEncodedImageFormat.Jpeg,, 100); 　　　　imgurl =,才能“数据:图像/jpeg; base64,“, +, Convert.ToBase64String (ms.ToArray ()); 　　,} 　　　　}