{"id":24974,"date":"2021-05-22T11:45:00","date_gmt":"2021-05-22T08:45:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=24974"},"modified":"2021-10-17T18:56:41","modified_gmt":"2021-10-17T15:56:41","slug":"kinnitage-google-recaptcha-javascripti-abil","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/et\/kinnitage-google-recaptcha-javascripti-abil\/","title":{"rendered":"Kinnitage Google reCAPTCHA JavaScripti abil"},"content":{"rendered":"<p>Google reCAPTCHA on populaarne valik veebisaitide vormide kaitsmiseks r\u00e4mpsposti ja robotite eest. ReCAPTCHA palub kasutajatel lahendada lihtsad m\u00f5istatused, mis on inimestele lihtsad, kuid rasked robotitele. Selle tulemusel saab nende serveriruumi s\u00e4\u00e4sta ebavajalike r\u00e4mpspostikirjete andmebaasi sisestamise eest. See s\u00e4\u00e4stab ka meie aega, kuna me ei saa kunagi postkasti r\u00e4mpsposti kommentaare.<\/p>\n<p>Kui lisame veebisaidi vormidesse Google reCAPTCHA, peame reCAPTCHA vastuse kinnitamiseks kirjutama koodiosa. Kui vastus on \u00f5ige, peaks j\u00e4tkama ainult meie vorm.<\/p>\n<p>Vastuse kinnitamiseks on kaks v\u00f5imalust: \u00fcks on serveripoolne ja teine \u200b\u200bkliendipoolne. Selles artiklis keskendume kliendipoolsele valideerimisele ja uurime, kuidas Google reCAPTCHA-d JavaScripti abil kinnitada.<\/p>\n<p>Kui otsite serveripoolset kinnitamist, lugege palun artiklit <a href=\"https:\/\/themewp.inform.click\/et\/google-recaptcha-kasutamine-veebisaidil-php-vormides\/\" title=\"Google'i reCAPTCHA kasutamine veebisaidi vormidel PHP-ga\" >Google&#8217;i reCAPTCHA kasutamine veebisaidi vormidel PHP-ga<\/a>.<\/p>\n<h3>Registreerige sait ja hankige API-v\u00f5tmed<\/h3>\n<p>Alustamiseks peate oma saidi siin registreerima &#8211; <a href=\"https:\/\/www.google.com\/recaptcha\/admin\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external\"><\/a><a href=\"https:\/\/www.google.com\/recaptcha\/admin\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">https:\/\/www.google.com\/recaptcha\/admin<\/a>.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20518-6081fe9b2d78e.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20518-6081fe9b2d78e.png\" alt=\"Kinnitage Google reCAPTCHA JavaScripti abil\" ><\/a><\/p>\n<p>Valige suvand \u201ereCAPTCHA v2&quot;, mis annab m\u00e4rkeruudu \u201eMa ei ole robot&#8221;.<\/p>\n<p>Kui olete \u00fclaltoodud vormis \u00fcksikasjad sisestanud, saate saidi v\u00f5tme ja salajase v\u00f5tme. Kuna tegemist on kliendipoolse valideerimisega, vajame ainult saidiv\u00f5tit.<\/p>\n<p>Kui soovite seda kohalikus serveris testida, lisage domeeniks &#8216;localhost&#8217;.<\/p>\n<h3>Kinnitage Google reCAPTCHA JavaScripti abil<\/h3>\n<p>Esiteks peate oma vormile lisama Google reCAPTCHA. Seda saate teha alloleva koodi abil.<\/p>\n<pre><code>&lt;form method=\"post\" onsubmit=\"return submitUserForm();\"&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"g-recaptcha\" data-sitekey=\"YOUR_SITE_KEY\" data-callback=\"verifyCaptcha\"&gt;&lt;\/div&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;div id=\"g-recaptcha-error\"&gt;&lt;\/div&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;input type=\"submit\" name=\"submit\" value=\"Submit\" \/&gt;\n&lt;\/form&gt;\n&lt;script src='https:\/\/www.google.com\/recaptcha\/api.js'&gt;&lt;\/script&gt;<\/code><\/pre>\n<p>\u00dclaltoodud koodis kasutan <code>onsubmit<\/code>s\u00fcndmust. Seda seet\u00f5ttu, et kui kasutaja esitab vormi, peame kontrollima reCAPTCHA vastust ja lubama tal seej\u00e4rel vormi esitada.<\/p>\n<p>Seej\u00e4rel lisasin atribuudile &#8217;data-callback&#8217; tagasihelistamisfunktsiooni nimeks &#8216;confirmCaptcha&#8217;. Kasutan seda tagasihelistusmeetodit t\u00f5rketeate eemaldamiseks p\u00e4rast valideerimise l\u00e4bimist. Lisasin veateate kuvamiseks ka div-i ID-ga &#8216;g-recaptcha-error&#8217;.<\/p>\n<p>Peaksite asendama kohat\u00e4ite \u201eYOUR_SITE_KEY&#8221; oma tegeliku saidiv\u00f5tmega.<\/p>\n<p>L\u00f5puks kirjutame JavaScripti koodi, mis k\u00e4sitleb reCAPTCHA vastust. Ja vastuse p\u00f5hjal n\u00e4itab see kas veateadet v\u00f5i v\u00f5imaldab vormil j\u00e4tkata.<\/p>\n<pre><code>&lt;script&gt;\nfunction submitUserForm() {\n\u00a0\u00a0\u00a0\u00a0var response = grecaptcha.getResponse();\n\u00a0\u00a0\u00a0\u00a0if(response.length == 0) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0document.getElementById('g-recaptcha-error').innerHTML = '&lt;span style=\"color:red;\"&gt;This field is required.&lt;\/span&gt;';\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return false;\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0return true;\n}\n\u00a0\nfunction verifyCaptcha() {\n\u00a0\u00a0\u00a0\u00a0document.getElementById('g-recaptcha-error').innerHTML = '';\n}\n&lt;\/script&gt;<\/code><\/pre>\n<p>Meetodis <code>submitUserForm<\/code>saame reCAPTCHA vastuse kasutades <code>grecaptcha.getResponse()<\/code>. See on sisseehitatud funktsioon, mida pakub Google reCAPTCHA teenus.<\/p>\n<p>Kui vastus on vale, tagastab see 0. See t\u00e4hendab, et kasutaja pole reCAPTCHA-d veel kinnitanud. Ja nii, see viskab vea ja liitub div-ga, millel on id &#8216;g-recaptcha-error&#8217;.<\/p>\n<p>Kui Google reCAPTCHA saadab kehtiva vastuse, tagastan t\u00f5elise v\u00e4\u00e4rtuse, mis v\u00f5imaldab vormil edasi liikuda.<\/p>\n<p><code>verifyCaptcha<\/code>Meetod muutub k\u00f5ne kui lahendada k\u00f5ik m\u00f5istatused reCAPTCHA. Seej\u00e4rel eemaldame veateate, kui m\u00f5istatus on lahendatud.<\/p>\n<p>Meie l\u00f5plik kood on:<\/p>\n<pre><code>&lt;form method=\"post\" onsubmit=\"return submitUserForm();\"&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"g-recaptcha\" data-sitekey=\"YOUR_SITE_KEY\" data-callback=\"verifyCaptcha\"&gt;&lt;\/div&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;div id=\"g-recaptcha-error\"&gt;&lt;\/div&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;input type=\"submit\" name=\"submit\" value=\"Submit\" \/&gt;\n&lt;\/form&gt;\n&lt;script src='https:\/\/www.google.com\/recaptcha\/api.js'&gt;&lt;\/script&gt;\n&lt;script&gt;\nfunction submitUserForm() {\n\u00a0\u00a0\u00a0\u00a0var response = grecaptcha.getResponse();\n\u00a0\u00a0\u00a0\u00a0if(response.length == 0) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0document.getElementById('g-recaptcha-error').innerHTML = '&lt;span style=\"color:red;\"&gt;This field is required.&lt;\/span&gt;';\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0return false;\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0return true;\n}\n\u00a0\nfunction verifyCaptcha() {\n\u00a0\u00a0\u00a0\u00a0document.getElementById('g-recaptcha-error').innerHTML = '';\n}\n&lt;\/script&gt;<\/code><\/pre>\n<p>Loodan, et m\u00f5istate, kuidas Google reCAPTCHA-d JavaScripti abil kinnitada. Proovige seda oma projektis ja jagage oma m\u00f5tteid v\u00f5i ettepanekuid allpool olevas kommentaaride jaotises.<\/p>\n<h4>seotud artiklid<\/h4>\n<ul>\n<li><a href=\"https:\/\/themewp.inform.click\/et\/integreerige-google-invisible-recaptcha-php-ga\/\" title=\"Integreerige Google Invisible reCAPTCHA PHP-ga\">Integreerige Google Invisible reCAPTCHA PHP-ga<\/a><\/li>\n<li><a href=\"https:\/\/themewp.inform.click\/et\/juhend-google-recaptcha-v3-lisamiseks-oma-laraveli-veebisaidile\/\" title=\"Juhend Google reCAPTCHA v3 lisamiseks teie Laraveli veebisaidile\">Juhend Google reCAPTCHA v3 lisamiseks teie Laraveli veebisaidile<\/a><\/li>\n<li><a href=\"https:\/\/themewp.inform.click\/et\/kuidas-lisada-ma-pole-laraveli-vormides-robot-captcha\/\" title=\"Kuidas lisada, ma ei ole Laraveli vormides robot captcha\">Kuidas lisada, ma ei ole Laraveli vormides robot captcha<\/a><\/li>\n<\/ul>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/artisansweb.net\" class=\"external external_icon\">artisansweb.net<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Kas otsite Google reCAPTCHA valideerimist JavaScripti abil? Selles artiklis me n\u00e4itame teile, kuidas saab JavaScripti abil Google reCAPTCHA vastust reageerida v\u00f5i kinnitada.<\/p>\n","protected":false},"author":1,"featured_media":21785,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[246],"tags":[842],"class_list":["post-24974","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript-5","tag-affiai-et"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/posts\/24974","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/comments?post=24974"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/posts\/24974\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/media\/21785"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/media?parent=24974"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/categories?post=24974"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/et\/wp-json\/wp\/v2\/tags?post=24974"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}