javascript - reCAPTCHA 2.0 not appearing in Safari (works in Edge, Chrome, and Firefox) - Stack Overflow

admin管理员组

文章数量:1291048

I just integrated the Google reCAPTCHA 2.0 into my site. It works as expected in Chrome, Firefox, and Edge, but it doesn't work / appear in Safari on my MacBook Pro.

• MacBook Pro: macOS Sierra version 10.12.2.
• Safari: Version 10.0.2 (12602.3.12.0.1)

The reCAPTCHA is being used within a dhtmlXForm like this...

...
{ type:"label", name:"myrecaptcha", label:"<div class=\"g-recaptcha\" data-sitekey=\"MY_KEY_HERE\"></div>", offsetLeft:320 },
...

Which in all browsers except for Safari generates this...

But in Safari it doesn't appear...

There are no errors in the console. I have cleared all browser cache. The location of the api.js line is immediately before the closing </head> tag like Google's documentation says. Not sure what else to try.

UPDATE: In Safari when I inspect the area where the reCAPTCHA is supposed to show I only see the original <div class="g-recaptcha" data-sitekey="MY_KEY_HERE"></div> with nothing in it. So it's not putting the iframe into that div for some reason. Hope that helps.

UPDATE: I went back and implemented reCAPTCHA v2 today (3.5 years later) and it appears to work in Safari now.

I just integrated the Google reCAPTCHA 2.0 into my site. It works as expected in Chrome, Firefox, and Edge, but it doesn't work / appear in Safari on my MacBook Pro.

• MacBook Pro: macOS Sierra version 10.12.2.
• Safari: Version 10.0.2 (12602.3.12.0.1)

The reCAPTCHA is being used within a dhtmlXForm like this...

...
{ type:"label", name:"myrecaptcha", label:"<div class=\"g-recaptcha\" data-sitekey=\"MY_KEY_HERE\"></div>", offsetLeft:320 },
...

Which in all browsers except for Safari generates this...

But in Safari it doesn't appear...

There are no errors in the console. I have cleared all browser cache. The location of the api.js line is immediately before the closing </head> tag like Google's documentation says. Not sure what else to try.

UPDATE: In Safari when I inspect the area where the reCAPTCHA is supposed to show I only see the original <div class="g-recaptcha" data-sitekey="MY_KEY_HERE"></div> with nothing in it. So it's not putting the iframe into that div for some reason. Hope that helps.

UPDATE: I went back and implemented reCAPTCHA v2 today (3.5 years later) and it appears to work in Safari now.

• javascript
• safari
• dhtmlx
• recaptcha

Share Improve this question Follow edited Jun 26, 2020 at 17:13 gfrobenius asked Jan 11, 2017 at 19:58 gfrobeniusgfrobenius 4,0671010 gold badges3838 silver badges6666 bronze badges 4

• If you have adblock, Try turning it off ... – Ani Commented Jan 24, 2017 at 16:34
• Safari - Preferences -> Security -> I unchecked "Block pop-up windows". I had no effect. I have no other ad blocking software in place. – gfrobenius Commented Jan 24, 2017 at 19:15
• UPDATE: In Safari, if I go to Develop -> User Agent -> If I select Edge, Chrome (Win or Mac), Firefox (Win or Mac) it works. This is in Safari, just changing the user agent. Maybe that will help someone narrow this issue down, I don't know. – gfrobenius Commented Jan 24, 2017 at 19:23
• It is not exclusive to your site - i have found other sites where captchas work in Chrome but not in Safari (which is how I ended up here) – Jeremy Young Commented Sep 13, 2017 at 9:50

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 0

1. $('#captcha-form script').remove();

'captcha-form' is the id of the form containing the captcha. Remove the script tags so the scripts don't get executed a second time when Safari re-renders them after jQuery moves them. The event handlers created by the script aren't in the script tags, so they survive.

2. Set the links in The reCAPTCHA config file from http to https

I just recalled that I had also turned on "Use HTML5 in forms" in the Formidable General settings recently. If I uncheck that, the reCAPTCHA works on Safari.

So, this would indicate that there is a problem with your implementation of HTML5 in forms, maybe that only surfaces when the site uses HTTPS.

3. Refer to these links provided below for more details -

reCAPTCHA2.0 troubleshooting

reCAPTCHA Frequently asked questions

Google reCAPTCHA tutorial

I'm facing the same issue on my site, in my case it's in Firefox, apparently it's because JavaScript is disabled (even though it's enabled in the browser ! and I tested on 3 different puters) I know this because because when I changed the settings for the reCaptcha to support browsers that don't support Javascript, it solved the problem for me.

To do this you can "navigate to the admin console and move the security preference slider to "easiest for users". Keep in mind that with this setting reCAPTCHA won't be able to use all of its security features." as said in reCAPTCHA Frequently asked questions

I hope this will help someone narrow the issue down.

PS : I don't have enough reputation to leave a ment.

old question, but maybe it helps someone anyway.

i had same problem with Google Recaptcha: works fine in Chrome & Firefox, but did not work in Safari & Epiphany.

i solved it by replacing some old javascript-code:

if( typeof Map !== "function" ) {
  function Map() {
    // own definition similar to https://stackoverflow./a/15739569/7135635
  }
}

now i use function MyMap() { ... } and captcha works fine.

本文标签：