HTML中常用HASH算法使用笔记

一、前言

出于安全考虑，对于网页端传输的敏感数据（例如：密码）不能明文传输，而是需要加密传输。

而且出于网页端的特殊性，加密方式既不能使用对称加密，更不能使用非对称加密（密钥获取方式会暴露），而只能使用HASH算法：前后端通过相同HASH算法，获取目标内容的签名，通过签名是否匹配来推断所传输的内容是否匹配。

常用HASH算法按照复杂程度依此为：MD5、SHA-1、SHA-256、Keccak256、SHA-512。国密 SM3 对标 SHA-256。

出于安全考虑，MD5方式已不建议使用，推荐使用的是 SM3 或 SHA-256 算法。

二、技术线路

对于 SHA-256 推荐使用的 js 库是 crypto-js，而 SM3 推荐使用的是 sm-crypto。

三、使用 Demo

(1) crypto-js

html 复制代码

	<script type="text/javascript" src="crypto-js-4.1.1.min.js"></script>
	<script type="text/javascript">
		var src = "1、、2。。3，，4：：5？？6";
		var sha256 = CryptoJS.SHA256(src);
		。。
		document.write("<br>+ sha256 : ", sha256.toString());
		。。
	</script>

网页输出效果：

bash 复制代码

+ src    : 1、、2。。3，，4：：5？？6
+ sha256 : f2abb160ac38fc95ae9d4bbc3d183c7ddc7fe1df827ee1b413e7c62fd77a0649

(2) sm-crypto

html 复制代码

	<script type="text/javascript" src="sm3.js"></script>
	<script type="text/javascript">
		var src = "1、、2。。3，，4：：5？？6";
		var sm3 = sm3(src);
		。。
		document.write("<br>+ sm3    : ", sm3.toString());
		。。
	</script>

网页输出效果：

bash 复制代码

+ src    : 1、、2。。3，，4：：5？？6
+ sm3    : a22476416a5b1b897553602c4d213b4ae6796911a40fb1b3f3772d67527a6db4

(3) jquery-md5 （old style）

html 复制代码

	<script type="text/javascript" src="jquery-3.7.1.min.js"></script>
	<script type="text/javascript" src="jquery.md5.js"></script>
	<script type="text/javascript">
		var src = "1、、2。。3，，4：：5？？6";
		var md5= $.md5(src);
		。。
		document.write("<br>+ md5    : ", md5.toString());
		。。
	</script>

网页输出效果：

bash 复制代码

+ src    : 1、、2。。3，，4：：5？？6
+ md5    : 9eb6b2e6c5000af57667a42a8b4c0189

四、补充

对于后端HASH算法，JCE（Java Cryptography Extension）更丰富：SHA系（SHA-1、SHA-256、SHA-512）和 MD系（MD2、MD5）等。

需要注意，JSE中不包含国密（SM系）。国密需引入 Bouncy Castle 提供器。

值得一提的是，Bouncy Castle 还提供了号称 SHA 3代算法Keccak。其中 Keccak-256 是 SHA-256 的升级版。但遗憾的是在前端似乎还没有js实现。

【END】