纯js实现验证码图片

先上效果图:

js代码如下:

export const writeAuthCode=(options)=>{
	let canvas = document.getElementById(options.canvasId);
	canvas.width=options.width||300
	canvas.height=options.height||150
	let ctx = canvas.getContext('2d');/**创建一个canvas对象*/
	ctx.textBaseline = "middle";
	ctx.fillStyle = randomColor(180, 255);/**这个范围的颜色作背景看起来清晰一些*/
	ctx.fillRect(0, 0, options.width, options.height);
	for (let i = 0; i < options.txt.length; i++) {
		let txt = options.txt.charAt(i);/**让每个字不一样*/
		ctx.font = '20px SimHei';
		ctx.fillStyle = randomColor(50, 160); /**随机生成字体颜色*/
		ctx.shadowOffsetY = randomNum(-3, 3);
		ctx.shadowBlur = randomNum(-3, 3);
		ctx.shadowColor = "rgba(0, 0, 0, 0.3)";
		let x =