中软杯之可信数字资产存证应用WEB端技术点总结

学期末算是顶着实验、考试、课程答辩各种东西硬着头皮一个月把中软杯项目肝完了,现在放假了简略总结下WEB端的东西吧,以下算是自己在项目过程中花心思想了一点时间的技术点吧(可能算不上技术点哈哈)

1> js如何实现在多文件异步读取的情况下,按文件的读取顺序把文件的二进制流的md5值保存到对应的hidden中?

技术点所在:

1.1>多文件加载避免不了使用循环去遍历input.files,既然是异步中的循环就避免不了一个普遍的问题:变量的生存期,因为你传进来的变量只在当时有效,而异步块的代码并不是在当时执行,这也就导致了你本来想传进来的变量,真正到了执行的时候其实变成了undefined,这个都好解决,把变量提到全局即可

1.2>将文件的二进制流md5保存在对应的hidden中,用了比较僵硬的办法:


即在for循环读取的时候,是第 i 次循环的话,就document.getElementById("pic_bin"+i),找到对应的hidden,然后把读取的值进行md5加密,赋值给对应的hidden

但是,如果自己试过才会发现,使用input标签读取多文件的时候,文件并不会一直按照你点击的顺序加载,比如你按顺序点击001.png、002.png....008.png,但他实际的加载顺序就可能是003.png、002.png、007.png。。。所以,这里就不可行。但由于时间特别紧迫,也没时间换一个思路了,最后在这僵硬的基础上急中生智,加了一点点东西,解决了顺序随机的问题:


通过对FileReader对象自定义了一个index属性,并赋值,然后在异步加载的时候通过自定义的index找到对应的hidden,这样就很好地解决了文件顺序随机加载的问题(同时也感慨了一波弱类型语言的强大)

后续继续更新。。

猜你喜欢

转载自blog.csdn.net/qq_37960007/article/details/80982791
今日推荐