Tencent Captcha Demo (ok)

https://codesandbox.io/s/4m7lq?file=/index.html:0-1611

C:\Users\Administrator\OneDrive\Desktop\test\index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
    />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Tencent Captcha Demo</title>
  </head>
  <body>
    <div
      style="
        min-height: min-h-screen;
        display: flex;
        align-items: center;
        min-height: 100vh;
        justify-content: center;
      "
    >
      <button
        id="TencentCaptcha"
        data-appid="2044554539"
        data-cbfn="TencentCaptchaCallback"
        type="button"
      >
        Verify Now
      </button>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.21.1/axios.min.js"></script>
    <script src="https://ssl.captcha.qq.com/TCaptcha.js"></script>
    <script>
      window.TencentCaptchaCallback = (res) => {
        console.log(res);
        // res（用户主动关闭验证码）= {ret: 2, ticket: null}
        // res（验证成功） = {ret: 0, ticket: "String", randstr: "String"}
        if (res.ret === 0) {
          // console.log(res.ticket); // 票据

          const url = `https://1vqq7.sse.codesandbox.io`; // 后端校验ticket接口地址
          const { appid, randstr: rand_str, ticket } = res;

          axios
            .post(url, { appid, rand_str, ticket })
            .then(({ data }) => {
              alert(data.message);
              console.log(data);
            })
            .catch((error) => {
              console.log(error);
            });
        }
      };
    </script>
  </body>
</html>
PreviousLàm chức năng thông báo khách hàng đăng ký namkhoahanoi.vn (ok)NextSend Mail same javascript elasticemail (ok)

Last updated