🔑 Argon2 KDF

Author: ryanamaral

README.md

@@ -62,11 +62,13 @@ chrome://flags/#enable-experimental-web-platform-features
 * [Web Serial API](https://web.dev/serial/)
 * [Lottie Web](https://github.com/airbnb/lottie-web)
 * [Material Design UI components for the web](https://github.com/material-components/material-components-web)
+* [SHA-512](http://pajhome.org.uk/crypt/)
+* [Argon2](https://github.com/antelle/argon2-browser)
 
 
 ## 📦 Sources
 
-* [JS implementation of SHA-512](http://pajhome.org.uk/crypt/)
+* [Load Wasm in manifest-v3](https://groups.google.com/a/chromium.org/g/chromium-extensions/c/sJiaTnFMLHQ/m/y-qT1gplHwAJ)
 * [Load favicon images](https://stackoverflow.com/a/15750809/904907)
 * [UI of PIN input](https://codepen.io/bradeneast/pen/YzzMoGw)
 * [USB Memory Stick Animation](https://lottiefiles.com/20358-usb-memory-stick-animation)
@@ -75,8 +77,7 @@ chrome://flags/#enable-experimental-web-platform-features
 
 ## 🔮 Future improvements
 
-- Read NFC Tag ID
-- Hash with Argon2
+- Read NFC Tag ID with an external reader via USB serial (optional input)
 
 
 ## 📄 License

app.html

@@ -24,6 +24,7 @@
     <!-- Github right -->
     <a target="_blank" rel="noopener noreferrer" href="https://github.com/TurtlPass/turtlpass-chrome-extension" class="github-corner" aria-label="View source on GitHub"><svg width="80" height="80" viewBox="0 0 250 250" style="fill:#43AA8F; color:#fff; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a>
 
+    <script type="text/javascript" src="js/kdf.js"></script>
     <script type="text/javascript" src="js/sha512.js"></script>
     <script type="text/javascript" src="js/app.js"></script>
   </body>

js/app.js

@@ -38,7 +38,7 @@ connectButton.addEventListener('click', () => {
         anim = bodymovin.loadAnimation(loaderAnimParams);
         anim.playSegments(loadingSegment, true);
         window.onresize = anim.resize.bind(anim);
-        connectSerial();
+        startKdfWorker();
     } else {
         alert('Error: Web Serial API is not supported by your browser.');
     }
@@ -157,14 +157,13 @@ document.addEventListener('DOMContentLoaded', function() {
 });
 
 ////////////////
-// USB Serial //
+// KDF Worker //
 ////////////////
 
-var port, textEncoder, writableStreamClosed, writer;
-let keepReading = true;
-let reader;
+async function startKdfWorker() {
+    message.style.marginTop = '30px';
+    message.innerHTML = "Generating hash...";
 
-async function sendSerialLine() {
     chrome.storage.local.get('selectedDomain', function(resultDomain) {
         if (!chrome.runtime.error && resultDomain.selectedDomain != undefined) {
             const domain = resultDomain.selectedDomain;
@@ -174,12 +173,21 @@ async function sendSerialLine() {
                     try {
                         const pin = document.getElementById('n1').value += document.getElementById('n2').value += document.getElementById('n3').value += document.getElementById('n4').value += document.getElementById('n5').value += document.getElementById('n6').value;
                         var data = "";
-                        data += pin; //ex: 123456
-                        data += domain; //ex: "google.com"
-                        data += result[domain]; //ex: "test@ryanamaral.com"
+                        data += domain; //ex: "google"
+                        data += result[domain]; //ex: "web@turtlpass.com"
+                        // console.log(data)
                         var sha512 = hex_sha512(data);
-                        var dataToSend = "/" + sha512 + "\n";
-                        writer.write(dataToSend);
+
+                        const params = {
+                            pass: pin,
+                            salt: sha512,
+                            time: 32, // number of iterations
+                            mem: 65536, // 64 MiB memory cost
+                            hashLen: 64,
+                            parallelism: 4, // number of threads in parallel
+                            type: 1 // Argon2Type.Argon2i
+                        };
+                        kdfWorker('simd', params);
 
                     } catch (errorMsg) {
                         alert(errorMsg);
@@ -190,7 +198,55 @@ async function sendSerialLine() {
     });
 }
 
-async function connectSerial() {
+var worker;
+function kdfWorker(method, params) {
+    if (worker) {
+        if (worker.method === method) {
+            // Using loaded worker
+            worker.postMessage({ calc: method, arg: params });
+            return;
+        } else {
+            worker.terminate();
+        }
+    }
+    console.log('Starting worker...');
+
+    worker = new Worker('js/kdf-worker.js');
+    worker.method = method;
+    var loaded = false;
+    worker.onmessage = function (e) {
+        // console.log(e.data.msg);
+        if (e.data.hash) {
+            connectSerial(e.data.hash);
+        } else if (!loaded) {
+            loaded = true;
+            worker.postMessage({ calc: method, arg: params });
+        }
+    };
+}
+
+function loadScript(src, onload, onerror) {
+    var el = document.createElement('script');
+    el.src = src;
+    el.onload = onload;
+    el.onerror = onerror;
+    document.body.appendChild(el);
+}
+
+function log(msg) {
+    if (!msg) return;
+    console.log(msg);
+}
+
+////////////////
+// USB Serial //
+////////////////
+
+var port, textEncoder, writableStreamClosed, writer;
+let keepReading = true;
+let reader;
+
+async function connectSerial(hash) {
     message.style.marginTop = '30px';
     message.innerHTML = "Connecting to your TurtlPass device...";
 
@@ -209,9 +265,12 @@ async function connectSerial() {
 
         writer = textEncoder.writable.getWriter();
 
-        sendSerialLine();
+        var dataToSend = "/" + hash + "\n";
+        writer.write(dataToSend);
 
     } catch (errorMsg) {
+        console.log(errorMsg);
+
         if (errorMsg == 'NotFoundError: No port selected by the user.') {
             showError('Device not found! Please Try Again');
         } else {