Javascript端加密java服务端解密
通常我们会通过htts来保证传输安全，但如果我们不用https，如何通过javascript来保证浏览器端发送的参数进行加密，并且通过RSA算法来处理。
这里我们可以利用jquery的一个加密插件jcryption来处理，可以参考
http://jcryption.org/#examples
现在版本是3.0 但是没有java端的实现，下次有时间再研究。现在这个用的是1.1的版本
这个可以在
http://linkwithweb.googlecode.com/svn/trunk/Utilities/jCryptionTutorial 获取
不过他的服务端有个缺陷我修改了。
接来大致介绍如下：
1. 首先服务端有产生publicKey的servlet：
package com.gsh.oauth.auth.servlet;
import java.io.IOException;
import java.security.KeyPair;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.gsh.oauth.auth.util.JCryptionUtil;
/**
* Servlet implementation class EncryptionServlet
*/
public class EncryptionServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* Default constructor.
*/
public EncryptionServlet() {
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#service(HttpServletRequest request, HttpServletResponse response)
*/
protected void service(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
int KEY_SIZE = 1024;
if (request.getParameter("generateKeypair") != null) {
JCryptionUtil jCryptionUtil = new JCryptionUtil();
KeyPair keys = null;
//if (request.getSession().getAttribute("keys") == null) { //这里注释掉 否则第二次请求会500
keys = jCryptionUtil.generateKeypair(KEY_SIZE);
request.getSession().setAttribute("keys", keys);
//}
StringBuffer output = new StringBuffer();
String e = JCryptionUtil.getPublicKeyExponent(keys);
String n = JCryptionUtil.getPublicKeyModulus(keys);
String md = String.valueOf(JCryptionUtil.getMaxDigits(KEY_SIZE));
output.append("{\"e\":\"");
output.append(e);/Files/linugb118/bcprov-jdk15-1.46.jar.zip
output.append("\",\"n\":\"");
output.append(n);
output.append("\",\"maxdigits\":\"");
output.append(md);
output.append("\"}");
output.toString();
response.getOutputStream().print(
output.toString().replaceAll("\r", "").replaceAll("\n", "")
.trim());
} else {
response.getOutputStream().print(String.valueOf(false));
}
}
}
2. Client例子
<html>
<head>
<title>Login form</title>
</head>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8">
<script src="../js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="../js/jquery-ui-1.8.2.custom.min.js"
type="text/javascript"></script>
<script type="text/javascript"
src="../js/security/jquery.jcryption-1.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var $statusText = $('<span id="status"></span>').hide();
$("#status_container").append($statusText);
$("#lf").jCryption({
getKeysURL:"/gsh/oauth/encryption?generateKeypair=true",
beforeEncryption : function() {
$statusText
.text("Test Code")
.show();
return true;
},
encryptionFinished : function(
encryptedString,
objectLength) {
$statusText
.text(encryptedString);
return true;
}
});
});
</script>
<body>
<form id="lf" action="/gsh/oauth/authorization"
method="post">
<fieldset><legend>login</legend>
<div>
<div>client_id:<br>
<input type="text" size="45" name="client_id" value=""></div>
<div>redirect_uri:<br>
<input type="text" size="45" name="redirect_uri" value=""></div>
</div>
<div>loginid:<br>
<input type="text" size="45" name="loginid" value=""></div>
</div>
<div>password:<br>
<input type="password" size="45" name="password" value=""></div>
</div>
<div>
<p><input type="submit" /><span id="status_container"></span></p>
</div>
</fieldset>
</form>
</body>
</html>
上面看代码可以看出 他通过/gsh/oauth/encryption?generateKeypair=true来先请求获取public 然后通过jcryption进行加密 然后post到服务端。Encryption就是上面的EncryptionServlet。
通过浏览器工具可以看到表单里面的数据加密为
jCryption=95f1589502288050e08b4bd8b1a360341cf616d9054531b85a6ef85783c1723b46686ec454ee81f1304fa2370ce24c4d9c06f84d47aa4bdf99310ae12b514db19bfcc325f3a39a584c23b1546550f4e0635c12486f2fd84dec137e1c61cfa775dfa3057a1f0154712aaba0af0cc61810282780f15bed909c24a184e66ab39f2e
3. 目标servlet（authorization）的解密
public class Authorization extends HttpServlet {
protected void doGet(HttpServletRequest httpServletRequest,
HttpServletResponse httpServletResponse) throws ServletException,
IOException {
PrintWriter out = httpServletResponse.getWriter();
KeyPair keys = (KeyPair) httpServletRequest.getSession().getAttribute("keys");
String encrypted = httpServletRequest.getParameter("epCryption");
String client_id = null;
String redirect_uri = null;
String loginid = null;
String password = null;
try {
String data = JCryptionUtil.decrypt(encrypted, keys);
httpServletRequest.getSession().removeAttribute("keys");
Map params = JCryptionUtil.parse(data, "UTF-8");
client_id = (String) params.get("client_id");
redirect_uri = (String) params.get("redirect_uri");
loginid = (String) params.get("loginid");
password = (String) params.get("password");
} catch (Throwable e) {
e.printStackTrace();
}
}
}
上面至少片段，需要相关的js和java问题，请在svn上面获取。另外还需要bcprov-jdk15-1.46.jar
可以在http://mvnrepository.com/artifact/org.bouncycastle/bcprov-jdk15/1.46
获取。
在使用cas3的时候，往往有这样的需求，希望每个应用有个独立的登录页面
这块cas 官方文档有一些说明
https://wiki.jasig.org/display/CAS/Using+CAS+without+the+Login+Screen
首先从官方的角度，不建议使用多个登录页面，这样对安全会形成短板。但是
用户需求之上，如果我们要实现，有下面几种方式
1.通过参数来判断css来改变布局甚至一些图片，典型cas里面的default-view中
casLoginView.jsp 里面就有这样的描述，通过描述可以看出他通过不同css来区分
weblogin和mobilelogin。
比如片段
<c:if
test="${not empty requestScope['isMobile'] and not empty mobileCss}">
<meta name="viewport"
content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<!--<link type="text/css" rel="stylesheet" media="screen" href="<c:url value="/css/fss-framework-1.1.2.css" />" />
<link type="text/css" rel="stylesheet" href="<c:url value="/css/fss-mobile-${requestScope['browserType']}-layout.css" />" />
<link type="text/css" rel="stylesheet" href="${mobileCss}" />-->
</c:if>
2.cas服务端(或者各种应用中)建立一个独立的form页面
参考：https://wiki.jasig.org/display/CAS/Using+CAS+from+external+link+or+custom+external+form
比如：
在cas(或者各种的应用页面) web-inf/ 页面添加testlogin.html
代码：
<html>
<head />
<body>
<form method="GET" action="http://192.168.2.109:8080/cas/login">
<p>Username : <input type="text" name="username" /></p>
<p>Password : <input type="password" name="password" /></p>
<p>Remember me : <input type="checkbox" name="rememberMe" value="true" /></p>
<p><input type="submit" value="Login !" /></p>
<input type="hidden" name="auto" value="true" />
<input type="hidden" name="service" value="http://localhost/user/checklogintocas.php" />
</form>
</body>
</html>
casLoginView.jsp
实现自动提交功能：
...
<%@ page contentType="text/html; charset=UTF-8" %>
<%
String auto = request.getParameter("auto");
if (auto != null && auto.equals("true")) {
%>
<html>
<head>
<script language="javascript">
function doAutoLogin() {
document.forms[0].submit();
}
</script>
</head>
<body onload="doAutoLogin();">
<form id="credentials" method="POST" action="<%= request.getContextPath() %>/login?service=<%= request.getParameter("service") %>">
<input type="hidden" name="lt" value="${loginTicket}" />
<input type="hidden" name="execution" value="${flowExecutionKey}" />
<input type="hidden" name="_eventId" value="submit" />
<input type="hidden" name="username" value="<%= request.getParameter("username") %>" />
<input type="hidden" name="password" value="<%= request.getParameter("password") %>" />
<% if ("true".equals(request.getParameter("rememberMe"))) {%>
<input type="hidden" name="rememberMe" value="true" />
<% } %>
<input type="submit" value="Submit" style="visibility: hidden;" />
</form>
</body>
</html>
<%
} else {
%>
<jsp:directive.include file="includes/top.jsp" />
...
<jsp:directive.include file="includes/bottom.jsp" />
<%
}
%>
3.第三种方法 其实是第二种方法的启发，直接把用if-else 把多个页面组合在一起，通过参数来判断显示。（最好能可以支持多套casLoginView.jsp 不过研究下来好像比较难，也许cas开发者也是为了怕再次开放的人用太多灵活的多套casLoginView.jsp 页面跳来跳去把项目搞混吧。）