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 頁面跳來跳去把項目搞混吧。）