前言

在做 前后端验签时，使用到了md5加密，发现前后端加密结果不统一，导致验签失败。这里总结一下问题原因以及解决方法，以供参考。前端使用到了CryptoJS前端加密库进行加密。

问题复现

为了测试方便，字段remark中使用了很多特殊字符。

前端

代码

		encryMd5() {
			let data = {
				name: "卢俊义",
				age: 25,
				sex: "male",
				remark: "dahsdahda~很~快的()哈肯 定='';:,.，。、？?/<>-=-=（）()好亏·-=啥多看哈 是道坎！@#￥%……&=*（）——+=-·",
			}
			
			let str = new URLSearchParams(data).toString()
			console.log("query_str", str);
			console.log("md5_str", CryptoJS.MD5(str).toString());
		}

执行结果

前端加密后得到的MD5字符串为：157474853a5d1c06f2607acbd907781d

后端

代码

	$arr = [
		"name"      =>  "卢俊义",
		"age"       =>  25,
		"sex"       =>  "male",
		"remark"    =>  "dahsdahda~很~快的()哈肯 定='';:,.，。、？?/<>-=-=（）()好亏·-=啥多看哈 是道坎！@#￥%……&=*（）——+=-·",
	];	$str = http_build_query($arr);
	echo $str.PHP_EOL;
	echo md5($str).PHP_EOL;

执行结果

后端加密后得到的MD5字符串为：c398fa37f2a8020a7a12c4bfc5027fbe

结果对比

通过使用Beyond Compare比较发现，是在构建queryString的过程中，前端字符编码时没将*号进行编码。

解决方案

通过对上一步的结果进行分析可以发现，问题是由于两端编码差异造成的。所以只要对两边编码方式进行统一就好。具体如下：

前端

代码

使用encodeURIComponent对字段值逐一进行编码，并且由于encodeURIComponent不会encode ~!*()等字符，所以要进行补充编码，具体代码如下：

		encryMd5() {
			let data = {
				name: "卢俊义",
				age: 25,
				sex: "male",
				remark: "dahsdahda~很~快的()哈肯 定='';:,.，。、？?/<>-=-=（）()好亏·-=啥多看哈 是道坎！@#￥%……&=*（）——+=-·",
			}
			for (let key in data) {
				data[key] = (data[key] + '').toString();   
				data[key] = encodeURIComponent(data[key]).replace(/!/g, '%21').replace(/'/g, '%27').replace(/\(/g, '%28').  
			    replace(/\)/g, '%29').replace(/\*/g, '%2A')
			}
			console.log("encode_obj", data);
			
			
			let str = new URLSearchParams(data).toString()
			console.log("query_str", str);
			console.log("md5_str", CryptoJS.MD5(str).toString());
		}

执行结果

前端加密后得到的MD5字符串为：36b00a7e6ad9dd23df98b50ae529b2d3

后端

代码

使用rawurlencode函数对字段值进行统一编码。

	$arr = [
		"name"      =>  "卢俊义",
		"age"       =>  25,
		"sex"       =>  "male",
		"remark"    =>  "dahsdahda~很~快的()哈肯 定='';:,.，。、？?/<>-=-=（）()好亏·-=啥多看哈 是道坎！@#￥%……&=*（）——+=-·",
	];
	foreach ($arr as $key => $val) {
		$arr[$key] = rawurlencode($val);
	}
	print_r($arr);	$str = http_build_query($arr);
	echo $str.PHP_EOL;
	echo md5($str).PHP_EOL;

执行结果

可以看到两者执行结果一致，问题解决！