js는 이미지 base64로 인코딩된 문자열을 디코딩하고 이미지 example_javascript 기술을 출력합니다.

코드 복사 코드는 다음과 같습니다. 스크립트> ////////////////////////// //base64로 인코딩된 GIF 이미지 디코딩 //작성자 Mozart0 //2005/10/29 //////////////////// //GIF 클래스 개체 만들기 / /클래스 GIF는 이 함수 내에 정의됩니다. // str64: Base64로 인코딩된 gif 파일 문자열 // 성공 시 생성된 GIF 객체를 반환합니다. // 실패 시 null을 반환합니다. function getGif(str64 ){ var bytes=decodeBase64(str64); if(!bytes){ alert("오류: 잘못된 Base64 인코딩") return null; gif =new GIF(); for(var i=0;i gif.version =String.fromCharCode(bytes[i]) if(gif.version.slice) ( 0,3)!="GIF"){ alert("오류: GIF가 아닌 이미지 형식"); return null } gif.width=bytes[i]| (바이트 [i 1] gif.height=bytes[i 2]|(바이트[i 3] var f=bytes[i 4] ; gif.colorResolution=(f>>4&0x7) 1; gif.sorted=(f&0x8)?true:false gif.BackgroundIndex=bytes[i 5]; pixelAspectRadio= bytes[i 6]; if(f&0x80){ gif.globalPalette=[]; i =getPalette(i 7,bytes,gif.globalPalette,2 } i =7; for(var j=i;j if(bytes[j]==0x21&&bytes[j 1]==0xf9) break; if(j==bytes.length){ for(;i if(bytes[i]==0x2c) break; if(i==bytes.length){ alert("오류: 이미지 데이터를 찾을 수 없음"); return null; } var f=new GIF_Frame(); 🎜 >if(!getSingleFrame(i,f)) return null else gif.frames.push(f) } else{ i=j; do{ var f=new GIF_Frame(); var t=getSingleFrame(i,f); if(!t) return null; 푸시(f); for(i =t;i if(bytes[i]==0x21&&bytes[i 1]==0xf9) break; } while(i } return gif; //내부 프로세스, 색상 테이블 생성 function getPalette(pos,s,d,len ) { len*=3; for(var i=pos;i d.push('#' (s[i] (s[i 1] ( s [i 2] return len } //내부 프로세스, 통합 데이터 세그먼트 function getBlock(pos,s,d){ var p=pos while(len=s[p]){ for(var i=0;i d.push(s[pi]); p =len } return p-pos; //내부 프로세스 데이터의 한 프레임 가져오기 function getSingleFrame(pos,frame){ var i=pos if(bytes[i]==0x21){ i =3; bytes[ i]&1) frame.transparentIndex=bytes[i 3] frame.delay=bytes[i 1]|(bytes[i 2] for( i = 5;i if(i==bytes.length){ alert("오류: 이미지 식별자를 찾을 수 없음"); 0 반환 } } frame.offsetX=bytes[i 1]|(bytes[i 2] frame.offsetY=bytes[i 3]| (bytes[i 4] frame.width=bytes[i 5]|(bytes[i 6] frame.height=bytes[i 7) ]|(bytes[i 8] var f=bytes[i 9] i =10; if(f&0x40) frame.interlace=true; if(f&0x20) frame.sorted=true; if(f&0x80){ frame.colorResolution=(f&0x7) 1 frame.localPalette=[] ; =getPalette(i,bytes,frame.localPalette,1 } else{ frame.colorResolution=gif.colorResolution frame.localPalette=gif.globalPalette; ; } var lzwLen=bytes[i ] 1; i =getBlock(i,bytes,frame.data) frame.data=decodeLzw(frame.data,lzwLen); 🎜>returnframe.data?i-pos:0; } //GIF 파일 저장을 위한 데이터 구조 정의 //showInfo 메소드 제공 및 이미지 정보 반환 function GIF ( ){ this.version=""; //버전 번호 this.width=0; //논리적 화면 너비 this.height=0; //논리적 화면 높이 colorResolution =0; //색상 깊이 this.sorted=false; //전역 색상 테이블 분류 플래그 this.globalPalette=null; //전역 색상 테이블 this.BackgroundIndex=-1; 배경색 인덱스 this.pixelAspectRadio=0; //픽셀 종횡비 this.frames=[]; //이미지의 각 프레임은 GIF_Frame을 참조하세요. this.showInfo=function(sep){ //이미지 정보 표시, sep는 줄 구분 기호입니다. if(!sep) sep="n" var s="Gif infomation:" sep "--------- --- -------"; s =subInfo(this) sep; for(var i=0;i s =sep " 프레임 " i "----------" subInfo(this.frames[i]); return s; function subInfo(o){ var s=""; for (var i in o){ if(i=="showInfo"||i=="draw") continue; s =sep i ":" if (typeof( o[i])=="객체") s =(o[i]?o[i].length:"null") else s =o[i] ; } return s; } } } //이미지 프레임을 저장할 데이터 구조 정의 //그리기, 그리기 함수 메서드 제공 GIF_Frame (){ this.offsetX=0; //X방향 오프셋 this.offsetY=0; //Y방향 오프셋 this.width=0; this.height=0; //이미지 높이 this.localPalette=null; //로컬 색상 테이블 this.colorResolution=0; //색상 깊이 this.interlace=false; this.sorted=false; //로컬 색상 테이블 분류 플래그 this.data=[]; //각 픽셀 색상의 정수 인덱스를 저장하는 이미지 데이터 this.transparentIndex=-1 ; /투명 색상 인덱스 this.delay=0; //프레임 지연 this.draw=function(parent,zoom){ if(!this.data.length) return ; >if(!parent) parent=document.body; if(!zoom) zoom=1 if(parent.clientWidth parent. style.width=this.width*zoom; if(parent.clientHeight parent.style.height=this.height*zoom; var id=" ImgDefaultDraw"; var img=document.getElementById(id); if(img) delete parent.removeChild(img); img=document.createElement("DIV"); id=id( parent.appendChild(img); img.style.position="absolute"; var t=document.createElement("DIV") t. ="숨겨짐"; t.style.position="absolute"; defLayout(this.data,this.localPalette,this.width,this.height,img,t,zoom); t; } } } //Base64 디코딩 //strIn, 입력 문자열 //배열을 성공적으로 반환합니다. 각 요소에는 1바이트의 정보가 포함됩니다. // 실패 시 null을 반환합니다. function decodeBase64(strIn){ if(!strIn.length||strIn.length%4) return null; var str64 = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789 /="; var index64=[]; for(var i=0;i index64[str64.charAt(i)]= i; >var c0,c1,c2,c3,b0,b1,b2; var len=strIn.length; var len1=len if(strIn.charAt(len-1 )==' =') len1-=4; var result=[]; for(var i=0,j=0;i c0=index64[ strIn.charAt(i)]; c1=index64[strIn.charAt(i 1)]; c2=index64[strIn.charAt(i 2)] c3=index64 (i 3)]; b0=(c0 >4) b1=(c1 >2 ); >b2=(c2 result.push(b0&0xff); result.push(b1&0xff) result.push(b2&0xff) if(len1!=len){ c0=index64[strIn.charAt(i)]; c1=index64[strIn.charAt(i 1)] c2=strIn.charIn ); b0=(c0 >4) result.push(b0&0xff) if(c2!='='){ c2 =index64[c2]; b1=(c1 >2) result.push(b1&0xff) } } 결과 반환 ; } //GIF용 LZW 디코딩 함수 //arrBytes는 소스 데이터이고, nBits는 비트의 초기 인코딩 수입니다. //성공적으로 배열을 반환하며, 각 요소에는 다음이 포함됩니다. 색상 인덱스 // 실패 시 null을 반환합니다. function decodeLzw(arrBytes,nBits){ var cc=1 var eoi=cc 1; >var table=[],mask=[],result=[]; for(var i=0;i table[i]=(i>>8&0xf) .toString (16) (i>>4&0xf).toString(16) (i&0xf).toString(16) for(i=2,mask[1]=1;imask[i]=mask[i-1] var bc=nBits var pos=0,temp=0,tleft=0,code=0 ,old =0; while(true){ while(tleft temp=temp|(arrBytes[pos ] tleft =8; } code=temp&mask[bc]; temp>>=bc; if(code==eoi) if(코드 ==cc){ table.length=cc 2; old=code 계속; if(code t=table[code]; if(old!=cc) table.push(table[old] t.slice(0,3) ); } else if(old t=table[old] 테이블[old].slice(0,3) table.push(t); >} else{ alert("오류: 잘못된 이미지 데이터"); return null; } old=code for(var i=0; i result.push(parseInt(t.substr(i,3),16)) if(table.length==1 bc ; } return result; } //바이트 배열 데이터 레이아웃에 따라 최소한의 div로 그림을 완성합니다. function defLayout(data,palette ,width ,height,image,block,zoom){ var map=new Array(height) for(var i=0;i map[i]=new 배열(너비); for(var j=0;j map[i][j]=data[i*width j]; } var i, j, i1,i2,j1,j2,c; for(i=0;i for(j=0;j if(map[i ][ j]==0x100){ j ; 계속 } c=map[i][j] for(i1=i 1;i1 for(j1=j 1;j1 for(i2=i;i2 if(i2 휴식 } for(i2=i;i2 for(j2=j;j2 map[i2][j2]=0x100; var x=block.cloneNode(true); x.style.left=j*zoom; x.style.top=i*zoom; x.style.width=(j1-j)*확대/축소; x.style.height=(i1-i)*확대/축소; x.style.BackgroundColor=팔레트[c]; image.appendChild(x); j=j1; } } function main(){ var t=new Date().getTime(); var xmldom=document.getElementById("imgData"); var gif=getGif("R0lGODlhDwAPAKECAAAAzMzM/////wAAACwAAAAADwAPAAACIISPeQHsrZ5ModrLlN48CXF8m2iQ3YmmKqVlRtW4MLwWACH H09wdGltaXplZCBieSBVbGVhZCBTbWFydFNhdmVyIQAAO w=="); var info=document.getElementById("info"); info.innerHTML=gif.showInfo(" "); t=new Date().getTime(); gif.frames[0].draw(document.getElementById("canvas"),1); info.innerHTML =" 绘图耗时" (new Date().getTime()-t) "ms"; } 页side载入中，请稍候...