最全前端加密方式、对称加密DES 非对称加密 RSA加密 MD5 base64

在HTTP协议下，数据是明文传输，传输过程中网络嗅探可直接获取其中的数据。如用户的密码和信用卡相关的资料，一旦被中间人获取，会给用户带来极大的安全隐患。另一方面在非加密的传输过程中，攻击者可更改数据或插入恶意的代码等。那么前端加密的意义:即在数据发送前将数据进行哈希或使用公钥加密。如果数据被中间人获取，拿到的则不再是明文。
当然还有其他一些优点:例如避免后端等打印日志直接暴露明文密码,还可以避免明文撞库等.

加密是指将明文通过加密算法和加密密钥转为密文解密是指将密文通过解密算法和解密密钥转为明文

•JavaScript加密后传输(具体可以参考后面的常见加密方法)
•浏览器插件内进行加密传输(这个用得不是很多,这里暂不细究)
•Https传输

常见加密方式分为以下两类：

对称加密：采用对称密码编码技术，加/解密使用相同密钥进行，效率较高。

非对称加密：基于密钥交换协议，拥有公开密钥和私有密钥，使用公钥加密后需使用对应私钥才能进行解密。

常见对称加密有AES、DES、3DES等，这里选用AES实现。

常见非对称加密有RSA、ECC等，这里选用RSA实现。

不同于哈希(后面会提到)，加密（Encrypt）是将目标文本转换成具有不同长度的、可逆的密文。也就是说加密算法是可逆的，而且其加密后生成的密文长度和明文本身的长度有关。所以如果被保护数据在以后需要被还原成明文，则需要使用加密。
在加密算法中又分为对称加密（symmetricencryption）和非对称加密（asymmetricencryption）。

1、使用Crypto-JS通过DES算法在前端加密

npminstallcrypto-js

2、加解密使用DES算法，工作方式为ECB，填充方式为PKcs7

varCryptoJS=require("crypto-js");constsecretKey='';varafterEncrypt=('encryptCode',(secretKey),{mode:,padding:}).toString()(afterEncrypt);//8/nZ2vZXxOzPhU7ZHBwz7w==varafterDecrypt=(afterEncrypt,(secretKey),{mode:,padding:}).toString();(afterDecrypt);//encryptCode

3、使用BC通过DES算法在后端解密

3.1.安装

/groupIdartifactIdbcprov-jdk16//version/depency

3.2.加解密工具

