JS实现客户端的网页加密解密技术，可用作选择性隐蔽展示。当然客户端的加密安全度是不能与服务器相提并论，肯定不能用于密码这类内容的加密，但对于一般级别的内容用作展示已经够了。

JS加密与解密的解决方案有很多，本文则利用String对象的charCodeAt()方法和fromCharCode()方法对字符的ASCII编码进行获取和修改。

加密,解密代码：

 <!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <title>网页加密及解密</title>

     <meta name="author" content="xiongzaiqiren" />

     <meta name="keywords" content="" />

     <meta name="description" content="" />

     <meta name="generator" content="ClassBao team coding in July 10, 2017" />

 </head>

 <body>

     <p><textarea id="text1" name="textfield" cols="50" rows="5">钱庄王员外这个人怎么样?</textarea></p>

     <input type="button" name="Button1" value="加密" onClick="text1.value = MySign.Encrypt(text1.value);">

     <input type="button" name="Button2" value="解密" onClick="text1.value = MySign.UnEncrypt(text1.value);">

     <script language="JavaScript">

         var MySign = {

             //加密/解密次数

             num: 0,

             //加密

             Encrypt: function (Text) {

                 this.num = this.num + 1;

                 output = new String;

                 alterText = new Array();

                 varCost = new Array();

                 TextSize = Text.length;

                 for (i = 0; i < TextSize; i++) {

                     idea = Math.round(Math.random() * 111) + 77;

                     alterText[i] = Text.charCodeAt(i) + idea;

                     varCost[i] = idea;

                 }

                 for (i = 0; i < TextSize; i++) {

                     output += String.fromCharCode(alterText[i], varCost[i]);

                 }

                 //text1.value = output;

                 return output;

             },

             //解密

             UnEncrypt: function (Text) {

                 if (this.num > 0) {

                     this.num = this.num - 1;

                     output = new String;

                     alterText1 = new Array();

                     varCost1 = new Array();

                     TextSize = Text.length;

                     for (i = 0; i < TextSize; i++) {

                         alterText[i] = Text.charCodeAt(i);

                         varCost[i] = Text.charCodeAt(i + 1);

                     }

                     for (i = 0; i < TextSize; i = i + 2) {

                         output += String.fromCharCode(alterText[i] - varCost[i]);

                     }

                     //text1.value = output;

                     return output;

                 }

             }

         };

         //测试代码

         var testString = "光头强，还不去砍树？";

         console.log(testString);

         var sign = MySign.Encrypt(testString); //凑ˆ妣o忕›ｧ[還¬什³呯´硠S桲aﾁb

         var sign2 = MySign.UnEncrypt(sign); //光头强，还不去砍树？

         console.log(sign);

         console.log(sign2);

     </script>

 </body>

 </html>

