今天遇到一个问题:在一个前后端不分离的项目中需要引入第三方加密插件jsencrypt对密码进行加密
本来以为很简单,只要导入js文件到static文件夹中,然后使用相对路径引用就OK了,没想到使用相对路径../../这种引入不成功。
成功代码:
<script th:src="@{/js/jsencrypt.min.js}"></script>
百度了一下,这种写法是一个叫Thymelea的框架的写法链接
成功引入后又遇到了第二个问题:这个项目的使用的jq进行的逻辑书写,在想后端传递数据的时候,直接传递的是$('form').serialize()这个值,这里代码的意思获取form表单中所有表单元素的值,并将其序列化成字符串。
我想要在传递之前对表单里面的数据加密后再次上传
var formdata=new FormData($('form')[0])//利用原生获取表单方法
var formObj=[]//设置空对象
var passWord=$("id").val()//获取密码
passWord=encrypt(passWord)//加密
formdata.set('passWord',passWord)//替换表单中的数据
// 此时数据已经替换完成,但是使用formdata当做参数依然报错,因为接口需要的参数为json格式
// formdata对象特殊,但是可以通过循环取值,创造一个新的对象
formdata.forEach(function(value,key){
formObj[key]=value
return JSON.stringify(formObj) //返回json格式数据
})
通过上面操作,成功加密
formdata与json
还有一种方法:通过$('form').serializearray()拿到表单数据数组,通过循环遍历找到更改的数据进行更改加密
serializearray是一种jQuery的方法,它可以封装表单元素为一个数组,用于表单的序列化。