@cap.js/widget 0.0.11 → 0.0.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cap.js/widget",
-  "version": "0.0.11",
+  "version": "0.0.12",
   "description": "Cap widget",
   "keywords": [
     "captcha",

package/src/cap.js

@@ -19,6 +19,7 @@
     });
   };
 
+  // MARK: Widget
   class CapWidget extends HTMLElement {
     #workerUrl = "";
     #resetTimer = null;
@@ -127,11 +128,7 @@
               method: "POST",
             })
           ).json();
-          const solutions = await this.solveChallenges({
-            challenge,
-            target,
-            token,
-          });
+          const solutions = await this.solveChallenges(challenge);
 
           const resp = await (
             await fetch(`${apiEndpoint}redeem`, {
@@ -168,7 +165,7 @@
       }
     }
 
-    async solveChallenges({ challenge, target }) {
+    async solveChallenges(challenge) {
       const total = challenge.length;
       let completed = 0;
 
@@ -239,7 +236,7 @@
       this.#div.setAttribute("role", "button");
       this.#div.setAttribute("tabindex", "0");
       this.#div.setAttribute("disabled", "true");
-      this.#div.innerHTML = `<div class="checkbox"></div><p>I'm a human</p><a href="#" class="credits" target="_blank"><span>Secured by&nbsp;</span>Cap</a>`;
+      this.#div.innerHTML = `<div class="checkbox"></div><p>I'm a human</p><a href="https://cap.tiagorangel.com/" class="credits" target="_blank" rel="follow noopener"><span>Secured by&nbsp;</span>Cap</a>`;
       this.#shadow.innerHTML = `<style>.captcha{background-color:var(--cap-background);border:1px solid var(--cap-border-color);border-radius:var(--cap-border-radius);width:var(--cap-widget-width);display:flex;align-items:center;padding:var(--cap-widget-padding);gap:var(--cap-gap);cursor:pointer;transition:filter var(--cap-transition-duration),transform var(--cap-transition-duration);position:relative;-webkit-tap-highlight-color:rgba(255,255,255,0);overflow:hidden;color:var(--cap-color)}.captcha:hover{filter:var(--cap-hover-filter)}.captcha:not([disabled]):active{transform:scale(var(--cap-active-scale))}.checkbox{width:var(--cap-checkbox-size);height:var(--cap-checkbox-size);border:var(--cap-checkbox-border);border-radius:var(--cap-checkbox-border-radius);background-color:var(--cap-checkbox-background);transition:opacity var(--cap-transition-duration);margin-top:var(--cap-checkbox-margin);margin-bottom:var(--cap-checkbox-margin)}.captcha *{font-family:var(--cap-font)}.captcha p{margin:0;font-weight:500;font-size:15px;user-select:none;transition:opacity var(--cap-transition-duration)}.captcha[data-state=verifying] .checkbox{background: none;display:flex;align-items:center;justify-content:center;transform: scale(1.1);border: none;border-radius: 50%;background: conic-gradient(var(--cap-spinner-color) 0%, var(--cap-spinner-color) var(--progress, 0%), var(--cap-spinner-background-color) var(--progress, 0%), var(--cap-spinner-background-color) 100%);position: relative;}.captcha[data-state=verifying] .checkbox::after {content: "";background-color: var(--cap-background);width: calc(100% - var(--cap-spinner-thickness));height: calc(100% - var(--cap-spinner-thickness));border-radius: 50%;margin:calc(var(--cap-spinner-thickness) / 2)}.captcha[data-state=done] .checkbox{border:1px solid transparent;background-image:var(--cap-checkmark);background-size:cover}.captcha[data-state=error] .checkbox{border:1px solid transparent;background-image:var(--cap-error-cross);background-size:cover}.captcha[disabled]{
       cursor:not-allowed}.captcha[disabled][data-state=verifying]{cursor:progress}.captcha[disabled][data-state=done]{cursor:default}.captcha .credits{position:absolute;bottom:10px;right:10px;font-size:var(--cap-credits-font-size);color:var(--cap-color);opacity:var(--cap-opacity-hover)}.captcha .credits span{display:none;text-decoration:underline}.captcha .credits:hover span{display:inline-block}</style>`;
 
@@ -370,6 +367,7 @@
     }
   }
 
+  // MARK: Invisible
   class Cap {
     constructor(config = {}, el) {
       let widget = el || document.createElement("cap-widget");
@@ -410,21 +408,81 @@
   );
   document.adoptedStyleSheets.push(sheet);
 
+  // MARK: Solver worker
   const workerFunct = function () {
     let hasher;
 
     self.onmessage = async ({ data: { salt, target } }) => {
-      if (!hasher) {
-        hasher = await hashwasm.createSHA256();
-      }
-
       let nonce = 0;
       const batchSize = 50000;
-      const reportInterval = 500000;
       let processed = 0;
+      const encoder = new TextEncoder();
+
+      // Alternative solver in case WASM is not available
+      if (
+        !(
+          typeof WebAssembly === "object" &&
+          typeof WebAssembly.instantiate === "function"
+        )
+      ) {
+        console.log("[cap] WASM not enabled, falling back to crypto.subtle\nThis is significanty slower than the WASM implementation");
+
+        const targetBytes = new Uint8Array(target.length / 2);
+        for (let k = 0; k < targetBytes.length; k++) {
+          targetBytes[k] = parseInt(target.substring(k * 2, k * 2 + 2), 16);
+        }
+        const targetBytesLength = targetBytes.length;
+
+        while (true) {
+          try {
+            for (let i = 0; i < batchSize; i++) {
+              const inputString = salt + nonce;
+              const inputBytes = encoder.encode(inputString);
+
+              const hashBuffer = await crypto.subtle.digest(
+                "SHA-256",
+                inputBytes
+              );
+
+              const hashBytes = new Uint8Array(
+                hashBuffer,
+                0,
+                targetBytesLength
+              );
+
+              let matches = true;
+              for (let k = 0; k < targetBytesLength; k++) {
+                if (hashBytes[k] !== targetBytes[k]) {
+                  matches = false;
+                  break;
+                }
+              }
+
+              if (matches) {
+                self.postMessage({ nonce, found: true });
+                return;
+              }
+
+              nonce++;
+            }
+
+            processed += batchSize;
+          } catch (error) {
+            console.error("[cap] fallback worker error", error);
+            self.postMessage({
+              found: false,
+              error: error.message,
+            });
+            return;
+          }
+        }
+      }
+
+      if (!hasher) {
+        hasher = await hashwasm.createSHA256();
+      }
 
       const buffer = new Uint8Array(128);
-      const encoder = new TextEncoder();
 
       while (true) {
         try {
@@ -446,10 +504,6 @@
           }
 
           processed += batchSize;
-          if (processed >= reportInterval) {
-            self.postMessage({ nonce, found: false });
-            processed = 0;
-          }
         } catch (error) {
           self.postMessage({ found: false, error: error.message });
           return;