verify_email.html 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. <!DOCTYPE html>
  2. <html lang="en" >
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <meta http-equiv="X-UA-Compatible" content="ie=edge, Chrome=1">
  7. <meta http-equiv="Cache-Control" content="no-cache">
  8. <title>驗證信箱</title>
  9. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">
  10. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp"
  11. crossorigin="anonymous">
  12. <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
  13. <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  14. <!-- Google Tag Manager -->
  15. <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
  16. new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
  17. j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
  18. 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
  19. })(window,document,'script','dataLayer','GTM-5M8S4GH');</script>
  20. <!-- End Google Tag Manager -->
  21. <style>
  22. .h2 {
  23. text-align: center;
  24. font-size: 2rem;
  25. font-weight: 500;
  26. margin-top: 2rem;
  27. }
  28. .imgfr {
  29. width: 70%;
  30. max-width: 800px;
  31. min-width: 300px;
  32. }
  33. .imgfr img {
  34. width: 100%;
  35. }
  36. .pl-0 {
  37. padding-left: 0;
  38. }
  39. .link {
  40. text-decoration: none;
  41. }
  42. </style>
  43. </head>
  44. <body>
  45. <!-- Google Tag Manager (noscript) -->
  46. <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5M8S4GH"
  47. height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
  48. <!-- End Google Tag Manager (noscript) -->
  49. <div class="container">
  50. <main>
  51. <div class="m-auto text-center">
  52. <div class="block-validating">
  53. <h2 class="h2">
  54. <img src="https://i.imgur.com/crQ3rg6.png" alt="" width="36" class="me-2">
  55. <span class="validating-text">驗證中...</span></h2>
  56. </div>
  57. <div class="block-success">
  58. <h2 class="h2">
  59. <img src="https://i.imgur.com/crQ3rg6.png" alt="">
  60. <img src="https://i.imgur.com/eFBgdgI.png" width="36" class="me-2">
  61. 驗證成功!</h2>
  62. <p>立即至<a href="./login.html" class="link">登入頁</a>,以繼續使用服務</p>
  63. </div>
  64. <!-- <div><img src="../html/static/img/Spinner-1s-181px.gif" width="36" alt=""></div> -->
  65. <div class="imgfr mx-auto">
  66. <img src="https://i.imgur.com/EqED9CY.png" alt="">
  67. </div>
  68. </div>
  69. </main>
  70. </div>
  71. <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
  72. <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js'></script>
  73. <script>
  74. $('.block-success').css('display', 'none');
  75. function getCode(){
  76. let id = window.location.search.split('?').pop();
  77. return id.split('=')[1];
  78. }
  79. axios({
  80. method: 'get',
  81. url: `https://www.choozmo.com:8887/verify_email?code=${getCode()}`,
  82. headers: {
  83. 'accept': 'application/json',
  84. }
  85. }).then(res => {
  86. console.log(res.data);
  87. if(res.data.msg == 'ok') {
  88. $('.block-success').css('display', 'block');
  89. $('.block-validating').css('display', 'none');
  90. window.setTimeout(() => {
  91. window.location.href = './login.html';
  92. }, 3500);
  93. }
  94. }).catch(err => {
  95. console.log(err);
  96. $('.validating-text').text('驗證失敗,請再重新點擊驗證信連結')
  97. });
  98. </script>
  99. </body>
  100. </html>