前端提交数据到后台，如果不适用https协议，则提交的数据就有被第三者窃取的可能。前端使用js来编码数据主要分为以下三种：

1、摘要算法

2、对称加密

3、非对称加密

下面分别介绍三种算法中对应的一个实例，并给出js实现例子。

MD5（摘要算法）

百度百科

MD5即Message-Digest Algorithm 5（信息-摘要算法5），用于确保信息传输完整一致。是计算机广泛使用的杂凑算法之一（又译摘要算法、哈希算法），主流编程语言普遍已有MD5实现。将数据（如汉字）运算为另一固定长度值，是杂凑算法的基础原理，MD5的前身有MD2、MD3和MD4。

MD5的作用是让大容量信息在用数字签名软件签署私人密钥前被"压缩"成一种保密的格式（就是把一个任意长度的字节串变换成一定长的十六进制数字串）。除了MD5以外，其中比较有名的还有sha-1、RIPEMD以及Haval等

javascript实现

实现官网

http://pajhome.org.uk/crypt/md5/index.html

网站介绍用途：

1、保护明文密码，将密码经过MD5函数换算为 128bit的散列值。

2、生成密码，用户使用统一的密码，同时添加上域名，计算出MD5散列值，用于各个网站的密码。

3、生成自解密文档，生成的文档，可以嵌入html网页，任何用户都可以访问此网页，但是只有用户输入正确的密码才能看到网页原貌。http://pajhome.org.uk/crypt/md5/uses.html#sdp

下载网站

http://pajhome.org.uk/crypt/md5/scripts.html

下载链接

http://pajhome.org.uk/crypt/md5/jshash-2.2.zip

此库同时实现的散列摘要算法

MD5	Source	Specification
RIPEMD-160	Source	Specification
SHA-1	Source	Specification
SHA-256	Source	Specification
SHA-512	Source	Specification
HMAC

实验code

<html>

<head>

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

</head>

<body>

<label>"I love you" MD5 value = </label><span id="md5control"></span>

<script type=text/javascript>

    hash = hex_md5("I love you");

    //产生的hash变量就是"input string"的md5值，用在表单提交时

    document.getElementById("md5control").innerText = hash;

</script>

</body>

</html>

网页输出：

"I love you" MD5 value = e4f58a805a6e1fd0f6bef58c86f9ceb3

AES（对称加密）

加密强度高于DES的对称加密方法，使用同一个密钥实现，加密和解密。

实现官网：

http://point-at-infinity.org/jsaes/

网站例子和解释：

http://people.eku.edu/styere/Encrypt/JS-AES.html

AES was designed to be efficient in both hardware and software, and supports a block length of 128 bits and key lengths of 128, 192, and 256 bits

测试代码：

<html>

<head>

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

</head>

<body>

<label>"00 11 22 .. EE FF" AES value = </label><span id="AEScontrol"></span>

<br/>

<label>decrypted value = </label><span id="decryptedValue"></span>

<script type=text/javascript>  

    //The following code example enciphers the plaintext block '00 11 22 .. EE FF' with the 256 bit key '00 01 02 .. 1E 1F'.

    AES_Init();

    var block = new Array(16);

    for(var i = 0; i < 16; i++)

      block[i] = 0x11 * i;

    //生成128位密钥

    var key = new Array(32);

    for(var i = 0; i < 32; i++)

      key[i] = i;

    AES_ExpandKey(key);

    AES_Encrypt(block, key);

    document.getElementById("AEScontrol").innerText = block;

    AES_Done();

    //下面对加密后的block进行解密

    AES_Init();

    //生成128位密钥

    var key = new Array(32);

    for(var i = 0; i < 32; i++)

      key[i] = i;

    AES_ExpandKey(key);

    AES_Decrypt(block, key);

    document.getElementById("decryptedValue").innerText = block;

    AES_Done();

</script>

</body>

</html>

网页输出：

"00 11 22 .. EE FF" AES value = 142,162,183,202,81,103,69,191,234,252,73,144,75,73,96,137
decrypted value = 0,17,34,51,68,85,102,119,136,153,170,187,204,221,238,255

