vue如何实现对请求参数进行签名
作者:溫冬''123
这篇文章主要介绍了vue如何实现对请求参数进行签名问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
前端实现请求签名
前端对请求参数进行加密作为签名。
1、思路
一般请求参数种类
1.路径参数
- 会出现在url上
2.params参数
- 会出现在url上
- 所以可以将url一起进行签名
3.post的请求体参数(body)
- 可以将post请求的data数据进行排序、然后拼接成一个字符串然后与其他参数一起进行签名
防止重复请求
- 可以添加时间戳,1分钟内相同的请求为重复请求不给予放行
- 将每个请求添加唯一id,存入redis设置1分钟过期
密钥
因为加密算法是公开的,所以我们可以添加密钥进入签名,这样即使对方知道签名的加密算法,但是没有密钥也是无法串改请求的
- RSA 加密算法 (非对称加密算法)
- 通过公钥加密私钥解密,来增加安全性。
- 简化:也可以使用随机数作为密钥,这样安全系数较低,但容易实现
加密
- 选择MD5算法对参数进行加密,会使用到js-md5库
经过以上的梳理,我们可以大致明白,需要将可以被修改的参数进行加密成签名。
签名:MD5( postData ? + url + 时间戳 + 请求唯一id + 密钥 )
2、Vue实现添加请求签名
代码如下:
3、axios请求拦截器实现
import axios from 'axios" import {signatureGenerate} from "../utils/signatureUtil" const request = new axios.create({ timeout: 3000 }) // 请求拦截器 request.interceptors.request.use((config) => { // 获取请求头参数 const {signature, timestamp, secret} = signatureGenerate(config) // 分别将签名、密钥、时间戳 至请求头 if(signature) config.headers["signature"] = signature if(secret) config.headers["key"] = secret if(timestamp) config.headers["timestamp"] = timestamp // 这里未添加请求唯一id 各位可以自己实现以下,作者偷下懒 ~ ~ return config }); export default request
4、生成签名工具类
// signatureUtil.js import md5 from "js-md5"; export function signatureGenerate({data, url, headers}){ // 参数签名 密钥 + 时间戳 + header参数 + url // 密钥 let secret = Math.random().toString(36).substr(2) // 时间戳 let timestamp = new Date().getTime() // token let token = headers.Authorization // post参数 let dataStr = dataSerialize(dataSort(data)) // 生成签名 let str = dataStr + "secret=" + secret + "×tamp=" + timestamp + "&url=" + url const sign = md5(str) return { signature: sign.toUpperCase(), // 将签名字母转为大写 timestamp, secret } } // 参数排序 function dataSort(obj){ if (JSON.stringify(obj) == "{}" || obj == null) { return {} } let key = Object.keys(obj)?.sort() let newObj = {} for (let i = 0; i < key.length; i++) { newObj[key[i]] = obj[key[i]] } return newObj } // 参数序列化 function dataSerialize(sortObj){ let strJoin = '' for(let key in sortObj){ strJoin += key + "=" + sortObj[key] + "&" } // return strJoin.substring(0, strJoin.length - 1) return strJoin }
小结:
其实前端实现起来比较简单,但是还可以继续对axios进行封装,其实并不是所有的请求都需要签名。大家可以自行思考~~
我的问题就是卡在后端获取这些参数的时候浪费了很多时间。
后端API接口校验签名的实现也会陆续发布!
请求参数按照ASCII码从小到大排序后追加秘钥再进行加密得到签名值
最近在和银行对接一些就接口,甲方对于我们接口数据要求如下:
1、双方需要采用https双向认证方式传输数据
2、请求参数采用全报文加密方式
3、请求参数按照ASCII码从小到大排序后追加秘钥再进行加密得到签名值
本文主要介绍一下签名的生成工具类代码;
Step 1:
- 对所有传入参数按照字段名的 ASCII 码从小到大排序(字典序)后,使用 URL 键值对的 格式(即 key1=value1&key2=value2...) 拼接成字符 string1 。
- 注意:为空的参数不参与签名。
Step 2:
- 在第一步中 string1 最后拼接上 key=Key(密钥)得到 stringSignTemp 字符串,并对 stringSignTemp 进行 md5 运算,再将得到 的字符串所有字符转换为大写,得到 sign 值 signValue。
- 注意:KEY 最多 32 个字符(不包含特殊符号)
代码实现
1、将对应的model转换为map
public static Map<String, Object> objectToMap(Object obj) throws Exception { if (obj == null) return null; TreeMap<String, Object> map = new HashMap<String, Object>(); BeanInfo beanInfo = Introspector.getBeanInfo(obj.getClass()); PropertyDescriptor[] propertyDescriptors = beanInfo.getPropertyDescriptors(); for (PropertyDescriptor property : propertyDescriptors) { String key = property.getName(); if (key.compareToIgnoreCase("class") == 0) { continue; } Method getter = property.getReadMethod(); Object value = getter != null ? getter.invoke(obj) : null; map.put(key, value); } return map; }
注意:将实体经过上面工具类转换完成以后,已经按照参数的ACII码排序了
2、生成签名工具类
package com.jack.common.utils; import java.math.BigInteger; import java.security.MessageDigest; import java.security.NoSuchAlgorithmException; import java.util.HashMap; import java.util.Iterator; import java.util.Map; import java.util.Set; /** * @author zhenghao * @description: * @date 2019/7/3014:33 */ public class SignatureUntils { /** * 生成签名; * * @param params * @return */ static public String signForInspiry(Map params, String key) { StringBuffer sbkey = new StringBuffer(); Set es = params.entrySet(); Iterator it = es.iterator(); while (it.hasNext()) { Map.Entry entry = (Map.Entry) it.next(); String k = (String) entry.getKey(); Object v = entry.getValue(); //空值不传递,不参与签名组串 if (null != v && !"".equals(v)) { sbkey.append(k + "=" + v + "&"); } } System.out.println(sbkey); sbkey = sbkey.append("key=" + key); //MD5加密,结果转换为大写字符 String sign = toMD5(sbkey.toString()).toUpperCase(); return sign; } /** * 对字符串进行MD5加密 * * @param str 需要加密的字符串 * @return 小写MD5字符串 32位 */ public static String toMd5(String str) { String re = null; byte encrypt[]; try { byte[] tem = str.getBytes(); MessageDigest md5 = MessageDigest.getInstance("md5"); md5.reset(); md5.update(tem); encrypt = md5.digest(); StringBuilder sb = new StringBuilder(); for (byte t : encrypt) { String s = Integer.toHexString(t & 0xFF); if (s.length() == 1) { s = "0" + s; } sb.append(s); } re = sb.toString(); } catch (NoSuchAlgorithmException e) { e.printStackTrace(); } return re; } }
3、测试代码
public static void testSingn(){ try { Row row = new Row(); row.setISINUSE("1"); row.setCALLTIME("2019"); row.setSERIALNO("123"); row.setTALKTIME("344"); Map<String, Object> map = ObjectMapConvert.objectToMap(row); String qwertyu = SignatureUntils.signForInspiry(map, "123456"); } catch (Exception e) { e.printStackTrace(); } }
4、如果参数直接采用map方式,则需要采用有序的map
SortedMap<Object,Object> params = new TreeMap<Object,Object>(); params.put("id",appid); params.put("name",name); params.put("age",age); params.put("sign",signForInspiry(params,"123456"));
到这获得签名的方法完成。
总结
以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。