Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Offer CDN for WASM JavaScript #1061

Open
ed-henrique opened this issue Oct 3, 2024 · 1 comment
Open

Offer CDN for WASM JavaScript #1061

ed-henrique opened this issue Oct 3, 2024 · 1 comment

Comments

@ed-henrique
Copy link

ed-henrique commented Oct 3, 2024

Is your feature request related to a problem? Please describe.
I found it difficult to setup WASM from the docs, and in the end, I had to install Node.js and use it (adding yet another dependency to my project). I found this CDN, but I don't know if it's oficially maintained by you guys (Also, it doesn't work).

Describe the solution you'd like to see
I would like to see a way to use Themis from the browser without the need for Node.js.

Describe alternatives you've considered

  • Offer a single minified file for the libthemis.js (Containing all cryptosystems and key generation), bundled with libthemis.wasm;

Additional context
I'm not very familiar with WASM, so I don't know the feasibility of loading it from a CDN (Even more so in a security-focused project like this one). If there are any easier ways to set this up, please let me know.

@ed-henrique
Copy link
Author

ed-henrique commented Oct 3, 2024

On a side note, I could make this work by doing this:

  1. Download all of the files from the dist-es6directory from the CDN (Check the script below);
for f in context.js index.js libthemis.js libthemis.wasm secure_cell_context_imprint.js secure_cell_seal.js secure_cell_token_protect.js secure_comparator.js secure_keygen.js secure_message.js secure_session.js themis_error.js utils.js; do curl -o $f https://cdn.jsdelivr.net/npm/wasm-themis@latest/dist-es6/$f; done
  1. Execute the script below;
# Adds .js extension to all of the imports
find . -name "*.js" ! -name "libthemis.js" -exec sed -i "s/\(import.*from[[:space:]]\+['\"]\)\([^'\"]*\)\(['\"]\)/\1\2.js\3/" {} +
 
# Removes extra .js from libthemis.js import in index.js
sed -i 's/libthemis\.js\.js/libthemis\.js/g' index.js
 
# Adds default export to Module in libthemis.js
printf "\n\nexport default Module;" >> libthemis.js
 
# Removes module.exports from libthemis.js
sed -i 's/module\.exports=Module;//' libthemis.js

This way, I was able to initialize themis and use it as expected.

Example

<script type="module">
  import themis from "/index.js"; // Loading from a local file server

  async function main() {
    await themis.initialized;
    
    let keypair = new themis.KeyPair();
  
    let privateKey = keypair.privateKey;
    let publicKey = keypair.publicKey;
    
    console.log("Working 😎");
  }
  
  main();
</script>

Needless to say that this is kinda of a burden. It would be easier to add .js extensions by default, add a conditional to check if module exists before module.exports=Module; and check if in a ES6 environment to add export default Module;.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant