Encryption and hashing using crypto-js

Ask the community
,
1

I would like to hash and encrypt my request to the external API. For this purpose, I would like to use the famous “crypto-js” javascript library, however unable to do so.
Hence I need your help in achieving the same. Your help is highly appreciated.


Does Wix provides any library for this purpose or I have use the external javascript files? Please explain in detail.

2 Likes
2

I don’t believe they have support for external libraries. Can I ask you how would you use this library externally? I have a problem to solve that involves 3rd party libraries as well.

3

Hi,
Currently there’s no option to import external libraries. You can copy the library’s code, add this as a JS file and import it as you import a regular JS code.

I hope it’s clear.

Best,
Tal.

4

Hi Tal,

I am able to use the library now by following your suggestion. Thank you.
The steps I followed are…

  1. Copied the JS library code and pasted it in a new JS file in public folder.
    though it showed error, it worked perfectly. Earlier I was skeptical about the errors.
  2. Imported the library as
     import * as CryptoJS from 'public/crypto-js.js'

It worked like a charm!!

Thanks again
Raj

5

Hi,
Could you please give me a Link for th JS library code? I need it too.

Thank you,
Daniel

6

Hi Daniel,
Here is the CDN link: https://cdnjs.com/libraries/crypto-js

I used the non-minified versions of Javascript files.

576×550 32 KB

Hope this helps.

Thanks,
Raj

7

Hi,

Thanks for the quick reply. Do I have to use all those versions? And how do I do that? I’m not good at this stuff.

Appreciate your help.

8

Hello Daniel,
If you have a bit javascript experience, it would be easy for you to understand.
Here, my requirement was to use hashing algorithm HMACSHA256 to hash a string and then encode the result using Base64 algorithm.
If you see the js code of hmac-sha256.js, in first few lines you may notice something like this

module.exports = exports = factory(require("./core"), require("./sha256"), require("./hmac"));

which means, this js file requires core.js, sha256.js and hmac.js

Similarly for base64 encoding, the file is enc-base64.js

module.exports = exports = factory(require("./core"));

this js file requires core.js.
Hope it’s clear now.

Hence I included all the dependency files altogether and used the following syntax to use the CryptoJS library. Make sure you put all the JS files in public directory.

import * as CryptoJS from 'public/crypto-js.js'

Now you may select the required files based on your requirement and use it in your website.

Thanks,
Raj

9

Hi Raj,

Sorry but how do I use the function? I added the CryptoJS code thing and now how do I encrypt a string?

Thank you,
Daniel

10

Hello Daniel,
For example, if you want to encrypt and decrypt a string using AES, then the syntax is:

//to ENCRYPT
var ciphertext = CryptoJS.AES.encrypt('StringMessage', 'secretkey123');
//to DECRYPT
var bytes  = CryptoJS.AES.decrypt(ciphertext.toString(), 'secretkey123');
var plaintext = bytes.toString(CryptoJS.enc.Utf8);

You may follow this link for more examples
https://code.google.com/archive/p/crypto-js/

Thank you.
Raj

11

Hi again,

What part of the CryptoJS code do I have to put? Do I have to make any changes?

Thank you

12

Hi Daniel,
You don’t need to modify anything, just copy-paste. Let me explain it.

Step 1
Create the JS files in your public folder of website. Ex. core.js
Copy the whole code from https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/core.js to your public/core.js.
Do the same for other JS files, whichever you need.

Step 2
In your main service module file(ex. service.jsw), I mean, from where you would call the CryptoJS function,
import the cryptojs and use it as follows

import * as CryptoJS from 'public/crypto-js.js';
export function conversion(){ 
  		var secret = "Pasw0rd@123";
		var string2Sign = "Welcome to the world of programming";
		var hash = CryptoJS.HmacSHA256(string2Sign, secret);
		var signature = CryptoJS.enc.Base64.stringify(hash);
}

Hope it’s clear now.

Regards,
Raj

13

Hey,

So I did what you told me, copy the entire code, BUT is it normal that it gives several erros and warnings specially at the beginning of the code? That’s why I asked if I have to paste all the code.

Errors: “module” , “define” and “exports” not defined.
Warnings: Unnecessary semicolon.

Thank you,
Daniel

14

Hi,
It will show errors and warnings. Just ignore them
Thanks

15

@retailshopprs THANK YOU SO MUCH! It worked now. And sorry if I had to ask you some many things and I didn’t get it to work.

16

Is it possible to import express the same way ? to use app.use and app.get and app.post from express ?

17

@pptgames you can import crypto-js from NPM repository in the editor. In the editor, click on the backend folder + button, select install NPM package and select crypto-js from the list.

18

You cannot import express the same way, and it is best to ask such a question as a separate thread, as it is not related to crypto-js.

Let us know, in another thread, what you need and why you are looking to use express directly.

19

@yoav-wix
How can I reference the library from within the browser? The following failed in ‘site code’:

import CryptoJS from 'crypto-js'; // Cannot find module 'crypto-js' in 'public/pages/masterPage.js'

Thanks

20

@tennedavid NPM libraries are only available in backend code.