RSA（非对称加密）

介绍

http://pajhome.org.uk/crypt/rsa/index.html

非对称加密，采用公钥进行加密，私钥进行解密。

实现网站与使用介绍

https://github.com/travist/jsencrypt

下载：

http://travistidwell.com/jsencrypt/

在线演示demo：

http://travistidwell.com/jsencrypt/example.html

实验：

私钥

-----BEGIN RSA PRIVATE KEY-----
MIICXQIBAAKBgQDlOJu6TyygqxfWT7eLtGDwajtNFOb9I5XRb6khyfD1Yt3YiCgQ
WMNW649887VGJiGr/L5i2osbl8C9+WJTeucF+S76xFxdU6jE0NQ+Z+zEdhUTooNR
aY5nZiu5PgDB0ED/ZKBUSLKL7eibMxZtMlUDHjm4gwQco1KRMDSmXSMkDwIDAQAB
AoGAfY9LpnuWK5Bs50UVep5c93SJdUi82u7yMx4iHFMc/Z2hfenfYEzu+57fI4fv
xTQ//5DbzRR/XKb8ulNv6+CHyPF31xk7YOBfkGI8qjLoq06V+FyBfDSwL8KbLyeH
m7KUZnLNQbk8yGLzB3iYKkRHlmUanQGaNMIJziWOkN+N9dECQQD0ONYRNZeuM8zd
8XJTSdcIX4a3gy3GGCJxOzv16XHxD03GW6UNLmfPwenKu+cdrQeaqEixrCejXdAF
z/7+BSMpAkEA8EaSOeP5Xr3ZrbiKzi6TGMwHMvC7HdJxaBJbVRfApFrE0/mPwmP5
rN7QwjrMY+0+AbXcm8mRQyQ1+IGEembsdwJBAN6az8Rv7QnD/YBvi52POIlRSSIM
V7SwWvSK4WSMnGb1ZBbhgdg57DXaspcwHsFV7hByQ5BvMtIduHcT14ECfcECQATe
aTgjFnqE/lQ22Rk0eGaYO80cc643BXVGafNfd9fcvwBMnk0iGX0XRsOozVt5Azil
psLBYuApa66NcVHJpCECQQDTjI2AQhFc1yRnCU/YgDnSpJVm1nASoRUnU8Jfm3Oz
uku7JUXcVpt08DFSceCEX9unCuMcT72rAQlLpdZir876
-----END RSA PRIVATE KEY-----

公钥

-----BEGIN PUBLIC KEY-----
MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDlOJu6TyygqxfWT7eLtGDwajtN
FOb9I5XRb6khyfD1Yt3YiCgQWMNW649887VGJiGr/L5i2osbl8C9+WJTeucF+S76
xFxdU6jE0NQ+Z+zEdhUTooNRaY5nZiu5PgDB0ED/ZKBUSLKL7eibMxZtMlUDHjm4
gwQco1KRMDSmXSMkDwIDAQAB
-----END PUBLIC KEY-----

精简代码：

<!DOCTYPE html>

<html>

<head>

  <title>JSEncrypt Example</title>

  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

  <script src="jquery.js"></script>

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

</head>

<body>

<div class="container">

<label>"I love you" RSA PUBLIC ENCRYPTED value = </label><br/>

<textarea id="RSAcontrol" rows="15" cols="65">

</textarea>

<br/>

<label>decrypted value = </label><span id="decryptedValue"></span>

<br/>

<br/>

<br/>

<label for="privkey">Private Key</label><br/>

<textarea id="privkey" rows="15" cols="65">-----BEGIN RSA PRIVATE KEY-----

MIICXQIBAAKBgQDlOJu6TyygqxfWT7eLtGDwajtNFOb9I5XRb6khyfD1Yt3YiCgQ

WMNW649887VGJiGr/L5i2osbl8C9+WJTeucF+S76xFxdU6jE0NQ+Z+zEdhUTooNR

aY5nZiu5PgDB0ED/ZKBUSLKL7eibMxZtMlUDHjm4gwQco1KRMDSmXSMkDwIDAQAB

