asp.net core 텐 센트 인증 코드 의 접속 예제 코드

Intro
이전에 사 용 된 인증 코드 서 비 스 는 매우 검증 되 었 고 비교적 낡 았 다.오래 전에 접 속 했 고 인증 코드 서 비 스 는 Session 에 의존 하여 유연성 이 없 었 다.나중에 텐 센트 에 도 인증 코드 서비스 가 있 고 애플 릿 을 지원 하 며 작은 절 차 를 지원 하 는 유일한 인증 코드 였 다.(독점 이 요?)
그리고 이에 비해 텐 센트 인증 코드 는 세 션 에 의존 하지 않 아 도 되 고 집적 하 는 것 도 편리 하기 때문에 텐 센트 인증 코드 를 사 용 했 습 니 다.상세 한 참고:https://007.qq.com/product.html?ADTAG=index.block
검증 절차
서버 엔 드 접속

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;
    }
  }
}

시작 설정:

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();
 }

사용 효과:

오래된 사이트 접속 효과:

Reference
https://github.com/WeihanLi/ActivityReservation
https://reservation.weihanli.xyz/Home/Reservate
https://reservation-client.weihanli.xyz/reservation/new
https://cloud.tencent.com/document/product/1110/36841
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.