Meghit, you are partly right: it´s not exactly a drag-and-drop thing, I know. But this is, unless Wix develops an alternative, the only way. That´s why a gave step-by-step instructions. Let me know if you get stuck, I´ll try to help you.
Hi, Giri (or anyone else).
On Step 2 of https://girizano.wixsite.com/codecorner/home/google-recaptcha ( Create your reCAPTCHA keys ), when I click [Register], [Register] switches to [Error] and displays the following error above the word “Domains”:
URL starts with an invalid scheme
The first line reads as follows:
and has a squiggly line underline under the text “hnllaws” (see the attached picture).
Been Google-ing for a resolution but nothing yet.
TIA
Weird. I have tried to repeat this error, but I can register anything, even non-existing domains AND hnllaws.com
Have you tried clearing the whole field with backspace and delete? MAybe there is a non-printing ASCII char in there.
Yes; good idea … I tried that but still no joy.
I just went back to Step 1; when I get to Step 4 and replace the text “yoursitekey” with the first key Google gave me in Step 2, the following error displays within the HTML control in the page in the Wix editor:
Per Perguntas frequentes | reCAPTCHA | Google for Developers, I did what the following suggests:
“If you are seeing this error, your reCAPTCHA site key is no longer valid. To activate, please register a new key and follow the instructions on that page.”
Still no joy.
I had the same error in the Editor when I was developing it. Then I found out that the component was not running on wix.com, but on another, in my case htmlcomponentservice.com . So I developed this little script for step1, to find out where it is running in Sandbox and Publish Mode. So the obvious question is: have you filled out the 3 domains: you real domain (hnllaws.com) AND the 2 domains from step 1?
PS. Did you get rid of the “scheme” error?
@abergquist set the site as www.hnllaws.com/ make sure to include the www. that will give you the Scheme error
Also Adding CAPTCHAv2 is quite difficult with Wix but adding reCAPTCHA v3 is very simple. just saying. (However it is still in beta.) https://g.co/recaptcha/v3
Ethan, have you done v3? If so, would you like to share, so I can update my page (with credits to you)?
Ethan, thanks for your input. abergquist could give it a try, who knows, but:
- a protocol is not a scheme, although there is much confusion about the term
- Google states very clearly that subdomains do not have to be specified.
But, abergquist, if it works, please keep me updated, so I can adjust the article.
@giri-zano Yeah im writing up a little tutorial now on adding v3. long story short you put it in a HTML element with an onMessage event, send the key given to backend, send that to the google api with Fetch, and get the response
@ethan-snow Am looking forward to your tutorial. If you publish it somewhere, I will link to it, OK?
Alright, guys; I’m willing to be a guinea pig if you think v. 3 is OK (safe) to go with; do you think there would be anything unsafe going with that version (vs. v. 2)?
reCAPTCHA v3 Tutorial - Step 1 - Register and Pre-Setup
Alright so Adding This little thing to your site is now Really simple with reCAPTCHA v3 however i Must stress it is still in BETA. So anything may change at any time and for all i know this little tutorial will be depreciated in 20 minutes ¯_(ツ)_/¯
First you must get your Site and Secret keys HERE
For this i will be using my Music site bombandkou.com as the example.
Now for this we are going to be using it inside of an HTML Component and those iframes have their own url for the code. so www.bombandkou.com becomes www-bombandkou-com.filesusr.com
Set your Label and add the domains, Accept to the terms of service. I know no one reads those but its always a good idea to just skim it.
Ok so now we have our Keys and some Code, and various info and calls that are important to us
Now that that is set up its time to add it to the site. add an iFrame Html component to your site and add the following code inside, replacing SITE_KEY for your site key
you might want to do this in Notepad++/Notepad before putting it in the component as working with code in that is Horrendous. (Wix staff please update that? k thanks!)
<script src="https://www.google.com/recaptcha/api.js?render=SITE_KEY"></script>
<script>
//this will run as soon as the html component loads you could alternatively have this code run in an onMessage event for more control if you wish to and i might make how to do this below
grecaptcha.ready(function() {
grecaptcha.execute('SITE_KEY', {action: 'login'}).then(function(token) {
window.parent.postMessage(token,'*');
});
});
</script>
Now where we see action: we have several cases we can give it
I recommend putting all this code on a locked/hidden Testing page as you will always get an Error in testing unless you find your Preview Environment URL which is a uuid and looks something like dsfjhkj3-4htk-j238-923f9o3f9823f.htmlcomponentservice.com (hit random keys for this dont actually use it you will get an error still) So testing this in preview mode is difficult.
Step 2 - Site Code
Now we move on to Site Code. We have the reCAPTCHA on the site and all set up but now we have to actually Use the key. First thing. Get the Token provided by the html component. To do that we must create an onMessage event trigger.
Inside the html_message function the Token we just generated is a string in event.data
We can use this to verify with the api at https://www.google.com/recaptcha/api/siteverify
for this we require the Response and the Secret, Now the secret is not something ANYONE can have so we must do this in Backend code.
i created a Web Module in the Backend titled reCAPTCHA.jsw
the following is the code i have in my backend simply calls to the api with the token;
// Filename: backend/reCAPTCHA.jsw (web modules need to have a .jsw extension)
import { fetch } from 'wix-fetch';
const secret = "SECRET_KEY" //replace with your Secret from step 1
export function verify(token) {
const url = "https://www.google.com/recaptcha/api/siteverify?secret=" + secret + "&response=" + token
return fetch(url, { method: "get" })
.then((httpResponse) => {
if (httpResponse.ok) {
return httpResponse.json();
}
})
}
Now we have import this function back on our page with;
import {verify} from 'backend/reCAPTCHA'
Now we have a function that returns a promise with all the info from google.
The way our new function is called is like so: (your export_function may be different from mine, Mine is #html6)
the following is the call and All info returned.
export function html6_message(event, $w) {
verify(event.data).then((data)=>{
let success = data.success // true
let challenge_ts = data.challenge_ts // "2018-08-27T19:04:58Z"
let hostname = data.hostname //for me is www-bombandkou-filesusr.com
let score = data.score //Higher the better. Most users will get around 0.9
let action = data.action
})
}
v2 is the Prove you are human challange, v3 is invisible to the user (minus the box saying it is there) and requires no interaction and gives a score ranging from 0.0 to 1.0
a Genuine user will get aroun 0.8 to 1.0 while say a Bot would get around 0.0 to 0.3
If the user gets below a score then you can decide to disallow interaction
A basic implementation of this would be;
(Displays error cause it cant run on the backend)
import {verify} from 'backend/reCAPTCHA'
import wixData from 'wix-data'
var reCaptchaScore = 0.0 // Default Status to Failure
$w.onReady(function () {
//TODO: write your page related code here...
});
export function html6_message(event, $w) {
verify(event.data).then((data)=>{
reCaptchaScore = data.score
})
}
export function SubmitButton_click(event, $w) {
if (reCaptchaScore < 0.5) {
console.log("Probable Bot")
//Deny Access or give a second test if it is a genuine user
} else {
//User has a score higher than 0.5 Submit the data
}
}
@khaled @asbeendesign Added a tutorial above for v3
. will be making a separate post for this soon
It doesn’t work for me at all!
I am still getting the same message error. invalid URL’s scheme …
Hi, Giri.
Looks like I have to go with reCAPTCHA v2; https://girizano.wixsite.com/codecorner/home/google-recaptcha no longer appears to be an active link.
In fact, did you take down the entire https://girizano.wixsite.com/ ?
TIA,
Art
Yes, I did take it down. It was eating up too much time. There were days I had 60-70 emails from Wix Forum and additional emails to my email address. So I switched off all my notifications and unpublished the site. It´s wonderfully quiet and I can get some serious work done again. Sorry for inconvenience, but I am going into hermit mode for a while.
Has anyone done the captcha feature? I need it urgently?