AoGAfY9LpnuWK5Bs50UVep5c93SJdUi82u7yMx4iHFMc/Z2hfenfYEzu+57fI4fv

xTQ//5DbzRR/XKb8ulNv6+CHyPF31xk7YOBfkGI8qjLoq06V+FyBfDSwL8KbLyeH

m7KUZnLNQbk8yGLzB3iYKkRHlmUanQGaNMIJziWOkN+N9dECQQD0ONYRNZeuM8zd

8XJTSdcIX4a3gy3GGCJxOzv16XHxD03GW6UNLmfPwenKu+cdrQeaqEixrCejXdAF

z/7+BSMpAkEA8EaSOeP5Xr3ZrbiKzi6TGMwHMvC7HdJxaBJbVRfApFrE0/mPwmP5

rN7QwjrMY+0+AbXcm8mRQyQ1+IGEembsdwJBAN6az8Rv7QnD/YBvi52POIlRSSIM

V7SwWvSK4WSMnGb1ZBbhgdg57DXaspcwHsFV7hByQ5BvMtIduHcT14ECfcECQATe

aTgjFnqE/lQ22Rk0eGaYO80cc643BXVGafNfd9fcvwBMnk0iGX0XRsOozVt5Azil

psLBYuApa66NcVHJpCECQQDTjI2AQhFc1yRnCU/YgDnSpJVm1nASoRUnU8Jfm3Oz

uku7JUXcVpt08DFSceCEX9unCuMcT72rAQlLpdZir876

-----END RSA PRIVATE KEY-----</textarea><br/>

<label for="pubkey">Public Key</label><br/>

<textarea id="pubkey" rows="15" cols="65">-----BEGIN PUBLIC KEY-----

MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDlOJu6TyygqxfWT7eLtGDwajtN

FOb9I5XRb6khyfD1Yt3YiCgQWMNW649887VGJiGr/L5i2osbl8C9+WJTeucF+S76

xFxdU6jE0NQ+Z+zEdhUTooNRaY5nZiu5PgDB0ED/ZKBUSLKL7eibMxZtMlUDHjm4

gwQco1KRMDSmXSMkDwIDAQAB

-----END PUBLIC KEY-----</textarea><br/>

  <script type="text/javascript">

  // Call this code when the page is done loading.

  $(function() {

      // Encrypt with the public key...

      var encrypt = new JSEncrypt();

      encrypt.setPublicKey($('#pubkey').val());

      var encrypted = encrypt.encrypt("I love you");

      document.getElementById("RSAcontrol").innerText = encrypted;

      // Decrypt with the private key...

      var decrypt = new JSEncrypt();

      decrypt.setPrivateKey($('#privkey').val());

      var uncrypted = decrypt.decrypt(encrypted);

      document.getElementById("decryptedValue").innerText = uncrypted;

  });

</script>

</div>

</body>

</html>

网页输出：

"I love you" RSA PUBLIC ENCRYPTED value =

4Bgtqo6qfIZKC97wdc89aph9FrJRDqzU71BrSaoiYp/G6tUG8L5bv9/6xmD5eMDbviwVNOKPveRsQcbpCBOOKqSx50SwnnHTm0TwFaNex9h3ldV4XLyl3+OjWGdNFLaq/OCdNbZ0B+xPDlQTw+UZn1PR3FRSzpgHwQNkuEGhsYA=

decrypted value = I love you

公钥和私钥生成器：

命令行生成：

https://github.com/travist/jsencrypt

http://help.alipay.com/support/help_detail.htm?help_id=397433

加密解密及其javascript实现的更多相关文章

