接入谷歌验证vue-grecaptcha
在.html文件得hear中引入js脚本
<script src="http://www.recaptcha.net/recaptcha/api.js?onload=ReCaptchaLoaded&render=explicit&hl=en" async defer> <script src="https://www.recaptcha.net/recaptcha/api.js?onload=vueRecaptchaApiLoaded&render=explicit" async defer></script> <script src="https://www.google.com/recaptcha/api.js?onload=vueRecaptchaApiLoaded&render=explicit" async defer> 中国区可以使用:www.recaptcha.net 国外区可以使用:www.google.com 然后是vue页面使用方式: 安装: npm i vue-recaptcha -S 然后引入: import VueGrecaptcha from "vue-recaptcha"; components: { VueGrecaptcha, }, 使用方式: <!--size="invisible"--> <!--theme=light/dark--> <vue-grecaptcha class="repha" ref="recaptcha" recaptchaHost="www.recaptcha.net" @verify="recaptchaVerify" @expired="resetExpired" @error="resetError" theme="light" sitekey="6LdRAGAbAAAAALYKqbTM2ZCT_o_iauryGEqGaCt6" > <div>验证码</div> </vue-grecaptcha> onSubmit: function () { this.$refs.recaptcha.execute(); }, resetRecaptcha() { this.$refs.recaptcha.reset(); // Direct call reset method }, recaptchaVerify(d) { console.log("recaptchaVerify"); console.log(d); }, resetExpired(d) { console.log("resetExpired"); console.log(d); }, resetError(d) { console.log("resetError"); console.log(d); },
您还未登录, 登录 后可进行评论
发表
还没有评论哦,来抢个沙发吧!