JS里charCodeAt()和fromCharCode()方法拓展应用：加密与解密的更多相关文章

  1. Javascript中双等号(==)隐性转换机制 JS里charCodeAt()和fromCharCode()方法拓展应用：加密与解密

    Javascript中双等号(==)隐性转换机制   在Javascript中判断相等关系有双等号(==)和三等号(===)两种.其中双等号(==)是值相等,而三等号(===)是严格相等(值及类型是否 ...

  2. Java Des加解密方法（c#加密Java解密）

    最近我们用Java把一个用.net编写的老系统重新做了翻版,但是登录还是用.net的登录.这样就会遇到一个比较棘手的问题,我们登录用的cookie信息都是.net用des加密的,但我们不得不用Java ...

  3. PHP中的__toString方法(实现JS里的链式操作)

    _toString方法是在打印对象时自动调用的魔术方法,如果不声明会报以下错 Catchable fatal error: Object of class String could not be co ...

  4. js里的setTimeout和setInterval之后的页面是空白,阻塞浏览器的document对象，但是不阻塞script方法

    js里的setTimeout和setInterval是否进程阻塞? 阻塞浏览器的document对象,但是不阻塞script方法 当你在setTimeout中使用document.write时是不行的 ...

  5. js模仿jquery里的几个方法parent, parentUntil, children

    有时工作需要, 也是接着上一章的方法, 用js模仿jquery里的几个方法parent, parentUntil, children. function parent(node){ return no ...

  6. 微信小程序 引用其他js里的方法

    微信小程序中,在微信官方开发文档我们可以知道 小程序的目录结构 . 一个小程序页面由四个文件组成,一个小程序页面的四个文件具有相同路径与文件名,由此我们可知一个小程序页面对应着一个跟页面同名的js文件 ...

  7. JS删除String里某个字符的方法

    关于JS删除String里的字符的方法,一般使用replace()方法.但是这个方法只会删除一次,如果需要将string里的所以字符都删除就要用到正则. 1 2 3 4 var str = " ...

  8. 【微信小程序】 引用公共js里的方法

    一个小程序页面由四个文件组成,一个小程序页面的四个文件具有相同路径与文件名,由此我们可知一个小程序页面对应着一个跟页面同名的js文件.可是当有些公共方法,我们想抽离出来成为一个独立公共的js文件.我们 ...

  9. 记js里codePointAt()方法返回的结果的含义。

    经过<字符串的扩展>和<字符编码的那些事>这两篇文章的阅读,大概了解js里codePointAt方法返回结果的含义. var str='

随机推荐

  1. Linux - 修改系统的max open files、max user processes (附ulimit的使用方法)

    目录 1 问题说明 2 修改max open files 3 修改max user processes 4 附录: ulimit命令说明 1 问题说明 Linux 系统默认的max open file ...

  2. 约定Service构建方式

    对于DevOps中,将开发好的软件交付给运维人员去部署与维护,过程中参杂着诸多不可控制的变量,如环境问题.版本问题等等,而Docker容器极大程度上解决了这些问题,同时对于服务的持续交付,也变得方便和 ...

  3. 学习 JavaScript（二）在 HTML 中使用 JS

    基本用法 在 HTML 中使用 <script> 元素引入 Javascript , <script> 有以下 4 个常用属性: async: 异步加载,只对外部脚步有效. d ...

  4. 强化学习(十四) Actor-Critic

    在强化学习(十三) 策略梯度(Policy Gradient)中,我们讲到了基于策略(Policy Based)的强化学习方法的基本思路,并讨论了蒙特卡罗策略梯度reinforce算法.但是由于该算法 ...

  5. MTCNN算法与代码理解—人脸检测和人脸对齐联合学习

    目录 写在前面 算法Pipeline详解 如何训练 损失函数 训练数据准备 多任务学习与在线困难样本挖掘 预测过程 参考 博客:blog.shinelee.me | 博客园 | CSDN 写在前面 主 ...

  6. Service Fabric service 根据环境变量读取配置文件

    前言 一个服务或者产品,往往需要三个环境:一个开发环境(Development),一个测试环境(Staging),一个生产环境(Production), 这就不可避免的需要多个配置文件来匹配相应的环境 ...

  7. 解决 Vue 动态生成 el-checkbox 点击无法赋值问题

    博客地址:https://ainyi.com/68 最近遇到一个问题,在一个页面需要动态渲染页面内的表单,其中包括 checkbox 表单类型,并且使用 Element 组件 UI 时,此时 v-mo ...

  8. webapi 跨域问题

    参考:http://www.cnblogs.com/chenxizhang/p/3821703.html 给自己做个笔记 HttpContext.Current.Response.AddHeader( ...

  9. IDEA编写css样式报错

    粗心大意!浪费了30分钟时间,必须记录一下! 报错图片 琢磨了半天,没想出是哪里错了,很无奈!!!!!!!!! 度娘:ctrl+shift+alt+H,设置成NONE就可以了 试了一下,果然好使,不再 ...

  10. ArcGIS API For Javascript_4.8-渲染器Renderer

    渲染器:Renderer 类:esri / renderers / Renderer 继承: Renderer->Accessor 子类: ClassBreaksRenderer , Heatm ...