java web项目如何对jsp页面、js文件中的js代码进行批量加密

某快消品行业“进销存管理系统“ ，由于历史原因其前页面展示采用jsp，js引用采用的是原始的文件引入、全局变量调用，甚至很多事件绑定直接基于html元素的onclick属性实现。现在甲方提出，尽量提高系统安全性，包括js代码安全性，那么问题来了，如何提高js代码安全性？通用做法有2：

js压缩，去除注释、空格、换行符等字符；
js混淆，替换变量，目的是代码依然在，但是通常不知道啥意思；
也有所谓的加密，本质上就是高级混淆。

由于项目前后端未分离，js引用也未采用模块化，因此使用常见的webpack打包实现js代码混淆肯定不合适，那么如何实现？

引用开源的js混淆库，obfuscator.io
自己用java写个混淆处理类，批量将jsp页面中<script>标签中的js代码、js文件中的js代码调用js混淆库，混淆处理后替换原文件。

1、原项目概述

WebContent
  |-assets
    |-css
    |-images
    |-js
      |-app
        |-page-bill.js
        |-page-zj.js
        ...
  |-views
    |-site
      |-index.jsp
      |-login.jsp
      ...
    |-sales
      |-order-create.jsp
      ...

1）jsp页面有大量<script>代码，如：

</div><!-- /.modal -->
<%@ include file="/views/layouts/main-body.jspf"%>
<script src="<%=res_url%>/assets/js/jsAddress.js?t=<%=tag%>"></script>
<script src="<%=base_url%>/assets/js/app/page-zj.js?t=<%=tag%>"></script>
<script type="text/javascript">
  var jxsData = [];//缓存经销商信息
	//修改经销商信息
	function edit_vendors(obj){
		var table = $('#example').DataTable();
		currentTr = $(obj).closest('tr');
		var rowData = table.row(currentTr).data();
		rowData.method = "edit";
		openvendorsDialog(rowData);
	}
...

2）jsp页面中有大量的事件处理函数，通过元素的onclick属性定义

	<div class="btn-group">
		<button id="search" class="btn btn-primary btn-sm mr-2" onclick="search(this)">
			<span class="fa fa-search"></span> 查询</button>
		<button id="export" class="btn btn-primary btn-sm" onclick="search(this)">
			<span class="glyphicon glyphicon-export"></span> 导出</button>		        		
	</div>

3）引用的js文件，只是引入代码，未模块化

2、部署js混淆node服务

1）从git获取项目，https://github.com/javascript-obfuscator/javascript-obfuscator-ui

2）部署node.js，启动项目中的server.js，本案例端口号修改为20001

在这里插入图片描述

3）加密接口http://xx.xom:20001/obfuscate

java通过httpclient组件可以调用http://xx.xom:20001/obfuscate接口进行js加密。

参数: {"code": "要加密的js串"}
返回结果：{"code": "加密后的js串", "sourceMap": ""}

3、编写java类进行jsp文件、js文件批量加密处理

脱敏需要，不提供具体java代码，有需要请私信或im联系我。

1）必须指定js或jsp文件，或者文件夹

如果文件夹则遍历该文件夹，得到要处理的js、jsp文件列表，List<String> files

2）遍历files，逐个加密

for (String file : files) {
	if (file 是js文件) {
		String  jsMinwen = readFile(file);
		if(! jsMinwen.startWith(";;;")) {	//用;;;开头表示十分已经加密过
			String jsMiwen = jiamiJs(jsMinwen);	//加密时，返回串最前面会添加;;;，用于判断二次加密
			writeFile(file, jsMiwen);
		}
	} else if (file 是jsp文件) {
		String fileContent = readFile(file);
		String dealContent = 正则匹配，替换 "<script>...</script>","<script type='text/javascript'>...</script>";  //有多个<script>...</script>需要遍历替换
		writeFile(file, dealContent);
	}
}

3）调用js加密接口

HttpClient 实现
url: xx.com:20001/obfuscate
参数：json字符串,"{\"code\":\"js明文\"}",可以定义一个Map<String,String>，然后转换为json字符串；
请求mimeType：application/json
//
String strResult = HttpClientUtil.post(url, TypeUtil.toJson(para), "application/json",
					HttpClientUtil.CHARSET_UTF8, 36000, 36000);
if (strResult.indexOf("\"code\":") > -1) {	// success, {"code":"var _0x190d=
	Map<String, Object> result = TypeUtil.toObjct(strResult, HashMap.class);
	miwen = hanziToUnicode(";;;" + result.get("code")); //汉字转unicode
} else {
	miwen = strResult;
}