加/解密系列(二)-前端加密md5实现--CryptoJS v3.1.2+
来源:互联网 发布:电梯仿真软件 编辑:程序博客网 时间:2024/05/20 18:44
一、CryptoJS v3.1.2下载地址:
https://code.google.com/p/crypto-js/downloads/list 或 http://www.oschina.net/p/crypto-js/
二、项目结构
三、项目需要导入的jar包
本项目后台用的是struts2,所以需要导入struts2的jar包。把下面的包导入到项目的WebRoot/WEB-INF/lib目录下
四、项目需要导入的js文件
下载CryptoJS v3.1.2后,解压,解压后的文件夹的根目录下有两个目录,其中core-min.js 在components目录下,md5.js在rollups目录下。找到这两个js文件,然后在项目的WebRoot根目录下新建js文件夹,把这两个js文件放在WebRoot/js目录下
五、各个文件的源码
(1) 在src根目录下新建包com.md5.action , 在该包下建立EncryptAction.java
EncryptAction.java
package com.md5.action;import com.opensymphony.xwork2.ActionContext;public class EncryptAction {private String userName;private String password;public String getUserName() {return userName;}public void setUserName(String userName) {this.userName = userName;}public String getPassword() {return password;}public void setPassword(String password) {this.password = password;}public StringencryptByMd5() {ActionContext context = ActionContext.getContext();context.put("userName", this.userName);context.put("password", this.password);return "success";}}
(2) 在src根目录下新建xml文件struts.xml
struts.xml
<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN" "http://struts.apache.org/dtds/struts-2.1.dtd"><struts> <!-- 配置 Struts 2 应用中的常量 --> <constant name="struts.i18n.encoding" value="UTF-8"/> <package name="md5" extends="struts-default"> <action name="md5Action" class="com.md5.action.EncryptAction" method="encryptByMd5"><result name="success">/success.jsp</result> </action></package></struts>
(3) 修改web.xml文件
web.xml
<?xml version="1.0" encoding="UTF-8"?><web-app version="3.0" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"><!-- 设置struts 2过滤器 --><filter><filter-name>struts 2</filter-name><filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class></filter><filter-mapping><filter-name>struts 2</filter-name><url-pattern>/*</url-pattern></filter-mapping><!-- 设置欢迎页面 --><welcome-file-list><welcome-file>index.jsp</welcome-file></welcome-file-list><!-- session超时定义,单位为分钟 --><session-config><session-timeout>30</session-timeout></session-config></web-app>
(4) 在WebRoot根目录下建立分别index.jsp 、md5Demo.jsp、success.jsp
index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><base href="<%=basePath%>"><title>首页</title></head><body><a href="md5Demo.jsp">去测试md5实例</a></body></html>md5Demo.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><base href="<%=basePath%>"><title>md5加密实例</title><script type="text/javascript" src="js/core-min.js"></script><script type="text/javascript" src="js/md5.js"></script><scripttype="text/javascript">//md5加密函数function EncryptByMd5(){//获取表单中的密码文本框的值var password = document.getElementById("password").value;//用CryptoJS库的md5加密算法给密码加密var passwordMd5 = CryptoJS.MD5(password);//把加密后的密码值重新赋值给表单中的密码document.getElementById("password").value = passwordMd5;}</script></head><body><form action="md5Action" method="post"> 用户名:<input type="text" name="userName" id="userName" /><br />密码:<input type="password" name="password" id="password" /><br /><input type="submit" value="提交" onclick="EncryptByMd5()" /><br /></form></body></html>success.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%@ taglib prefix="s" uri="/struts-tags" %><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><base href="<%=basePath%>"><title>成功跳转</title></head><body>用户名:<s:property value="#request.userName" /><br />密码:<s:property value="#request.password" /><br /></body></html>
完成以上所有的步骤后,把项目发布到服务器,用浏览器访问md5Demo.jsp ,输入用户名、密码后,提交,你会看到密码加密后的数据
提交前(密码输入的是:123456789)
提交后
即把123456789通过md5算法加了密后,就变成了 25f9e794323b453885f5181f1b624d0b
六、说明:
本实例只展示了CryptoJS v3.1.2实现md5数据加密的简单用法。
在实际项目中,例如,在用户注册的时候,在密码输入框 用上以上的md5算法,给密码加密,通过表单提交给后台,后台处理后,就把表单的内容存入到数据库(密码是表单里的属性,加了密的密码也存进数据库)。 用户注册了之后,在登录的时候,用户输入密码,这时候,只需要给用户输入的该密码也用上以上加密算法,然后再用表单提交给后台。后台就拿着表单中已经加了密的用户输入的密码,跟数据库中已经加了密的密码匹配验证就行了。而不是把数据库里的密码先解密,然后再用用户提交的没有加密的密码跟它匹配。
因为md5算法是不可逆的,所以解密后的数据可能不是原来的数据,而是别的数据,而某一数据通过md5算法加密后的密文是唯一的。所以采有以上方法才是适合的做法。
- 加/解密系列(二)-前端加密md5实现--CryptoJS v3.1.2+
- 加/解密系列(三)-前端加密JS库--CryptoJS
- 加/解密系列(三)-前端加密JS库--CryptoJS
- CryptoJS v3.1.2实现md5数据加密实例
- CryptoJS 使用MD5加密
- cryptojs aes 加密 解密
- 【加密解密】加解密技术之 MD5
- 使用cryptojs加密/解密数据
- CryptoJS & JAVA AES加密、解密
- AES/CryptoJS/PHP 加密解密
- CryptoJS实现AES加密
- MD5加密、DES加解密、RSA加解密
- JavaScript的CryptoJS AES/ECB/NoPadding加密,可与JAVA objective-c 进行同步加解密
- MD5 转码 实现加密解密
- 前端用CryptoJS类库的AES加密,后端解密不出来
- 用vb实现DES加解密算法(二)--加密
- Java 加解密技术系列之 MD5
- Java 加解密技术系列之 MD5
- JAVA中的GC机制
- sed-非交互式流编辑器详解
- redis事务管理
- opencv1.0
- 详谈android启动模式
- 加/解密系列(二)-前端加密md5实现--CryptoJS v3.1.2+
- 线程池系列一:线程池作用及Executors方法讲解
- rsync 的简单使用
- PHP命名空间(Namespace)的使用详解
- 线程与进程的关系
- aapt 快速分析apk工具aapt的使用
- mysql 1449 : The user specified as a definer ('root'@'%') does not exist 解决方法
- WebApplicationContext类的作用
- 电气2班徐立立(随机产生100个数并排序)