How to import crypto.js in either a vanilla javascript or node based javascript project

Question

I have (succesfully) done an

 npm install --save crypto-js

in the current project. It shows up in package.json:

$grep crypto package.json
  "crypto-js": "^4.0.0",

Then in a local project javascript file I am trying to use it and have not figured it out. The following has been attempted:

var CryptoJS = require("crypto-js");

I have also tried to use the import approach after downloading the aes.js to the same local directory:

 <script type="text/javascript" src="aes.js"></script>

This results in:

Uncaught ReferenceError: require is not defined at my-project-worker.js:1

Uncaught ReferenceError: CryptoJS is not defined
    at encrypt (audio-clips-worker.js:168)
    at audio-clips-worker.js:235
    at Set.forEach (<anonymous>)
    at onmessage (audio-clips-worker.js:229)

Finally I tried leaving an absolute url:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/rollups/aes.js"></script>

That gave the same "CryptoJS is not defined" error. What are working options here - and what steps are missing or need to be done differently?

Using node I can do the following without any problems: const CryptoJS = require('crypto-js'); console.log(CryptoJS.HmacSHA1('Message', 'Key'));. — Cyclonecode
– Cyclonecode, Commented Jul 15, 2020 at 0:16

user120242 · Accepted Answer · 2020-07-15 01:19:15Z

10

Works for me. Maybe your package inclusion isn't correct:

https://jsfiddle.net/rLt7haxc/6/

var message = "café";
var key = "something";

var encrypted = CryptoJS.AES.encrypt(message, key);
//equivalent to CryptoJS.AES.encrypt(CryptoJS.enc.Utf8.parse(message), key);
var decrypted = CryptoJS.AES.decrypt(encrypted, key);

$('#1').text("Encrypted: "+encrypted);
$('#2').text("Decrypted: "+decrypted.toString(CryptoJS.enc.Utf8));

<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="1"></div>
<div id="2"></div>

CodeSandbox demo of npm project:
https://codesandbox.io/s/prod-glade-6j2rw

var CryptoJS = require("crypto-js/core");
CryptoJS.AES = require("crypto-js/aes");
var encrypted = CryptoJS.AES.encrypt(message, key);
var decrypted = CryptoJS.AES.decrypt(encrypted, key);
console.log(encrypted, decrypted);

There's a CryptoES project that is more conformant to module standards.

answered Jul 15, 2020 at 1:19

user120242

15.3k3 gold badges43 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Blaze Gawlik Over a year ago

Thank you, package inclusion on CryptoJS.AES = require("crypto-js/aes"); to use decrypt was the solution for me.

jed · Accepted Answer · 2020-07-15 03:53:20Z

2

"require is not defined" would mean you're not running it in a nodejs context. To run in vanilla environ you just need to include the script with absolute path and change your js to not use 'require' but use 'CryptoJS' like so:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/rollups/aes.js"></script>
<script>
console.log('whats up!')
console.log('encrypted', CryptoJS.AES.encrypt('themessage', 'thekey'))
</script>

answered Jul 15, 2020 at 3:53

jed

864 bronze badges

Comments

krish · Accepted Answer · 2023-04-16 13:05:52Z

2

For any rookies out there you've to declare the Crypto JS url above the project JS file for it to work, like this:

  <!-- JavaScript and other scripts here -->
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
    <script src="script.js"></script>

if you declare it in below way you'll get an error caught ReferenceError: CryptoJS is not defined.

    <!-- JavaScript and other scripts here -->
    <script src="script.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>

answered Apr 16, 2023 at 13:05

krish

2575 silver badges19 bronze badges

Collectives™ on Stack Overflow

How to import crypto.js in either a vanilla javascript or node based javascript project

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related