Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Lazy load recaptcha files #8688

Closed
LanderBeeuwsaert opened this issue Jan 1, 2025 · 2 comments
Closed

Lazy load recaptcha files #8688

LanderBeeuwsaert opened this issue Jan 1, 2025 · 2 comments
Labels
api: appcheck needs-attention question

Comments

@LanderBeeuwsaert
Copy link

LanderBeeuwsaert commented Jan 1, 2025 •
edited
Loading

Operating System

(any) windows 11

Environment (if applicable)

(any) chrome

Firebase SDK Version

10.12.5

Firebase SDK Product(s)

AppCheck

Project Tooling

doesn't really matter for the issue

Detailed Problem Description

We use appCheck + recaptcha in our web application.
When looking at the network tab, we see that the recaptcha is quite big and would like to optimize where/if possible.
Image

there are 2 points that are standing out:

  1. why is the recaptcha library always loaded? Even if the user is already logged in? Shouldn't recaptcha only load when appCheck wants to verifying that a user is a valid user? So during a login attempt? Is it somehow possible to lazy load the recaptcha library?

  2. there are 2 instances/js files of 221kb that are being loaded? Seems the same file is loaded twice. Is this because of a misconfiguration from our side or is there a valid reason for this?

Steps and code to reproduce issue

we load the library like this in our angular web application:
Image
@LanderBeeuwsaert LanderBeeuwsaert added new A new issue that hasn't be categoirzed as question, bug or feature request question labels Jan 1, 2025
@google-oss-bot
Copy link
Contributor

I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.

@jbalidiong jbalidiong added needs-attention api: appcheck and removed needs-triage new A new issue that hasn't be categoirzed as question, bug or feature request labels Jan 1, 2025
@hsubox76
Copy link
Contributor

hsubox76 commented Jan 6, 2025

Unfortunately this isn't a Firebase issue, this is just how ReCAPTCHA works. You can test it by creating a page with no Firebase and just adding the basic ReCAPTCHA script tag, with site key:

<html>
<head>
  <script src="https://www.google.com/recaptcha/enterprise.js?render=MY_SITE_KEY"></script>
</head>
<body>
  test
</body>
</html>

You should see the same thing in the network tab. This seems to be a longstanding complaint about ReCAPTCHA and seems to be have something to do with ReCAPTCHA having to run in multiple frames. See google/recaptcha#335 and google/recaptcha#331

If this isn't acceptable, you can try opening an issue with ReCAPTCHA or posting in one of their existing issues (from their response, this doesn't seem like this will change though), or try using a different attestation provider with CustomProvider.

@hsubox76 hsubox76 closed this as completed Jan 6, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
api: appcheck needs-attention question
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@LanderBeeuwsaert @hsubox76 @google-oss-bot @jbalidiong