invalid-input-response google recaptcha

Question

i got the error stdClass Object ( [success] => [error-codes] => Array ( [0] => invalid-input-response ) ) when i implement invisible google recapture , however the site key and the secret key provided are valid here's is the full code ..

<script src="https://www.google.com/recaptcha/api.js?render=6Lf_wNwlAAAAAFNZFttJLg6ii2KMsPvquGTEi1fh"></script>

php code

  <?php
  if(isset($_POST['submit'])){
    $url ='https://www.google.com/recaptcha/api/siteverify';
    $secret = '6Lf_wNwlAAAAAJ7eikDFSiBSD0vfuA5XFvcnEjou';
    $response = $_POST['ge-recaptcha'];
    $remoteip = $_SERVER['REMOTE_ADDR'];
    $request = file_get_contents($url . '?secret=' . $secret. '&response=' . $response . '&remoteip=' . $remoteip);
    $result=json_decode($request);
    print_r($result);
    if($result->success == true){
        ?>
        <script>
        alert("data saved successfully");
        </script>
        <?php
    }else{
        ?>
        <script>
        alert("data not saved");
        </script>
        <?php
    }
}
?>

html code

<form action="" method="post" id="form">
        <div id="alert_message"></div>
           <div class="form-group">
              <label for="email">Email:</label>
              <input type="text" class="form-control" id="email" placeholder="Enter your email" name="email">
           </div>
<input type="hidden" name="ge-recaptcha" value="" id="recaptchaResponse">
           <input type="submit" name="submit" value="Submit" class="btn btn-success btn-lg" style="padding: 6px 46px; margin: 16px 0 0 0;">
        </form>
     </div>

javascript code

 <script>
    document.querySelector('#form').addEventListener('submit', function(event) {
      function validateForm() {
          let isValid = true;
        const emailInput = document.querySelector('#email');
        if (emailInput.value.trim() === '') {
          alert('Please enter an email address');
          return false;
        }
        return isValid
      }
    
      grecaptcha.ready(function() {
        grecaptcha.execute('6Lf_wNwlAAAAAFNZFttJLg6ii2KMsPvquGTEi1fh', { action: 'submit' }).then(function(token) {
          let response = document.getElementById('recaptchaResponse');
          response.value = token;
        });
      });
    
      if (!validateForm()) {
        event.preventDefault();
      }
    });
         </script>

why does this error appear ? any help to fix the error will be appreciated