Commit 021f7216 authored by Grant's avatar Grant
Browse files

duct-tape google recaptcha

parent f24ea336

package-lock.json

+7 −0
Original line number Diff line number Diff line
@@ -6332,6 +6332,12 @@ 
        "@types/express": "*"

      }

    },

    "node_modules/@types/grecaptcha": {

      "version": "3.0.9",

      "resolved": "https://registry.npmjs.org/@types/grecaptcha/-/grecaptcha-3.0.9.tgz",

      "integrity": "sha512-fFxMtjAvXXMYTzDFK5NpcVB7WHnrHVLl00QzEGpuFxSAC789io6M+vjcn+g5FTEamIJtJr/IHkCDsqvJxeWDyw==",

      "dev": true

    },

    "node_modules/@types/http-errors": {

      "version": "2.0.4",

      "resolved": "https://registry.npmjs.org/@types/http-errors/-/http-errors-2.0.4.tgz",
@@ -16104,6 +16110,7 @@ 
      },

      "devDependencies": {

        "@tsconfig/vite-react": "^3.0.0",

        "@types/grecaptcha": "^3.0.9",

        "@types/lodash.throttle": "^4.1.9",

        "@types/react": "^18.2.48",

        "@types/react-dom": "^18.2.18",

packages/client/package.json

+1 −0
Original line number Diff line number Diff line
@@ -36,6 +36,7 @@ 
  },

  "devDependencies": {

    "@tsconfig/vite-react": "^3.0.0",

    "@types/grecaptcha": "^3.0.9",

    "@types/lodash.throttle": "^4.1.9",

    "@types/react": "^18.2.48",

    "@types/react-dom": "^18.2.18",

packages/client/src/components/Info/InfoSidebar.tsx

+1 −0
Original line number Diff line number Diff line
@@ -62,6 +62,7 @@ export const InfoSidebar = () => { 
          </div>

        </Button>

        <b>Build {__COMMIT_HASH__}</b>

        <div id="grecaptcha-badge"></div>

      </section>

    </div>

  );

packages/client/src/lib/network.ts

+9 −0
Original line number Diff line number Diff line
@@ -11,6 +11,7 @@ import { 
} from "@sc07-canvas/lib/src/net";

import { toast } from "react-toastify";

import { handleAlert, handleDismiss } from "./alerts";

import { Recaptcha } from "./recaptcha";



export interface INetworkEvents {

  connected: () => void;
@@ -91,6 +92,14 @@ class Network extends EventEmitter<INetworkEvents> { 
      console.log("Reconnect failed");

    });



    this.socket.on("recaptcha", (site_key) => {

      Recaptcha.load(site_key);

    });



    this.socket.on("recaptcha_challenge", (ack) => {

      Recaptcha.executeChallenge(ack);

    });



    this.socket.on("user", (user) => {

      this.emit("user", user);

    });

packages/client/src/lib/recaptcha.ts

0 → 100644
+32 −0
Original line number Diff line number Diff line 
class Recaptcha_ {

  load(site_key: string) {

    const script = document.createElement("script");

    script.setAttribute(

      "src",

      `https://www.google.com/recaptcha/api.js?render=explicit`

    );

    document.head.appendChild(script);



    script.onload = () => {

      grecaptcha.ready(() => {

        grecaptcha.render("grecaptcha-badge", {

          sitekey: site_key,

          badge: "inline",

          size: "invisible",

        });



        console.log("Google Recaptcha Loaded!");

      });

    };

  }



  executeChallenge(ack: (token: string) => void) {

    console.log("[Recaptcha] Received challenge request...");

    grecaptcha.execute().then((token) => {

      console.log("[Recaptcha] Sending challenge token back");

      ack(token as any);

    });

  }

}



export const Recaptcha = new Recaptcha_();