{"id":4819,"date":"2025-04-07T13:04:42","date_gmt":"2025-04-07T12:04:42","guid":{"rendered":"https:\/\/ibex.tech\/cloud\/?p=4819"},"modified":"2025-12-04T19:39:36","modified_gmt":"2025-12-04T19:39:36","slug":"using-cloudflare-turnstile-implicit-form","status":"publish","type":"post","link":"https:\/\/ibex.tech\/cloud\/platforms\/cloudflare\/turnstile\/using-cloudflare-turnstile-implicit-form","title":{"rendered":"Using Cloudflare Turnstile (Implicit form)"},"content":{"rendered":"\n<h5 class=\"wp-block-heading\">Implicit vs Explicit<\/h5>\n\n\n\n<p>Implicit rendering automatically displays the Turnstile widget on your webpage without additional JavaScript code. You use this for pages where you want the widget to load immediately when the page loads. (You use Explicit rendering when you wan to manually control when and where the Turnstile widget appears using JavaScript).<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Obtaining the Cloudflare keys<\/h4>\n\n\n<p>To obtain the keys:<\/p>\n<p style=\"padding-left: 40px;\">Cloudflare account dashboard &gt; Turnstile &gt; Add Widget<br \/>Widget Mode: Any, Non interactive mode is good.<br \/>Pre-clearance: Optional, not needed.<br \/>Copy your sitekey and secret keys and paste into here.<\/p>\n\n\n<h4 class=\"wp-block-heading\">Adding to HTML (client)<\/h4>\n\n\n\n<h5 class=\"wp-block-heading\">Add to the header<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;script src=\"https:\/\/challenges.cloudflare.com\/turnstile\/v0\/api.js\" async defer&gt;&lt;\/script&gt;<\/code><\/pre>\n\n\n\n<h5 class=\"wp-block-heading\">Add to a form where you want to use it<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>  &lt;div class=\"MyCloudflareTurnstileWrapper\"&gt;\n    &lt;div class=\"cf-turnstile\" data-sitekey=\"MY_SITE_KEY\" data-theme=\"light\"&gt;&lt;\/div&gt;\n  &lt;\/div&gt;<\/code><\/pre>\n\n\n\n<p>An invisible input with the name cf-turnstile-response is automatically added and will be sent with the other form fields you use.<\/p>\n\n\n\n<p>Customizing it &#8211; see here: <a href=\"https:\/\/developers.cloudflare.com\/turnstile\/get-started\/client-side-rendering\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/developers.cloudflare.com\/turnstile\/get-started\/client-side-rendering\/<\/a><\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Adding to server<\/h4>\n\n\n\n<h5 class=\"wp-block-heading\">Handle the form POST<\/h5>\n\n\n\n<pre class=\"wp-block-code\"><code>  $SendUrl = 'https:\/\/challenges.cloudflare.com\/turnstile\/v0\/siteverify';\n  $CloudflareTurnstileResponse = $_POST&#91;'cf-turnstile-response'];   \/\/Turnstile injects a field called \"cf-turnstile-response\" with its token\n  $RemoteIp = $_SERVER&#91;'REMOTE_ADDR'];\n\n  $PostData  = array(\n      \"secret\" => '$ClouflareTurnstileSecretKey'YOUR-SECRET-KEY',\n      \"response\" => $CloudflareTurnstileResponse,\n      \"remoteip\" => $RemoteIp\n  );\n  $PostData = http_build_query($PostData);\n\n  $Response = '';\n  if(function_exists('curl_init') &amp;&amp; function_exists('curl_setopt') &amp;&amp; function_exists('curl_exec'))\n  {\n    $ch =  curl_init();\n    curl_setopt($ch, CURLOPT_URL, $SendUrl);\n    curl_setopt($ch, CURLOPT_POST, True);\n    curl_setopt($ch, CURLOPT_POSTFIELDS, $PostData);\n    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);\n    curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, 10);        \/\/Connect timeout in secs\n    curl_setopt($ch, CURLOPT_TIMEOUT, 10);               \/\/Maximum time the request is allowed to take in secs\n    $CurlResult = curl_exec($ch);\n  }\n  $DecodedJson = json_decode($CurlResult, True);\n  \n  echo \"CurlResult: \";\n  print_r($CurlResult);\n  echo \"&lt;br>DecodedJson: \";\n  print_r($DecodedJson);\n\n  if (!is_null($DecodedJson))\n  {\n    \/\/Check for succcess\n    if ( (isset($DecodedJson&#91;'success'])) &amp;&amp; ($DecodedJson&#91;'success'] === True) )\n    {\n      \/\/Passed Cloudflare Turnstile check\n\n    }\n  }<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Implicit vs Explicit Implicit rendering automatically displays the Turnstile widget on your webpage without additional JavaScript code. You use this for pages where you want the widget to load immediately when the page loads. (You use Explicit rendering when you wan to manually control when and where the Turnstile widget appears using JavaScript). Obtaining the [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[366],"tags":[],"class_list":["post-4819","post","type-post","status-publish","format-standard","hentry","category-turnstile"],"_links":{"self":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/4819","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/comments?post=4819"}],"version-history":[{"count":9,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/4819\/revisions"}],"predecessor-version":[{"id":5246,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/4819\/revisions\/5246"}],"wp:attachment":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/media?parent=4819"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/categories?post=4819"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/tags?post=4819"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}