1import { Controller } from "@hotwired/stimulus" 2 3export default class extends Controller { 4 static values = { 5 siteKeyV2: String, 6 siteKeyV3: String, 7 recaptchaNet: false, 8 version: String, 9 action: String, 10 fieldName: String, 11 }; 12 static targets = [ "input", "holder" ]; 13 14 connect() { 15 if (this.versionValue === 'v3') { 16 this.holderTarget.dataset.sitekey = this.siteKeyV3Value; 17 this.holderTarget.dataset.size = "invisible"; 18 this.holderTarget.className = "g-recaptcha g-recaptcha-response"; 19 } 20 21 this.load(this.recaptchaNetValue) 22 .then(() => { 23 if (this.versionValue === 'v2') { 24 window.grecaptcha.render(this.holderTarget, { sitekey: this.siteKeyV2Value } ) 25 console.log($("[name=g-recaptcha-response]")) 26 27 $("[name=g-recaptcha-response]").attr("name", this.fieldNameValue); 28 } else { 29 window.grecaptcha.ready(() => { 30 console.log("grecaptcha ready"); 31 32 33 window.grecaptcha.execute(undefined, {action: this.actionValue}) 34 .then((token) => { 35 this.inputTarget.value = token; 36 }) 37 }) 38 } 39 }) 40 } 41 42 disconnect(){ 43 window.grecaptcha = undefined; 44 this.script?.remove() 45 } 46 47 load(recaptchaNet = false) { 48 return new Promise((resolve, reject) => { 49 console.log("loading recaptcha"); 50 51 const { grecaptcha } = window; 52 53 if (grecaptcha) { 54 console.log("grecaptcha found"); 55 resolve(); 56 } else { 57 this.script = document.createElement('script'); 58 59 const handleScriptError = () => { 60 this.script.removeEventListener('error', handleScriptError); 61 reject(); 62 }; 63 64 window.handleRecaptchaLoad = () => { 65 resolve(); 66 } 67 68 this.script.type = 'text/javascript'; 69 this.script.src = `https://${(recaptchaNet ? 'www.recaptcha.net' : 'www.google.com')}/recaptcha/api.js?onload=handleRecaptchaLoad`; 70 this.script.async = true; 71 this.script.defer = true; 72 this.script.addEventListener('error', handleScriptError); 73 74 console.log("adding script"); 75 76 document.body.appendChild(this.script); 77 } 78 }); 79 }; 80};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.