reCAPTCHA v3 is loading unnecessary fonts

[galford-tillster]

Hi,

Per the reCAPTCHA V3 documentation we are allowed to hide the badge:

https://developers.google.com/recaptcha/docs/faq#id-like-to-hide-the-recaptcha-badge.-what-is-allowed

However, hiding the badge does not prevent the two fonts used on the badge from downloading. reCAPTCHA V3 downloads two fonts each about 10KB, so that's 20KB of unnecessary data being loaded each time.

We cannot block the request because the CSS is inside the iFrame.

Is it possible to provide a configuration option that will disable the font, or maybe disable the badge altogether?

[shirnschall]

I have the same issue plus google pagespeed insights thinks the text is not visible while loading these fonts.

[khanakia]

I have the same issue because recaptcha loading that roboto font and google pagespeed insights consider it while analyzing

[levipadre]

Same problem here:

[lea-pw]

Same problem. Anybody solved this?

[joaquinvexels]

Same!

[swaranan]

Same problem here.

[federer11]

Same problem here. Any solutions?

[Nincha]

Also interested in resolution for this.

[quadcom]

Classic Google, be the cause of the problem while also dinging us for having a problem.

My site uses Roboto as the fonts already and I host them myself. Now the script goes and downloads another copy of them from Google fonts. Fantastic.

[emendo-web]

Same problem. Hope a option to disable font loading.

[khanakia]

Hi All,

Simply add this to your head and then Google Pagespeed will not complaint

<link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>

[ansmlc]

Same problem here.

[novvac]

Same problem. Any solutions?

[khanakia]

Same problem. Any solutions?

@khanakia Just use preconnect event google fonts itself suggesting this.

[ansmlc]

Same problem. Any solutions?

@khanakia Just use preconnect event google fonts itself suggesting this.

That doesn’t solve the invisible font issue as shown by @levipadre

Or the fact fonts are still being requested even when they are already self-hosted.

[steve-buri]

I am facing the same problem in reCAPTCHA v2. Google Fonts are always loaded from fonts.gstatic.com. I want them to be loaded from my server.

After taking a look into it, the font-face's are loaded from the inline styles (inside https://www.google.com/recaptcha/api2/anchor).

/* inside the inline styles */

/* cyrillic-ext */
--
  | @font-face {
  | font-family: 'Roboto';
  | font-style: normal;
  | font-weight: 400;
  | src: url(//fonts.gstatic.com/s/roboto/v18/KFOmCnqEu92Fr1Mu72xKKTU1Kvnz.woff2) format('woff2');
  | unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
  | }

Changing the theme parameter to dark or light mode still loads the fonts. There is not any setting in the documentation to switch of the font or CSS.

Is there a way to remove these inline styles?

[mohsinr]

Wow it is almost 2 years since this issue was reported, and still google report this error in pagespeed, no way to disable or recaptcha developers should have added display:swap parameter so it is not issue anymore in pagespeed.

[gnaaromat]

Plus there was a lawsuit in Germany that makes it potentially illegal to load fonts from google servers. Which in turn makes it illegal to use recaptcha now?!

[alorbach]

any google person here? Cant be that hard to remove the unnecessary font loading from css?! Or make it even optional.

EDIT: At the moment the only option is to get rid of recaptcha :(

[nessor]

Plus there was a lawsuit in Germany that makes it potentially illegal to load fonts from google servers. Which in turn makes it illegal to use recaptcha now?!

Yes. Seems a bit difficult at the moment. Article (in german): https://www.golem.de/news/google-fonts-abmahnungen-an-webseitenbetreiber-mit-google-schriftarten-2208-167472.html

[seanconklin]

Same problem here.

[websuits]

Same, that font is useless, there should be a way to remove or edit that css.

[23tux]

Same here, we already received complaints. Is there no way to remove that font?

[iMartn]

Same problem here we need to change the captcha solution for our customers because of that.

[websuits]

Implemented workaround preventing the initial load and then added a mouse move event to load the iframe, works well for page speed.

[NiklasBr]

@rowan-m you tagged this almost 30 months ago, do you have any progress to share?

[23tux]

Within 2 1/2 years, it went from @galford-tillster's original "20KB of unnecessary data being loaded each time" to legal actions being taken against companies in Germany

[alorbach]

Common Google cant be that hard to come up with a solution?!

[sfritzsche]

Note: It should be possible to block this via the "Content Security Policy": https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/font-src

[23tux]

@sfritzsche I'm not sure if this is right, because the font is loaded from within an iFrame that is rendered by reCaptcha, and you can't set a header for that AFAIK. Have you tried this, if it really works?