HeCAPTe: a stateless, privacy-first CAPTCHA service you can embed almost anywhere.

[girish]

This is great, already have it running.

1. git clone https://codeberg.org/TheMeerkat/HeCAPTe-Cloudron.git
2. cloudron install --image codeberg.org/themeerkat/hecapte-cloudron:1.0.0
3. Visited /admin and set a password
4. Created a site id and secret key.
5. <stuck here> . is there an example where I can copy/paste the wasm stuff needed?

[TheMeerkat]

Thanks so much! I appreciate it.

@girish said in HeCAPTe: a stateless, privacy-first CAPTCHA service you can embed almost anywhere.:

5. <stuck here> . is there an example where I can copy/paste the wasm stuff needed?

Documentation is definitely the weakest link right now, I think. Here's a cobbled-together example:
EDIT: Slightly more coherent. Edited five minutes after posting.

Form:

<!-- ...existing code... -->
<input type="hidden" id="hecapte-payload" name="hecapte_payload">
<script>
  const SITE_KEY = "YOUR_SITE_KEY";
  const worker = new Worker("https://hecate.eris.host/static/worker.js");
  let solverReady = false;

  worker.onmessage = (e) => {
    const { type, payload } = e.data;
    if (type === "STATUS" && payload === "READY") solverReady = true;
    if (type === "RESULT") {
      document.getElementById("hecapte-payload").value = JSON.stringify(payload);
    }
  };

  async function solveHeCAPTe() {
    if (!solverReady) return;
    const resp = await fetch(`https://hecate.eris.host/challenge?site_key=${SITE_KEY}`);
    if (!resp.ok) return;
    const challenge = await resp.json();
    const msgId = Date.now();
    worker.postMessage({
      id: msgId,
      type: "SOLVE",
      payload: {
        salt: challenge.salt,
        ts: challenge.ts,
        n: challenge.diff.n,
        k: challenge.diff.k,
        nonceStart: 0
      }
    });
    worker.addEventListener("message", function handler(e) {
      const { id, type, payload } = e.data;
      if (id !== msgId || type !== "SOLVE_RESULT") return;
      worker.removeEventListener("message", handler);
      document.getElementById("hecapte-payload").value = JSON.stringify({
        site_key: SITE_KEY,
        data: {
          nonce: payload.nonce,
          salt: challenge.salt,
          ts: challenge.ts,
          diff: challenge.diff,
          sig: challenge.sig,
          sol: payload.solution
        }
      });
    });
  }

  window.addEventListener("load", solveHeCAPTe);
</script>
<!-- ...existing code... -->

Super basic backend pseudo-code:

payload = json.loads(form["hecapte_payload"])
resp = requests.post("https://example.com/verify", json=payload, timeout=5)
if resp.json().get("status") != "ok":
    return 403

[TheMeerkat]

Sorry, it's 3:30AM where I am right now. I may not have been quite as clear as I intended.

Basically, due to the ideal of being embeddable and invisible, there's no easy widget; implementations are semi-manual affairs, manually threaded through the thing you're protecting, with the HeCAPTe server's response processed by your own backend.

Obviously, the ideal for adoptability and ease-of-use would be to create a bunch of pre-fab implementations (e.g., WordPress plugin and npm module), but I probably lack both the skill and the time to make these "quickly."

For this specifically:

is there an example where I can copy/paste the wasm stuff needed?

/static/worker.js calls the .wasm module directly; you just need to invoke $HeCAPTeInstance/static/worker.js.

[girish]

@themeerkat yes, I got it going more . I used your example and changed the URLs - https://paste.cloudron.io/saruhogawi.xml . I had to upload the static things (solver, worker, wasm) into surfer . Then, some CORS into nginx (would be great if the hecapte server can have this configurable) and my test site loads. Something is up with /verify , checking what...

[girish]

w00h00 . @themeerkat works I was sending the /verify incorrectly to surfer instead of hecapte.

[TheMeerkat]

@girish said in HeCAPTe: a stateless, privacy-first CAPTCHA service you can embed almost anywhere.:

Then, some CORS into nginx (would be great if the hecapte server can have this configurable)

Definitely. There's next-to-no "easy" config right now; I have an informal checklist for changes I'd want to make before it goes from alpha to beta, and I'll make a note for CORS specifically.

@girish said in HeCAPTe: a stateless, privacy-first CAPTCHA service you can embed almost anywhere.:

w00h00 . @themeerkat works I was sending the /verify incorrectly to surfer instead of hecapte.

Awesome! Thanks so much for trying it out! I genuinely appreciate your feedback and testing.

[timconsidine]

@TheMeerkat awesome!
Congratulations and thank you for the great work
Looking forward to trying it out

[TheMeerkat]

new! Updated to 1.0.1.

codeberg.org/themeerkat/hecapte-cloudron:1.0.1

I added customization options: renaming sites, deleting sites, and specifying CORS(!) on registration. This should make it a lot easier to use.

[TheMeerkat]

new! Updated to 1.0.2, after a hefty delay. Sorry about that.

I significantly improved the security of the project, most importantly. Not far behind, refactoring the entire /admin panel to be... well, an actual admin panel. It's been redone almost from the ground up for maintainability going forward. Finally, it's more resilient to OOM bugs in unlucky situations.

codeberg.org/themeerkat/hecapte-cloudron:1.0.2

Nope. Tested all of the local code to within an inch of its life; tested the Docker image locally; then watched as it completely shattered into splinters as I tried to update the demo site running on Cloudron. Good lesson to learn before I embarrass myself publicly, next time?

Please keep using 1.0.1 for right now (if anyone's using it at all). I need to sleep right now, but I'll take another look in the morning.

[james]

Hello @themeerkat

With Cloudron 9.1 we have added community app support.
Please check the latest documentation for package publishing https://docs.cloudron.io/packaging/publishing
Could you update your repo to include these changes?