search

antelle / argon2-browser

Argon2 library compiled for browser runtime
https://antelle.net/argon2-browser
MIT License
367 stars 79 forks source link

Running in WebWorker #39

Closed Tronic closed 4 years ago

Tronic commented 4 years ago

I see that the demo page runs in a worker thread but this code isn't included in the Node distribution and from what I can see from the demo page, it is quite complicated. I can't get the normal version loading because of

Uncaught (in promise) TypeError: Module scripts are not supported on WorkerGlobalScope yet (see https://crbug.com/680046).
    at loadWasmModule (argon2.js:74)
    at argon2.js:63

Are you planning to include proper worker support & code in the distribution as well? Otherwise, is there any simple way to get it working?

antelle commented 4 years ago

Hi! I'm not planning to release this. Most likely the easiest way is to copy calc.js and worker.js from the demo and adjust them to your needs.

nonnish commented 4 years ago

For anyone else who wants to run this in a Web Worker, try doing what I did:

  1. In the worker script, import the script using importScripts importScripts("/node_modules/argon2-browser/lib/argon2.js");

  2. Now open lib/argon2.js and scroll down to the function 'loadWasmModule'

  3. Change: return import('/node_modules/argon2-browser/dist/argon2.js'); To: return importScripts('/node_modules/argon2-browser/dist/argon2.js');

  4. When running the actual worker, remember to include '{type: "module"}' var worker = new Worker("worker.js", { type: "module" });

Tronic commented 4 years ago

FWIW, I got it working in https://arcyph.zi.fi/ and that solution may be freely forked by anyone who is interested (view source).

kekbur commented 4 years ago

@littalthiefu Thank you very much. Your comment saved me a lot of time and headache.

D-Nice commented 3 years ago

In my case, I had the luxury of having webpack available which makes it super simple to run this in a webworker, in what I consider to be a very maintanable way.

  1. Use webpack in your project (maybe other bundlers work but steps will differ).
  2. Install worker-loader npm i --save-dev worker-loader .
  3. Then make and use your worker under src just as you would any other js, no need to worry about importscripts... don't even have to change your webpack config, can just do an inlined import of your worker.
tasn commented 3 years ago

I built a wrapper module so you can easily use this module as a webworker in a webpack (or other project). Argon2-browser is loaded inline (no import scripts which don't get SRI!!), so you can easily use it in any project. yarn add argon2-webworker https://github.com/etesync/argon2-webworker

I haven't implemented all of the API, but the API is identical to this module, so using it is exactly the same.