Javascript实现base64的加密解密【转】
场景这几天使用PHP向前端传值的时候,遇到一个问题,要将代码传过去赋值.如果使用urlencode()和urldecode()函数,就会出现js无法解码的情况,因为php和js的相关函数算法不一致. ...
JAVASCRIPT加密方法，JS加密解密综述（7种）
一:最简单的加密解密对于JAVASCRIPT函数escape()和unescape()想必是比较了解啦(很多网页加密在用它们),分别是编码和解码字符串,比如例子代码用escape()函数加密后变为 ...
兼容javascript和C#的RSA加密解密算法，对web提交的数据进行加密传输
Web应用中往往涉及到敏感的数据,由于HTTP协议以明文的形式与服务器进行交互,因此可以通过截获请求的数据包进行分析来盗取有用的信息.虽然https可以对传输的数据进行加密,但是必须要申请证书(一般都 ...
C#, Java, PHP, Python和Javascript几种语言的AES加密解密实现[转载]
原文:http://outofmemory.cn/code-snippet/35524/AES-with-javascript-java-csharp-python-or-php c#里面的AES加密 ...
JavaScript加密解密7种方法总结分析
原文地址:http://wenku.baidu.com/view/9048edee9e31433239689357.html 本文一共介绍了七种javascript加密方法: 在做网页时(其实是网页木 ...
Java & PHP & Javascript 通用 RSA 加密解密 (长字符串)
系统与系统的数据交互中,有些敏感数据是不能直接明文传输的,所以在发送数据之前要进行加密,在接收到数据时进行解密处理:然而由于系统与系统之间的开发语言不同. 本次需求是生成二维码是通过java生成,由p ...
CSS, JavaScript 压缩, 美化, 加密, 解密
CSS, JavaScript 压缩, 美化, 加密, 解密 JS压缩, CSS压缩, javascript compress, js在线压缩,javascript在线压缩,css在线压缩,YUI C ...
一段有用的javascript加密解密
今天在做一个老项目时,遇到一个需求,在javascript将url中的参数加密解密,从网上找发现了这段有用的代码: <SCRIPT LANGUAGE="JavaScript" ...
C# javascript 采用 RSA 加密解密
C# javascript 采用 RSA 加密解密 1.C#提供公钥 2.javascript用公钥加密 3.C#用私钥解密 4.javascript 类库 https://www.pidder.de ...

随机推荐

Visiual Studio2012 CLR20r3问题
看到有更新,习惯性的点了,升级到Visiual Studio Ultimate 2012 Update 1,并且按照提升重启了电脑.因为昨天太晚,也没验证.尽早打开VS,结果直接Crash.错误如下: ...
Vijos1448校门外的树题解
Vijos1448校门外的树题解描述: 校门外有很多树,有苹果树,香蕉树,有会扔石头的,有可以吃掉补充体力的…… 如今学校决定在某个时刻在某一段种上一种树,保证任一时刻不会出现两段相同种类的树,现 ...
HDU 4741 Save Labman No.004(计算几何)
题目链接抄的模版...mark一下. #include <iostream> #include <cstring> #include <cstdio> #incl ...
崩溃恢复（crash recovery）与 AUTORESTART参数
关于这个参数设置的影响,在生产系统中经历过两次: 第一次是有套不太重要的系统安装在虚拟机,这套系统所有应用(DB2 WAS IHS)都配置到/etc/rc.local中,每次启动机器会自 ...
Maven Repository
The usefully link for Maven Reponsitory display as below: http://mvnrepository.com/ For example, To ...
nfs的使用
1.安装命令:sudo apt-get install nfs-kernel-server ; sudo apt-get install nfs-common; 2.执行命令:mkdir /(目录 ...
winform学习之-----小知识（20160624）
一.//判断是否按下回车键if(e.KeyCode == Keys.Enter){ pictureBoxKeyDownLogin_Click(sender,e);}或是e.KeyCode == K ...
[LintCode] Candy 分糖果问题
There are N children standing in a line. Each child is assigned a rating value. You are giving candi ...
9.20 java继承
package liu0920; //继承 public class Person { //属性姓名和年龄 private String name; private int age; //无参构造方 ...
【hihoCoder】1041. 国庆出游
问题:详见http://hihocoder.com/problemset/problem/1041 有n个城市,城市编号为1-n,城市间有n-1条路(所以,城市路网是一棵树).给定一个序列S,要求判断 ...

加密解密及其javascript实现

MD5（摘要算法）

AES（对称加密）

RSA（非对称加密）

加密解密及其javascript实现的更多相关文章

随机推荐

热门专题