用BlazorServerSide如何实现图片验证码-创新互联

创新互联www.cdcxhl.cn八线动态BGP香港云服务器提供商，新人活动买多久送多久，划算不套路！

东乡族ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景，ssl证书未来市场广阔！成为成都创新互联的ssl证书销售渠道，可以享受市场价格4-6折优惠！如果有意向欢迎电话联系或者加微信：18982081108（备注：SSL证书合作）期待与您的合作！

这篇文章将为大家详细讲解有关用Blazor Server Side如何实现图片验证码，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。

关于Blazor

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

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

验证码

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

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

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

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

先上图:

再上代码:

@page "/BlazorVerificationCode"


 (Blazor) A sample for how to show verification code and verify it.


@inject IJSRuntime jsr

@{
 if (imgurl == null) MakeNewImage();
}


Renew

Type the number in image

 
 Check


@code{
 string inp_code;
 string vericode;
 string imgurl;

 void DoCheck()
 {
  string msg = "You typed a wrong value";
  if (inp_code == vericode)
   msg = "Yes the number is " + vericode;
  jsr.InvokeAsync