1, the purpose of the tool: Use the HTML5 file API to read the MD5 code. MD5 code in the unique identification of the file has a very important application, the industry commonly used MD5 file recognition, file seconds, file security check, etc.
2, Applicability: IE, Chrome are compatible;
3, defects: When uploading large files, it takes a long time to scan out the MD5 code;
4. Reference: JS file referenced (spark-md5.js)
<!DOCTYPE HTML><HTMLLang= "en"><Head> <MetaCharSet= "Utf-8"> <Metahttp-equiv= "X-ua-compatible"content= "Ie=edge,chrome=1"> <title>HTML5 Read files Hash</title> <Metaname= "Author"content= "Mofei"> <Metaname= "Viewport"content= "width=device-width; initial-scale=1.0;"> <Scriptsrc= "Spark-md5.js"type= "Text/javascript"></Script></Head><Body> <Div> <Header> <H1>HTML5 Read files Hash</H1> </Header> <Div> <inputtype= "File"ID= "File"> <DivID= "box"></Div> </Div> <Footer> <P>©Copyright by Percy (<ahref= "http://www.cnblogs.com/Percy_Lee/">Www.cnblogs.com/Percy_Lee</a>)</P> </Footer> </Div> <Scripttype= "Text/javascript">document.getElementById ("file"). AddEventListener (" Change", function () { varFileReader= NewFileReader (), Box=document.getElementById ('Box'), Blobslice=File.prototype.mozSlice||File.prototype.webkitSlice||File.prototype.slice, File=document.getElementById ("file"). files[0], ChunkSize= 2097152, Chunks=Math.ceil (file.size/chunkSize), Currentchunk= 0, BS=filereader.readasbinarystring, Spark=BS? NewSparkMD5 ():NewSparkmd5.arraybuffer (); Filereader.onload= function(ee) {spark.append (Ee.target.result); Currentchunk++; if(Currentchunk<chunks) {Loadnext (); } Else{Box.innertext= 'MD5:' +Spark.end (); } } functionLoadnext () {varStart=Currentchunk*chunkSize, End=Start+chunkSize>=file.size?File.size:start+chunkSize; if(BS) filereader.readasbinarystring (Blobslice.call (file, start, end)); ElseFilereader.readasarraybuffer (blobslice.call (file, start, end)); } loadnext (); }); </Script></Body></HTML>
HTML5 file API read MD5 code tool