前端提交数据到后台，如果不适用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实现的更多相关文章

  1. Javascript实现base64的加密解密【转】

    场景 这几天使用PHP向前端传值的时候,遇到一个问题,要将代码传过去赋值.如果使用urlencode()和urldecode()函数,就会出现js无法解码的情况,因为php和js的相关函数算法不一致. ...

  2. JAVASCRIPT加密方法，JS加密解密综述（7种）

    一:最简单的加密解密 对于JAVASCRIPT函数escape()和unescape()想必是比较了解啦(很多网页加密在用它们),分别是编码和解码字符串,比如例子代码 用escape()函数加密后变为 ...

  3. 兼容javascript和C#的RSA加密解密算法，对web提交的数据进行加密传输

    Web应用中往往涉及到敏感的数据,由于HTTP协议以明文的形式与服务器进行交互,因此可以通过截获请求的数据包进行分析来盗取有用的信息.虽然https可以对传输的数据进行加密,但是必须要申请证书(一般都 ...

  4. C#, Java, PHP, Python和Javascript几种语言的AES加密解密实现[转载]

    原文:http://outofmemory.cn/code-snippet/35524/AES-with-javascript-java-csharp-python-or-php c#里面的AES加密 ...

  5. JavaScript加密解密7种方法总结分析

    原文地址:http://wenku.baidu.com/view/9048edee9e31433239689357.html 本文一共介绍了七种javascript加密方法: 在做网页时(其实是网页木 ...

  6. Java & PHP & Javascript 通用 RSA 加密 解密 (长字符串)

    系统与系统的数据交互中,有些敏感数据是不能直接明文传输的,所以在发送数据之前要进行加密,在接收到数据时进行解密处理:然而由于系统与系统之间的开发语言不同. 本次需求是生成二维码是通过java生成,由p ...

  7. CSS, JavaScript 压缩, 美化, 加密, 解密

    CSS, JavaScript 压缩, 美化, 加密, 解密 JS压缩, CSS压缩, javascript compress, js在线压缩,javascript在线压缩,css在线压缩,YUI C ...

  8. 一段有用的javascript加密解密

    今天在做一个老项目时,遇到一个需求,在javascript将url中的参数加密解密,从网上找发现了这段有用的代码: <SCRIPT LANGUAGE="JavaScript" ...

  9. C# javascript 采用 RSA 加密解密

    C# javascript 采用 RSA 加密解密 1.C#提供公钥 2.javascript用公钥加密 3.C#用私钥解密 4.javascript 类库 https://www.pidder.de ...

随机推荐

  1. ios cocos2d 画线出现闪烁问题

    根据http://www.merowing.info/2012/04/drawing-smooth-lines-with-cocos2d-ios-inspired-by-paper/ 用cocos2d ...

  2. Codeforces Round #215 (Div. 2) B. Sereja and Suffixes

    #include <iostream> #include <vector> #include <algorithm> #include <set> us ...

  3. SVN版本控制工具使用学习

    SVN版本控制工具使用学习 Subversion是优秀的版本控制工具. 1.下载和搭建SVN服务器 http://subversion.apache.org/packages.html 类型有5种,推 ...

  4. 【BZOJ】3211: 花神游历各国

    题意 \(n\)个点,第\(i\)个点值为\(a_i\).\(m\)个询问,每次询问\([l, r]\)内的和或者将\([l, r]\)的每个值改为自己的算术平方根.(\(n \le 100000, ...

  5. 【BZOJ】2938: [Poi2000]病毒

    题意 \(n\)个01病毒串,总长不超过\(30000\).问是否存在无限长的不包含病毒串的01串. 分析 考虑ac自动机,如果不包含病毒串而且无限长也就是说存在一个环(转移和fail树),使得环上不 ...

  6. 【BZOJ】1367: [Baltic2004]sequence

    题意 给\(n(n \le 10^6)\)个数的序列\(a\),求一个递增序列\(b\)使得\(\sum_{i=1}^{n} |a_i-b_i|\)最小. 分析 神题啊不会. 具体证明看黄源河论文&l ...

  7. 【BZOJ】3239: Discrete Logging

    http://www.lydsy.com/JudgeOnline/problem.php?id=3239 题意:原题很清楚了= = #include <bits/stdc++.h> usi ...

  8. 解决clang: error: no such file or directory: such file or directory:的问题

    一,详细问题描述 clang: error: no such file or directory: 'xxx/src/GGBaCollectionViewCell.m' clang: error: n ...

  9. 一个网页抓取的类支持get+post+cookie存储

    前段时间提取了一个工具类,分享给大家: <?php class httpconnector { private $curl; private $cookie; private $kv; func ...

  10. Redis入门笔记(二)-配置及运行

    转自: http://gly199.iteye.com/blog/1056424 1.redis基本参数 redis的配置文件中的常见参数如下: daemonize   是否以后台进程运行,默认为no ...