温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

怎么在asp.net core中接入腾讯验证码

发布时间:2021-04-15 17:32:37 来源:亿速云 阅读:224 作者:Leah 栏目:开发技术

这期内容当中小编将会给大家带来有关怎么在asp.net core中接入腾讯验证码,文章内容丰富且以专业的角度为大家分析和叙述,阅读完这篇文章希望大家可以有所收获。

验证流程

服务器端接入

using System.ComponentModel.DataAnnotations; using System.Net.Http; using System.Threading.Tasks; using Microsoft.Extensions.Logging; using Microsoft.Extensions.Options; using Newtonsoft.Json; using WeihanLi.Extensions; namespace ActivityReservation.Common {   public class TencentCaptchaOptions   {     /// <summary>     /// 客户端AppId     /// </summary>     [Required]     public string AppId { get; set; }     /// <summary>     /// App Secret Key     /// </summary>     [Required]     public string AppSecret { get; set; }   }   public class TencentCaptchaRequest   {     /// <summary>     /// 验证码客户端验证回调的票据     /// </summary>     public string Ticket { get; set; }     /// <summary>     /// 验证码客户端验证回调的随机串     /// </summary>     public string Nonce { get; set; }     /// <summary>     /// 提交验证的用户的IP地址(eg: 10.127.10.2)     /// </summary>     public string UserIP { get; set; }   }   public class TencentCaptchaHelper   {     private class TencentCaptchaResponse     {       /// <summary>       /// 1:验证成功,0:验证失败,100:AppSecretKey参数校验错误       /// </summary>       [JsonProperty("response")]       public int Code { get; set; }       /// <summary>       /// 恶意等级 [0, 100]       /// </summary>       [JsonProperty("evil_level")]       public string EvilLevel { get; set; }       /// <summary>       /// 错误信息       /// </summary>       [JsonProperty("err_msg")]       public string ErrorMsg { get; set; }     }     private const string TencentCaptchaVerifyUrl = "https://ssl.captcha.qq.com/ticket/verify";     private readonly TencentCaptchaOptions _captchaOptions;     private readonly ILogger _logger;     private readonly HttpClient _httpClient;     public TencentCaptchaHelper(       IOptions<TencentCaptchaOptions> option,       ILogger<TencentCaptchaHelper> logger,       HttpClient httpClient)     {       _captchaOptions = option.Value;       _logger = logger;       _httpClient = httpClient;     }     public async Task<bool> IsValidRequestAsync(TencentCaptchaRequest request)     {       // 参考文档:https://007.qq.com/captcha/#/gettingStart       var response = await _httpClient.GetAsync(         $"{TencentCaptchaVerifyUrl}?aid={_captchaOptions.AppId}&AppSecretKey={_captchaOptions.AppSecret}&Ticket={request.Ticket}&Randstr={request.Nonce}&UserIP={request.UserIP}");       var responseText = await response.Content.ReadAsStringAsync();       if (responseText.IsNotNullOrEmpty())       {         _logger.Debug($"Tencent captcha verify response:{responseText}");         var result = responseText.JsonToType<TencentCaptchaResponse>();         if (result.Code == 1)         {           return true;         }       }       return false;     }   } }

Startup 配置:

services.AddHttpClient<TencentCaptchaHelper>(client => client.Timeout = TimeSpan.FromSeconds(3))   .ConfigurePrimaryHttpMessageHandler(() => new NoProxyHttpClientHandler()); services.AddTencentCaptchaHelper(options => {   options.AppId = Configuration["Tencent:Captcha:AppId"];   options.AppSecret = Configuration["Tencent:Captcha:AppSecret"]; });

前端接入

前端接入这里不作多介绍了,接入方式多种多样,具体可以参考官方文档:https://cloud.tencent.com/document/product/1110/36841

下面的代码是 angular spa 在前端接入的核心代码

 private loadCaptcha(): void {   var tCaptcha = document.getElementById("tCaptcha");   if (tCaptcha) {    this.InitCaptcha();    return;   }   let script = <any>document.createElement('script');   script.id = "tCaptcha";   script.type = 'text/javascript';   script.src = "https://ssl.captcha.qq.com/TCaptcha.js"   if (script.readyState) { //IE    script.onreadystatechange = () => {     if (script.readyState === "loaded" || script.readyState === "complete") {      this.InitCaptcha();     }    };   } else { //Others    script.onload = () => {     this.InitCaptcha();    };   }   document.getElementsByTagName('body')[0].appendChild(script);  }  private InitCaptcha(): void {   let captchaDom = document.getElementById('TencentCaptcha1');   if (!captchaDom) {    return;   }   this.tencentRecaptcha = new TencentCaptcha(    captchaDom, appId, (res) => {     this.captchaValid = false;     console.log(res);     // res(用户主动关闭验证码)= {ret: 2, ticket: null}     // res(验证成功) = {ret: 0, ticket: "String", randstr: "String"}     if (res.ret === 0) {      this.captchaInfo.nonce = res.randstr;      this.captchaInfo.ticket = res.ticket;      this.captchaValid = true;      this.tencentRecaptcha.destroy();      let button = <HTMLElement>document.getElementById("btnSubmit");      button.click();     }    }   );   console.log(`captcha inited`);   this.tencentRecaptcha.show();  }

上述就是小编为大家分享的怎么在asp.net core中接入腾讯验证码了,如果刚好有类似的疑惑,不妨参照上述分析进行理解。如果想知道更多相关知识,欢迎关注亿速云行业资讯频道。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI