Examples

In short words jCryption is a javascript HTML-Form encryption plugin, which encrypts the POST/GET-Data that will be sent when you submit a form.

No long talking, take a look at some Examples.
Please look in the FAQ or Documentation section for more detailed information.

Simple demo »

This is the standard setup.
Like in older versions it’s still posible with one simple call to encrypt your form.

Just call jCryption on your form.

$("#normal").jCryption();

demo »

Feedback demo »

To give your user some kind of feedback that the encryption is still in progress you can show a loader.

var $status = $('<div id="status" style="margin-top:15px;"><img src="loading.gif" alt="Loading..." title="Loading..." style="margin-right:15px;" /><span>Encrypting</span></div>').hide();
$("#submitButton").parent().append($status);
 
$("#callbackForm").jCryption({
	beforeEncryption:function() {
		$status.show();
		return true;
	}
});

demo »

Bi-Directional communication »

With jCryption 2.0 you can communicate encrypted with the server, you are no longer bound to just encrypting forms.
This example is a litte more complicated than the other,
but if you want to use jCryption for bidirectional communication just look at the source code … you will understand it with ease.
Just a short explaination what is going on …

1) Client chooses a Password … (in the example a weak one, you should use a good random number in production e.g. mousemovement coordinates)
2) Client requests RSA Public key from Server
3) Client encrypts Password with RSA Public key
4) Server decrypts Password and stores it in the session
5) Server Encrypts the Password with AES and sends it back to the Client
6) Client decrypts it with AES with the Password
7) Both have now the same “secret” key which is used for communication

Here is a litte example how it works.

var $loader = $('<img src="loading.gif" alt="Loading..." title="Loading..." style="margin-right:15px;" />');
$(function() {
	var hashObj = new jsSHA("mySuperPassword", "ASCII");
	var password = hashObj.getHash("SHA-512", "HEX");
 
	$.jCryption.authenticate(password, "encrypt.php?generateKeypair=true", "encrypt.php?handshake=true", function(AESKey) {
		$("#text,#encrypt,#decrypt,#serverChallenge").attr("disabled",false);
		$("#status").html('<span style="font-size: 16px;">Let\'s Rock!</span>');
	}, function() {
		// Authentication failed
	});
 
	$("#encrypt").click(function() {
		var encryptedString = $.jCryption.encrypt($("#text").val(), password);
		$("#log").prepend("\n").prepend("----------");
		$("#log").prepend("\n").prepend("String: " + $("#text").val());
		$("#log").prepend("\n").prepend("Encrypted: " + encryptedString);
		$.ajax({
			url: "encrypt.php",
			dataType: "json",
			type: "POST",
			data: {
				jCryption: encryptedString
			},
			success: function(response) {
				$("#log").prepend("\n").prepend("Server decrypted: " + response.data);
			}
		});
	});
 
	$("#serverChallenge").click(function() {
		$.ajax({
			url: "encrypt.php?decrypttest=true",
			dataType: "json",
			type: "POST",
			success: function(response) {
				$("#log").prepend("\n").prepend("----------");
				$("#log").prepend("\n").prepend("Server original: " + response.unencrypted);
				$("#log").prepend("\n").prepend("Server sent: " + response.encrypted);
				var decryptedString = $.jCryption.decrypt(response.encrypted, password);
				$("#log").prepend("\n").prepend("Decrypted: " + decryptedString);
			}
		});
	});
 
	$("#decrypt").click(function() {
		var decryptedString = $.jCryption.decrypt($("#text").val(), password);
		$("#log").prepend("\n").prepend("----------");
		$("#log").prepend("\n").prepend("Decrypted: " + decryptedString);
	});
 
});

demo »

HTML 5 Session Storage »

Frederik Lassen added an excellent example of how to use the “new” HTML5 Session Storage so the script is not required to request the key everytime from the server instead the “key” is stored in the session.

demo »

If you want to see the old examples here is the link.

Fork me on GitHub
Comments (115) Trackbacks (1)
  1. Did you one use this lib in java environment?
    I am trying to use with jsp, but it is not work.
    Can someone explain to me how to make work in java, sample code will appriciated?

  2. Hey.
    This is a great lib to protect you from man-in-the-middle-attacks.

    They client javascript creates a random password for AES-encrption.

    But the server doesn’t know and you don’t want to make somebody reading it.

    But you cannot use symmetrical encryption because everybody then everybody could easily get the decryption ke om the client side-javascripts.

    so rsa in this direction is the only way to do this. it doesn’t work vice-versa because then you could easily read the private public key from the client.

    so great stuff, man !

  3. Why you dont use GMP not at all?

    It will complete speed up it.

  4. Looks like a great lib. Just wondering about the client sending the RSA encrypted password over the network. Can’t it be intercepted and decoded with the public RSA key? and consequently the AES encoded password from the server could be decoded as well while in transit or what am I missing?

  5. Hey,

    @Performance: I noticed that the handschake takes several seconds due to the bcpowmod function in the decrypt method. I tried GMP instead – changing the $dec declaration to

    $dec = gmp_strval(gmp_powm($dec, $dec_key, $enc_mod));

    That speeds thing up quit a lot. Unfortunately GMP is not used as widely as BC.

  6. Hi, is their any Java implementation for release 2.2.
    I’ve tried to convert the javascript but didn’t succeed.
    Any help would be appreciated.
    Thanks in advance

    Below is the code:

    Codepad

  7. I’ve found jcryption4J which is an ok Java implementation using servlet filters https://github.com/novoj/jCryption4J
    However, it is based upon jCryption version 1.1. Anybody aware of an upgrade of JCryption4J for jCryption 2.0? JCryption4J does not handle handshake requests which means the library cannot be used as such.

    Besides that, I’ve stumbled upon this hacking specialists forum flaming JCryption:
    http://news.ycombinator.com/item?id=748430
    For sure I wouldn’t use client-side encryption mechanisms to protect credit card data or the likes due to MITM but I still believe this API has a great future for those not willing to buy SSL certificates or with hosting providers who do not support it. Btw in version 2.0, ASE is a real plus. Used with java.security APIs it brings solid encryption.

    Long live to JCryption and congratulations to Daniel Griesser for coming up with this.

  8. I’ve found jcryption4J wich is a great Java implementation of jCryption for Java https://github.com/novoj/jCryption4J . However, it is based upon version 1.1 of jCryption. Anybody aware of an upgrade of jCryption4J based on version 2.0? With the current version it does not support the handshake conversation.

    Besides that, I’ve stumbled upon this hackers forum flaming jCryption:
    http://news.ycombinator.com/item?id=748430

    I understand I wouldn’t use client-side encryption mechanisms to protect credit card data or the likes due to MITM attacks but I still believe this API has a great future for those not willing to buy SSL certificates or dealing with hosting providers who do not support it. Btw in version 2.0, ASE is a real plus. Long live to jCryption!!

  9. In Michal Franc’s page, the jc.jsp is not found. anybody help please?
    http://www.michalfranc.com/articles/jcryption.html

  10. Hi. Can anybody help me. How can i break decrypted string which is being displayed by following code on example1 page main.php
    print_r($result);
    I want to break the data of this array and want to store in different varibales to be stored in database.

    I have applied $result[0] to get the data saved in this position but it shows only first letter of the first form field.

    I have also applied explode function, but no result. Can anybody please help me how can i use this array to input data into database by breaking it into parts and storing data into different variables.

  11. Still no word on validating the form before submitting and subsequently encrypting.. How shall I validate if the user input before submitting and encrypting my form.
    thanks

    • Solved.
      Create a validation function wherein you do all the field validation and finally the function returns either true or false.

      Call the function in beforeEncryption function and VOILA!!

      Example:
      $.fn.kValidate = function() {
      var fname = $(“#Firstname”).val();
      if(fname==”"){
      $(“#errfname”).fadeTo(200,0.1,function() {
      $(this).html(‘First name required.’).fadeTo(200,1);
      $(“input#Firstname”).focus();
      return false;
      });
      }else{
      return true;
      }
      }

      Now call this function:
      $(“#normal”).jCryption({
      beforeEncryption:function() {
      if($.fn.kValidate() === true){
      $status.show();
      return true;
      }else{
      return false;
      }
      }
      });

  12. does this work for file upload also?

  13. I’m trying to find out how to include it into my web page…
    I have no idea where to place the simple one line of code so as to encrypt data from my form…

    So please give an example that shows the code in the html form.

    And then also please give a SIMPLE example that shows the code that is used to decrypt the form data

    • like turi (but my apps is under development)
      I’m trying to find out how to include it into my web page…
      I have no idea where to place the simple one line of code so as to encrypt data from my form…

      So please give an example that shows the code in the html form.

      And then also please give a SIMPLE example that shows the code that is used to decrypt the form data

  14. Hi,

    I am an enthusiast of jCryption and am trying to set it up but am a relative newbie. I know HTML and CSS well but am just getting started with jQuery. I am trying to setup “Example 1″ which is included in the jCryption-1.2 download. It doesn’t work for me “stock” with no alterations and I’m trying to figure out what I need to make the encryption and decryption work. I will then study the example and model it in order to use my own form that I want to get up and running as well. Can anyone help me out as I try and get this up and running? Thank you!

  15. Hi there, Can anyone provide a example of field validation being performed before encryption takes place (using “beforeEncryption”) please?
    Many thanks.

  16. really amazing encryption just as i need to run this
    http://bit.ly/scriptmethis

  17. I tried with japanese language for example String encryption but can’t Decrypted.

  18. it give me Error:
    Like that :-
    $(“#frmLogin”).jCryption is not a function
    not a function kindly help me what i needs to install or include Please Urgent.

    Thanks
    Jagdish

  19. The current version seems to skip runs of space characters and trim them to just one space. Is this a bug? I would have liked to allow for any combination of ASCII characters at all. Any suggestions for a quick code mod in the plug-in?

  20. I downloaded the examples and tried them unchanged, same directory structure, on my university server. I get 500 internal server error. I checked permissions – no problem. Any ideas?

  21. Hi, I really thank you for your great work!
    I’m trying to apply jCryption to my website.
    I want to validate input values before submit, so I tried to use ‘onsubmit’ event. using onsubmit, submit is supposed to be stopped when it returns false.
    But, With jCryption, when it returns false, submit is not stopped.
    How can I validate input, then?

  22. I’m having problems with UTF-8. I tried the string example, with a string like fé. The decrypted string isn’t the correct one… So I modified the encrypt.php to save the string to a file. If I use a char like é as the last one of the string, it doesn’t get saved correctly. If it is in the middle of the string, it is OK.

    Any thoughts on that?
    Thanks.

    • after few hours dig, i found a solution for your problem, with the help of JSON lib, im not good at either javascript or English, but hope it helps ^_^

      $.jCryption.encrypt($(“#toEncrypt”).val(),keys,function(encrypted) {
      change to:
      $.jCryption.encrypt(JSON.stringify($(“#toEncrypt”).val()),keys,function(encrypted) {

      and

      $(“#result”).html(data);
      change to:
      $(“#result”).html(JSON.parse(data));

  23. very good library.

    for function biMultiplyDigit() at line 463/464, you need to modify:

    var result = new BigInt();

    without the ‘var’, IE won’t work properly for the string encryption

  24. GJ!But,can it be used in jquery ajax method?like “$.ajax({});” thank you!

  25. I tried it, but it’s not working for me for whatever reason. It starts up, it collects the input, then it stops… I used both the demo code and tried to create my own with the same result. Even the examples that were provided with the pack dont complete all the way. Am I missing something? jQuery is installed already and properly referenced because the form fades in using jQuery before hand. Any idea what’s going on?

  26. It would be interesting if we can define wish fields should be encrypted instead of all fields… or have I missed something :)

  27. Hi,

    I am using the java version. In which, for every form submit in browsers – Firefox/Opera/Chrome, new key pair is generated. Whereas in browser IE 7.0, it is generated only once. In other word, ajax call for generating the key pair is done only once in IE 7.0 browser session. if close the browser/clear session, new key pair is generated, that too only once. Is there any way to fix this?

    thank you

  28. Hi, I tried this java version.
    It is working well.
    But when i enter a user id of length more than 49, then the password value becomes null & the user id is showing only a 49 length value.
    How to solve this?

    • I had a similar issue; when a certain length is reached the encrypted string is split into multiple “blocks”. The Java code just put the blocks together in the wrong order, i.e. second block before first.

      It’s simple to fix.

      In the decrypt method, the loop should be running backwards, like so:

      for ( int i = blocks.length-1; i>=0; i– ) {
      byte[] data = hexStringToByteArray(blocks[i]);
      byte[] decryptedBlock = dec.doFinal(data);
      result.append( new String(decryptedBlock) );
      }

  29. Hello amr gawish,

    Can u pl provide the java implimentation for the same.

  30. The big problem of jCryption is that it want to do everything himself : to get encryption keys, it must be with an ajax request and JSON result, it cannot be a user function. The same thing for encrypted result: some users may want to get the result without sending the form.

    That’s why a extremly modify the jCryption’s architecture in my project which is using it.

    However, jCryption is an extremly interresting library and can help everybody to secure some data. ;-)

  31. Can i use this library to encrypt any custom string ???
    Some method like

    var encryptedString = jcryption.encrypt(“custom”);

    ????

    It would be really helpful if any one provides me with such a solution ???

  32. I have working java (JDK1.4) implementation if anyone is interested.

  33. I have determined, that the XML request for the keys slows down everything a lot. Maybe the keys should be generated by JavaScript when encrypting and PHP when decrypting. I believe this would dramatically speed it up.
    Unless the reason that PHP does it is because JavaScript can’t do it. If this is the case, maybe you could modify jCryption so it can.

    • Sorry this isn’t possible because with this request the keys are generated on the server.
      Theoretically it is possible to eliminate this request but this would increase page load times because the keys must be written to javascript in advance.
      I am working on an alternative to deliver precalculated prime arrays so key generation will be much faster.

  34. Very nice! One thing that I’m trying to solve is that it not work with this submit code:

    but works with this:

    • it seems that I cannot post html code here.

      it not work with this submit code:

      input type=”submit” name=”submit” id=”submit” value=”"

      but works with this:

      input type=”submit” name=”submitButton” value=”"

      • Sorry my bad, I had two of these elements… but the strange thing is that it stucks on “Encrypting Status: Completed! submitting Form” on my case…

  35. WOW!!!! Very Very Very Helpful Topics. I like it and i will also use this :)

    Thanks
    Mehedi Hasan

  36. Thanks !

    You can replace split function (depreciated from the version 5.3.0) on line 590 in the php file by explode…

  37. That’s a great security library.

  38. that’s really nice… thank you.

  39. Thanks about this program
    usefull Library
    some trouble about public-key algorithm of RSA
    How can I change some key for make the Encryption by myself?

    Do not understand about RSA :-)

    Thanks again.

  40. Good library. I will try as soon.

  41. I’m almost finished the Java Library, remaining some bugs here and there, and Oh I found a bug in your js, you declared main.php hard coded in the JS, I changed it in my JS to take it from the action attribute.

    • You can change the URL where you want to receive the keys … look in the documentation under the option “getKeysURL”.

      $(“#normal”).jCryption({
      getKeysURL:”yourdomain.com/getkeys”
      });

      Now the keys will be requested from “yourdomain.com/getkeys”. The action of the form is used to submit the form.

  42. That’s a great Library, I’m currently making it possible for Java instead of PHP.

    Thanks again.

Leave a comment

You must be logged in to post a comment.