javascript版前端页面RSA非对称加密解密

最近由于项目需要做一个url传参,并在页面显示参数内容的需求,这样就会遇到一个url地址可能会被假冒,

并传递非法内容显示在页面的尴尬情况

比如xxx.shtml?server=xxx是坏人&name=xxxoo

这个url被人篡改胡乱发出去,追究责任还是要追究到网站负责人的。

于是想起来用加密url参数的方法,最先想到的是用base64加密参数,但是这样有点钱的知识的人,在js里面看

到如何解密,就知道怎么加密了,url还是能胡乱伪造后来仔细思量加密,非对称加密,一闪而过,在网上找了

一下相关资料,发现有javascript版本的RSA非对称加密,大概看下如何使用,最终发现可用。

废话完毕,直接上代码:

<!DOCTYPE html>
<html>
<head>
  <title>javascript非对称加密(RSA)JSEncrypt Example</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <script src="js/jquery-3.2.1.min.js"></script>
  <script type="text/javascript" src="js/jsencrypt.js"></script>
</head>
<body>

<div class="container">

<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/>

<div class="tool">
  输入需要加密文字:<br/>
  <textarea name="" id="needCrypt" cols="30" rows="10">测试XXXX</textarea>
  <a href="javascript:void(0);" id="crypt-btn">加密</a><br/>
  加密结果:<br/>
  <textarea name="" id="resultCrypt" cols="30" rows="10">
    
  </textarea>
  <a href="javascript:void(0);" id="decrypt-btn">解密</a><br/>
  解密结果:<br/>
  <textarea name="" id="result" cols="30" rows="10">    
  </textarea>
</div>

  <script type="text/javascript">

  // Call this code when the page is done loading.
  $(function() {
      $("#crypt-btn").click(function(){
          // Encrypt with the public key...
          var encrypt = new JSEncrypt();
          encrypt.setPublicKey($('#pubkey').val());
          var encrypted = encrypt.encrypt($("#needCrypt").val());
          document.getElementById("resultCrypt").innerText = encrypted;
      });
      $("#decrypt-btn").click(function(){
          // Decrypt with the private key...
          var decrypt = new JSEncrypt();
          decrypt.setPrivateKey($('#privkey').val());
          var uncrypted = decrypt.decrypt($("#resultCrypt").val());
          document.getElementById("result").innerText = uncrypted;
      });      
  });
</script>

</div>
</body>
</html>

下载

示例:RSA非对称加密示例

原文地址:https://www.cnblogs.com/zhidong123/p/8135043.html