Селектор Google captcha DOM не работает - document.querySelector ('# g-captcha-response'). Value - PullRequest
0 голосов
/ 28 января 2019

При обращении к селектору для gapaptcha значение из g-captcha-response ВСЕГДА пусто.Это работало ранее, но внезапно прекратилось.В настоящее время я использую vue, а функции капчи и регистра находятся внутри компонента.Я не сделал абсолютно никаких изменений или изменений в коде, ответственном за проверку / регистрацию.Я очень потерян и очень отчаялся.

register() {
  var username = this.username;
  var password = this.password;
  var email = this.email;
  var password_again = this.password;
  var referral = this.referral;
  var captcha = document.querySelector("#g-recaptcha-response").value;


  // set loading state
  this.loading = true;

  let pattern = /^[0-9a-zA-Z]+$/;
  // check if username is not alphanumeric
  if (!this.username.match(pattern)) {
    return alert('Your username can not contain any non-alphanumeric characters');
  }

  // if passwords don't match
  if (password !== password_again) {
    return alert('Your passwords do not match');
  }

  console.log('CAPTCHA RESPONSE');
  console.log(captcha);

  return; /** End here */

  this.$http({
    method: 'POST',
    url: api.dev + 'api/v1/register',
    data: {
      username,
      email,
      password,
      password_again: this.password,
      referral,
      captcha: captcha
    }
  }).then(res => {
    console.log(res.data);
    if (res.data.success == true) {
      this.success = true;
      setTimeout(() => {
        $("#registerModal").modal('toggle');
        $('#loginModal').modal('toggle');
        this.success = false;
        this.error = "";
      }, 1200)
      return;
    } else {
      this.error = res.data.message
      this.loading = false;
    }


  })
}
<form @submit.prevent='register' method='POST'>
  <div class="form-group">
    <!-- <input type="text" class="form-control" placeholder='Username...' v-model='username'> -->

    <div class="input-group mb-3">
      <div class="input-group-prepend">
        <span class="input-group-text" id="basic-addon1">Username</span>
      </div>

      <input type="text" class="form-control" placeholder="Username" v-model="username">
    </div>
  </div>

  <div class="form-group">
    <div class="input-group mb-3">

      <div class="input-group-prepend">
        <span class="input-group-text" id="basic-addon1">Password</span>
      </div>

      <input type="text" class="form-control" placeholder="Password..." v-model="password" style='height: 40px;'>

      <div class="input-group-append">
        <span class="input-group-text" id="basic-addon1" @click='generatePassword'>
                                            <img src="../../assets/icons/refresh.png" alt="" style='width: 20px;'>
                                        </span>
      </div>
    </div>

    <!-- PASSWORD AGAIN -->
    <div class="input-group mb-3">

      <div class="input-group-prepend">
        <span class="input-group-text" id="basic-addon1">Repeat Password</span>
      </div>

      <input type="text" class="form-control" placeholder="Repeat password..." v-model="password_again" style='height: 40px;'>
    </div>
  </div>

  <!-- <div class="form-group text-center">
                                <input type="text" class="form-control" placeholder="Referal ID" v-model="referral" style='height: 40px;'>
                                <p class="small text-white mt-1 text-center">If you were referred by a friend, enter their code to gift with 0.1 mBTC</p>
                            </div> -->

  <div class="form-group text-center">
    <p class="text-white mb-0 h6">Account recovery options</p>
    <!-- <p class="small text-white">Please note that our account recovery system has not yet been implemented. Please ensure you do not forget your password as we will not be able to recover it for you</p> -->
  </div>

  <div class="form-group">
    <input type="email" class="form-control" placeholder='Your e-mail address...' v-model='email'>
  </div>

  <!-- <div class="form-group">
                                <input type="checkbox" class='form-check-input' id='checkbox-recover'>
                                <label class="text-white text-center small mb-1" for='checkbox-age'>
                                    I don't want a way to recover my account. If I forget my password,
                                    lock my account permanently.
                                </label>
                            </div> -->

  <!-- <hr> -->

  <div class="form-group">
    <input type="checkbox" class='form-check-input' id='checkbox-age'>
    <label class="text-white text-center small mb-1" for='checkbox-age'>
                                    I am 18 or older, gambling is legal in my jurisdiction and I agree
                                    with the <a data-toggle='modal' data-target='#tosModal'>Terms of Service</a>
                                </label>

  </div>
  <!-- <br> -->
  <div class="form-group text-center">
    <!-- TESING / LOCAL HOST -->
    <div class="g-recaptcha d-inline-block" data-sitekey="6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_xxxxxxx"></div>
  </div>

  <div class="form-group">
    <p class="text-danger text-center" v-show='error && error.length > 1'>{{error}}</p>
  </div>

  <div class="form-group text-center my-4">
    <button type="submit" class='rounded' v-if='!loading'>Submit</button>
    <button type="submit" class='rounded' v-else>Loading...</button>
  </div>

</form>
...