前端HTTPS认证主要用于POST发送接口请求中的header加入加密后的参数(主要是tmtimestampnew,tmrandomnumnew,tmencryptkeynew三个参数),参数主要用了base64、md5混合加密。
获取加密参数JS在公共文件public下的transcode.js
```
注意:以下方法在TransCode函数生成必要参数,请在同一块级作用域下执行代码
1. //首先构造函数 new TransCode();
var transcode = new TransCode()
2. //执行transcode.httpsHeaders(1)生成headers参数。
var headers = transcode.httpsHeaders(1); //用变量接收,然后加入接口请求的headers中
/* transcode.httpsHeaders(1) 参数为1时,直接返回对象,加入headers中
返回类似 {
tmtimestampnew:‘1544517153323’,
tmrandomnumnew:‘jift62zw72naprm4’,
tmencryptkeynew:‘a0199c94546479c1fcaef6f540de0eb8’,
}
*/
/* transcode.httpsHeaders(2) 参数为2时,返回数组,objkey是属性名,objvalue是属性值,方便特殊情况自行组装加入headers中
返回类似[
{objkey:'tmtimestampnew',objvalue:‘1544517153323’},
{objkey:'tmrandomnumnew',objvalue:‘jift62zw72naprm4’},
{objkey:'tmencryptkeynew',objvalue:‘a0199c94546479c1fcaef6f540de0eb8’},
]
*/
```
```
//例如:jq AJAX请求
<script src="/public/static/js/jquery-3.31.min.js"></script>
<script src="/public/transcode.js"></script>
//先建立函数,post请求中header加入加密的headers对象信息即可
var transcode = new TransCode();
var headers = transcode.httpsHeaders(1);//headers参数
$.ajax({
type: "post",
url: "/system/login/userLogin",
cache: false, //禁用缓存
sync:false,
headers: headers,
//加密后的headers参数
data:data,
dataType: "json",
success: function (data) {
},error:function(){
}
})
```
```
//对于react和vue项目中,请在入口页面index.html引入下方js,方便全局可直接使用
<script src="/public/transcode.js"></script>
//类似react中封装总请求requset 方法
export default function request(url, options) {
const defaultOptions = {
credentials: 'include',
};
const newOptions = { ...defaultOptions, ...options };
//请求前,先建立函数,post请求中header加入加密的headers对象信息即可
//headers参数生成方法
let transcode = new TransCode();
let headers = transcode.httpsHeaders(1);//headers参数
if (newOptions.method === 'POST' || newOptions.method === 'PUT') {
newOptions.headers = {
Accept: 'application/json',
'Content-Type': 'application/json; charset=utf-8',
...newOptions.headers,
...headers//展开heardes里面的参数
};
}
return fetch(url, newOptions)
.then(checkStatus)
.then((response) => {
if (newOptions.method === 'DELETE' || response.status === 204) {
return response.text();
}
return response.json().then((res)=>{
let newpromise = Promise.resolve(res);
if('tmencrypt' in res && res.tmencrypt==1){
res.data= transcode.decrypt(res.data)
newpromise = Promise.resolve(res);
}
return newpromise
})
});
}
```