CoP Prince of Songkla University Phuket Campus's Blog

การใช้ Google reCAPTCHA Version 3 ร่วมกับ php และแก้ปัญหา timeout

6 February 2020 | NOPPACHART LERDPOONSAWAT | Leave a comment

สืบเนื่องมาจากโพส https://km.phuket.psu.ac.th/archives/4815 จึงได้นำ reCAPTCHA v.3 มาใช้ แต่ก็ติดที่ว่าเป็น php และ ด้วยเงื่อนไข expire after two minutes จึงทำให้เกิดปัญหากับหน้าฟอร์มที่ต้องมีการคีย์ข้อมูลหลายค่าหรืออาจจะมีอะไรแทรกระหว่างคีย์ข้อมูลทำให้ไม่ทันเวลาใน 2 นาที จากปัญหาเหล่านี้จึงต้องนำมาเปลี่ยนวิธีการดังนี้

หน้าฟอร์มก่อน submit ตรงปุ่ม submit ให้ใช้ code ดังนี้
<input type=”hidden” id=”captcha” name=”captchaToken” />
<script src=”https://www.google.com/recaptcha/api.js?render=public key“></script>
<input type=”button” id=”btnsubmit” value=”submit” >

***ในส่วน code ท่อนนี้ ให้ระวังเรื่อง button สำหรับ id  และ name ห้ามใช้คำว่า submit***

ต่อมาให้วาง script โดยใช้ jquery ที่ด้านล่าง </form> ในหน้าฟอร์มก่อน submit

<script src=”https://code.jquery.com/jquery-3.4.1.min.js” integrity=”sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=” crossorigin=”anonymous”>
  </script>
  <script src=”https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/jquery.validate.min.js”></script>

 <script>
 
$(function() {
      $(“#btnSubmit”).click(function() {

        grecaptcha.ready(async function() {
          let token = await grecaptcha.execute(‘public key‘, {
            action: ‘nameaction
          }).then(function(token) {           
            $(“#captcha”).val(token)
            return token
          });
          if (token) {      
            $(“#form”).submit();
          }
        });
      })

    })
  </script>
*** code ในส่วนนี้จะทำงานในรูปแบบเกิด event หลังจากกดปุ่มเพื่อไปขอ token ก่อน submit
 
ต่อมาก็ code ในส่วนหน้าฟอร์มหลัง submit เพื่อเช็คค่า token ที่ได้รับมา
 
if ($_SERVER[‘REQUEST_METHOD’] === ‘POST’ && isset($_POST[‘captchaToken’])) {

  // Build POST request:
  $recaptcha_url = ‘https://www.google.com/recaptcha/api/siteverify’;
  $recaptcha_secret = ‘secret key‘;
  $recaptcha_response = $_POST[‘captchaToken’];

  // Make and decode POST request:
  $recaptcha = file_get_contents($recaptcha_url . ‘?secret=’ . $recaptcha_secret . ‘&response=’ . $recaptcha_response);
  
  $recaptcha = json_decode($recaptcha);
 
  // Take action based on the score returned:
  if ($recaptcha->score >= 0.5) {
      // Verified – send email
  } else {
      // Not verified – show form error
      // Captcha verification failed         
  }
;
}else{
  //Invalid request
}
 
เท่านี้ก็จะสามารถใช้ reCAPTCHA V.3 ร่วมกับ php ได้โดยไม่ต้องกังวลกับเวลาที่กำหนด และสามารถไปตรวจสอบคำขอ reCAPTCHA ว่ามีการขอกี่ครั้งและได้คะแนนเท่าไหร่ ในส่วนของ admin console
 

Leave a Reply