publicclassDesCipherUtil{privateDesCipherUtil(){thrownewAssertionError("NoDesCipherUtilinstancesforyou!");}static{//(newBouncyCastleProvider());}/***加密**@paramencryptText需要加密的信息*@paramkey加密密钥*@return加密后Base64编码的字符串*/publicstaticStringencrypt(StringencryptText,Stringkey){if(encryptText==null||key==null){thrownewIllegalArgumentException("encryptTextorkeymustnotbenull");}try{DESKeySpecdesKeySpec=newDESKeySpec(());SecretKeyFactorysecretKeyFactory=("DES");SecretKeysecretKey=(desKeySpec);Ciphercipher=("DES/ECB/PKCS7Padding","BC");(_MODE,secretKey);byte[]bytes=((("UTF-8")));().encodeToString(bytes);}catch(NoSuchAlgorithmException|InvalidKeyException|InvalidKeySpecException|NoSuchPaddingException|BadPaddingException|NoSuchProviderException|IllegalBlockSizeExceptione){thrownewRuntimeException("encryptfailed",e);}}/***解密**@paramdecryptText需要解密的信息*@paramkey解密密钥，经过Base64编码*@return解密后的字符串*/publicstaticStringdecrypt(StringdecryptText,Stringkey){if(decryptText==null||key==null){thrownewIllegalArgumentException("decryptTextorkeymustnotbenull");}try{DESKeySpecdesKeySpec=newDESKeySpec(());SecretKeyFactorysecretKeyFactory=("DES");SecretKeysecretKey=(desKeySpec);Ciphercipher=("DES/ECB/PKCS7Padding","BC");(_MODE,secretKey);byte[]bytes=(().decode(decryptText));returnnewString(bytes,("UTF-8"));}catch(NoSuchAlgorithmException|InvalidKeyException|InvalidKeySpecException|NoSuchPaddingException|BadPaddingException|NoSuchProviderException|IllegalBlockSizeExceptione){thrownewRuntimeException("decryptfailed",e);}}}

3.3、解密前端的加密信息

StringfromWeb="8/nZ2vZXxOzPhU7ZHBwz7w==";Stringkey="";StringafterDecrypt=(fromWeb,key);(afterDecrypt);//encryptCode

(1)下载加密文件依赖(2)引入依赖

scriptsrc="bin/"/script

或者

import'../../assets/js/';

(3)使用方式

=`-----BEGINRSAPRIVATEKEY-----MIICXQIBAAKBgQDlOJu6TyygqxfWT7eLtGDwajtNFOb9I5XRb6khyfD1Yt3YiCgQWMNW649887VGJiGr/L5i2osbl8C9+WJTeucF+S76xFxdU6jE0NQ+Z+zEdhUTooNRaY5nZiu5PgDB0ED/ZKBUSLKL7eibMxZtMlUDHjm4gwQco1KRMDSmXSMkDwIDAQABAoGAfY9LpnuWK5Bs50UVep5c93SJdUi82u7yMx4iHFMc/Z2hfenfYEzu+57fI4fvxTQ//5DbzRR/XKb8ulNv6+CHyPF31xk7YOBfkGI8qjLoq06V+FyBfDSwL8KbLyeHm7KUZnLNQbk8yGLzB3iYKkRHlmUanQGaNMIJziWOkN+N9dECQQD0ONYRNZeuM8zd8XJTSdcIX4a3gy3GGCJxOzv16XHxD03GW6UNLmfPwenKu+cdrQeaqEixrCejXdAFz/7+BSMpAkEA8EaSOeP5Xr3ZrbiKzi6TGMwHMvC7HdJxaBJbVRfApFrE0/mPwmP5rN7QwjrMY+0+AbXcm8mRQyQ1+IGEembsdwJBAN6az8Rv7QnD/YBvi52POIlRSSIMV7SwWvSK4WSMnGb1ZBbhgdg57DXaspcwHsFV7hByQ5BvMtIduHcT14ECfcECQATeaTgjFnqE/lQ22Rk0eGaYO80cc643BXVGafNfd9fcvwBMnk0iGX0XRsOozVt5AzilpsLBYuApa66NcVHJpCECQQDTjI2AQhFc1yRnCU/YgDnSpJVm1nASoRUnU8Jfm3Ozuku7JUXcVpt08DFSceCEX9unCuMcT72rAQlLpdZir876-----ENDRSAPRIVATEKEY-----`;=`-----BEGINPUBLICKEY-----MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDlOJu6TyygqxfWT7eLtGDwajtNFOb9I5XRb6khyfD1Yt3YiCgQWMNW649887VGJiGr/L5i2osbl8C9+WJTeucF+S76xFxdU6jE0NQ+Z+zEdhUTooNRaY5nZiu5PgDB0ED/ZKBUSLKL7eibMxZtMlUDHjm4gwQco1KRMDSmXSMkDwIDAQAB-----ENDPUBLICKEY-----`;varencrypt=newJSEncrypt();();varencrypted=('encryptCode');//w1a1FXmlbFj9yOxLCoqIzNo2ytXypyupZABsi/e4kMA9mERngmaDwlOuHsUDQKC0nK1v7Ehr3vYKcALFQvjscWEkGIW/UWCk73jArwqEYF1wd45eHSCPwUeB85Ellr+IYTqhZXcfmHZUCuprF2gayPUecq7F51aWxpfqMP0uvtY=//Decryptwiththeprivatekeyvardecrypt=newJSEncrypt();();varuncrypted=(encrypted);//encryptCode

生成publickey和privateKey的在线地址

虽然前端可以加密，终归不是安全方式，如果为了更加的安全还是使用https传输，后端加密保存吧！

哈希算法（Hash）
哈希（Hash）是将目标文本转换成具有固定长度的字符串（或叫做消息摘要）。当输入发生改变时，产生的哈希值也是完全不同的。从数学角度上讲，一个哈希算法是一个多对一的映射关系，对于目标文本T，算法H可以将其唯一映射为R，并且对于所有的T，R具有相同的长度，所以H不存在逆映射，也就是说哈希算法是不可逆的。

基于哈希算法的特性，其适用于该场景：被保护数据仅仅用作比较验证且不需要还原成明文形式。比较常用的哈希算法是MD5和SHA1。

我们比较熟悉的使用哈希存储数据的例子是：当我们登录某个已注册网站时，在忘记密码的情况下需要重置密码，此时网站会给你发一个随机的密码或者一个邮箱激活链接，而不是将之前的密码发给你，这就是因为哈希算法是不可逆的。

加盐（AddingSalt）
加盐加密是一种对系统登录口令的加密方式，它实现的方式是将每一个口令同一个叫做“盐”（salt）的n位随机数相关联。

使用salt加密，它的基本想法是这样的：

用户注册时，在密码上撒一些盐。生成一种味道，记住味道。

用户再次登陆时，在输入的密码上撒盐，闻一闻，判断是否和原来的味道相同，相同就让你吃饭。

注册时:

用户注册，系统随机产生salt值。

将salt值和密码连接起来，生产Hash值。

将Hash值和salt值分别存储在数据库中。

登陆时:

系统根据用户名找到与之对应的密码Hash。

将用户输入密码和salt值进行散列。

判断生成的Hash值是否和数据库中Hash相同。

慢哈希函数（SlowHashFunction）


如果想在一个Web应用中使用密钥扩展，则需要设定较低的迭代次数来降低额外的计算成本。我们一般直接选择使用标准的算法来完成，比如PBKDF2或bcrypt。PHP、斯坦福大学的JavaScript加密库都包含了PBKDF2的实现，浏览器中则可以考虑使用JavaScript完成，否则这部分工作应该由服务端进行计算。

使用

scriptsrc="js/"type="text/javascript"/scriptscriptvarpwd=hex_md5("Victor");(pwd);//123/script

scriptsrc="js/"/scriptscriptvarstr=("admin:admin");//加密varstr1=(str);//解密(str);(str1);//12345/script

scriptsrc="js/"/scriptscriptvarsha=hex_sha1('mima123465');(sha);//123/script

scriptsrc="js/"/scriptscriptvarstr="密码";//公钥varpublicKey="MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQCfp4T5UK76SfSvn1wr4+PyStkHWONLVITZp5JLkFkHpiERchwShET+WVlLsbbgyt7Yt/boMoxr+XTD2NXd1gPvq11OU3dNYLE5hL2j8BCBw8EswkCbP+GgYdGF3FRw4eGURA4fcSO44IKuWtmtSyw7y1OMqzMUb6PROXrMFbrntQIDAQAB";//私钥varprivateKey="MIICdQIBADANBgkqhkiG9w0BAQEFAASCAl8wggJbAgEAAoGBAJ+nhPlQrvpJ9K+fXCvj4/JK2QdY40tUhNmnkkuQWQemIRFyHBKERP5ZWUuxtuDK3ti39ugyjGv5dMPY1d3WA++rXU5Td01gsTmEvaPwEIHDwSzCQJs/4aBh0YXcVHDh4ZREDh9xI7jggq5a2a1LLDvLU4yrMxRvo9E5eswVuue1AgMBAAECgYBBGEtmX9hIIplKdf5dwtgw9QWSMlLSZw6Xs/Q5LQyvyrOW6mC5yAZdck6vRzFabDz6Pd/FAr8wUxChvapNfbIyhCsyAuqjVWV/aGDhaauQvwm3MrZ33jnMxI1z9UXPHTzWrYOltv/cKVqvDTKzEokDoTzEVLQClaYcEVMwhRrpYQJBANR48h9o1s7y0sAOoVBo5ktGZhb6gHtwNJ4Yw7Aey2bAWjgU4PevUq985+jBWhdAj81dZ0lMwARBIcYzyo0RLMkCQQDAXIup+fViw0BD+gl36kOo5RkTgz3aoALJsDBLGWi2J9QY9i0UZO9LsjNlYlTldKRzJWkhjdAdxuZe+8Mr8tWNAkB39HB92yqrW9wwIhJg21hpVy17+6FeD1MljsWsQTaEpERLNT5tl8YO3W3wsniyd/i38OvHLlWaEUuIIuVQD0pBAkAFXk/ThZNQl0xi2UaMXzBWNVaW0dHXGSIayN0AK4xdkQz9SVmGuS5oeWevy6e84513TTL66b9GJXfmbLZMsrE9AkAXuppwZW4I/xWZ2RaIsKqyyYYJUPbZ9HT3iO6FSUVPskzaOIPgU9sir+UcvJfWgXDWQ2F/4uUogB2ZS45YcFM8";//加密varencrypt=newJSEncrypt();(publicKey);varencryptStr=(str);("加密后："+encryptStr);//解密vardecrypt=newJSEncrypt();(privateKey);vardecryptStr=(encryptStr);("解密后："+decryptStr);/script