複数のオンラインチュートリアルと自分で取得した方法を組み合わせて、現在Google、IE11、およびIE10と互換性があります。
HTMLBodyのコンテンツについて特別なものはありません。
<div id = "dconfirm"> <p style = "float:left; margin-left:20px; margin-top:20px"> <form action = "javascript:uploadandsubmit();" name = "demoform" id = "demoform" method = "post" enctype = "multipart/form-data"> <p> upload file:<入力タイプ= "file" name "name" name "file" file "id =" str_file "/> </p> <p> <inputタイプ=" submit "value =" upload "/>
バイナリファイルを読む:
function uploadandsubmit(){filename = document.getElementbyId( "str_file")。val forms ["demoform"]; if(filename!= ""){try {var obj = new activexobject( "adodb.stream"); filereader(); reader.readasbinarystring(file); //これは非同期reader.onloadend = function(){// readが終了した後、if(reader.error){console.log(reader.error);} else {uploadandsubmit2(reader.urult2);} return} binaryfile(filename); //この読み取り値は同期されていますuploadandsubmit2(bf1.readall());}}}ここでは、ブラウザタイプについて判断する必要があります。 IEでない場合は、Filreaderを読むために使用し、IEである場合は、読み取りにActiveXコントロールを使用します。ここにピットがあります。 IE11とIE10はFileReader Objectメソッドをサポートしていませんが、IE11とIE10の「Typeof FileReader」は「未定義」ではなく、Filereaderをサポートするかどうかによってブラウザを直接区別することは困難です。また、FileReaderメソッドはファイルを非同期に読み取ることであり、ActiveXはファイルを同期して読み取ることであることにも注意する必要があります。これらの2つのルートが1つの方法でどのようにカプセル化されているかを理解したことはありません。あなたに良い解決策があるのだろうか。
その中で、BinaryFileオブジェクトの構築方法は、http://www.codeproject.com/articles/17825/reading-and-writing-writing-binary-files-using-jscript?msg=3718403#xx3718403xxテクノロジーブログから抜粋しています。ブログの返信には改善方法があります。それはより効率的であると言われていますが、私はそれを理解していなかったので、私は元の方法を選びました。
元の方法は長いです:
// adodb.streamコントロールを使用する場合、ISO-8859-1とWindows-1252文字セット機能バイナリファイル(name){var adtypebinary = 1var adtypetext = 2var adsavecreateoverwrite = 2 // The Trick-old fortined 'not lavest Javascript of the lavest javascript of the lavest javascript of the lavest-javascriptの使用に注意してください。 codepage = '437'; this.path = name; var forward = new array(); var backward = new array(); // note-より良いパフォーマンスのために、これらのhex //定義をある時点でdecimalに事前に転換する必要があります - ) - ajtforward ['80 '] =' 00c7 '; forward ['81'] = '00fc'; '00e2'; forward ['84 '] =' 00e4 '; forward ['85'] = '00e0'; forward ['86 '] =' 00e5 '; forward ['87'] = '00e7'; forward ['88 '] =' 00ea '; forward ['89'] = '00eb'; = '00ef'; forward ['8c'] = '00ee'; forward ['8d'] = '00ec'; forward ['8e'] = '00c4'; forward ['8f'] = '00c5'; forward ['90 '] =' 00c9 '; forward ['91'] = '00e6' 00e6 '00f4'; wordward ['94 '] =' 00f6 '; forward ['95'] = '00f2'; forward ['96 '] =' 00fb '; forward ['97'] = '00F9'; forward ['98 '] =' 00ff '; forward ['99'] = '00d6'; forward '; = '00a2'; forward ['9c'] = '00a3'; forward ['9d'] = '00a5'; forward ['9e'] = '20a7'; forward ['9f'] = '0192'; forward ['a0'] = '00e1'; forward ['a1' = '00ed'; = '00fa'; forward ['a4'] = '00f1'; forward ['a5'] = '00d1'; forward ['a6'] = '00aa'; forward ['a7'] = '00ba'; forward ['a8'] = '00bf'; forward ['a9'] = '2310'; forward ['00ac'; '00bd'; forward ['ac'] = '00bc'; forward ['ad'] = '00a1'; forward ['ae'] = '00ab'; forward ['af'] = '00bb'; forward ['b0'] = '2591'; forward ['b1'] = '2592' = 'b2'] = '2593'; '2502'; forward ['b4'] = '2524'; forward ['b5'] = '2561'; forward ['b6'] = '2562'; forward ['b7'] = '2556'; forward ['b8'] = '2555'; forward ['b9'] = '2563'; '2557'; forward ['bc'] = '255d'; forward ['bd'] = '255c'; forward ['be'] = '255b'; forward ['bf'] = '2510'; forward ['c0'] = '2514'; forward ['c1'] = '2534'; forward ['c2'] = '252c'; '251c'; forward ['c4'] = '2500'; forward ['c5'] = '253c'; forward ['c6'] = '255e'; forward ['c7'] = '255f'; forward ['c8'] = '255a'; forward ['c9'] = 'cb' '2566'; forward ['cc'] = '2560'; forward ['cd'] = '2550'; forward ['ce'] = '256c'; forward ['cf'] = '2567'; forward ['d0'] = '2568'; forward ['d1'] = '2564'; forward ['d2' = '2565'; forward ['d3'] = 'd2'; '2559'; forward ['d4'] = '2558'; forward ['d5'] = '2552'; forward ['d6'] = '2553'; forward ['d7'] = '256b'; forward ['d8'] = '256a';フォワード['d9'] = '2518'; '2588'; forward ['dc'] = '2584'; forward ['dd'] = '258c'; forward ['de'] = '2590'; forward ['df'] = '2580'; forward ['e0'] = '03b1'; forward ['e1'] = '00df'; forward ['e2'] = '0393'; '03c0'; forward ['e4'] = '03a3'; forward ['e5'] = '03c3'; forward ['e6'] = '00b5'; forward ['e7'] = '03c4'; forward ['e8'] = '03a6'; forward ['=' " '03b4'; forward ['ec'] = '221e'; forward ['ed'] = '03c6'; forward ['ee'] = '03b5'; forward ['ef'] = '2229'; forward ['f0'] = '2261'; forward ['f1'] = '00b1' '2264'; forward ['f4'] = '2320'; forward ['f5'] = '2321'; forward ['f6'] = '00f7'; forward ['f7'] = '2248'; forward ['f8'] = '00b0'; forward ['f9'] = '2219'; '221a'; forward ['fc'] = '207f'; forward ['fd'] = '00b2'; forward ['fe'] = '25a0'; forward ['ff'] = '00a0'; backward ['c7'] = '80'; backward ['fc'] = '=' = 'e9'] = '82'; '83'; backward ['e4'] = '84'; backward ['e0'] = '85'; backward ['e5'] = '86'; backward ['e7'] = '87'; backward ['ea'] = '88'; backward ['eb'] = '89';後方['e8'] = '8a'; '8b'; backward ['ee'] = '8c'; backward ['ec'] = '8d'; backward ['c4'] = '8e'; backward ['c5'] = '8f'; backward ['c9'] = '90'; backward ['e6'] = '91';後方['c6' = '92'; '93'; backward ['f6'] = '94'; backward ['f2'] = '95'; backward ['fb'] = '96'; backward ['f9'] = '97'; backward ['ff'] = '98'; backward ['d6'] = '=' = 'dc'] '、'; '9b'; backward ['a3'] = '9c'; backward ['a5'] = '9d'; backward ['20a7'] = '9e'; backward ['192'] = '9f'; backward ['e1'] = 'a0'; backward ['ed'] = 'a1'; 'a3'; backward ['f1'] = 'a4'; backward ['d1'] = 'a5'; backward ['aa'] = 'a6'; backward ['ba'] = 'a7'; backward ['bf'] = 'a8'; backward ['2310'] = 'a9';後方['AA';後方['AA'; 'ab'; backward ['bc'] = 'ac'; backward ['a1'] = 'ad'; backward ['ab'] = 'ae'; backward ['bb'] = 'af'; back '; b0' '; 'b3'; backward ['2524'] = 'b4'; backward ['2561'] = 'b5'; backward ['2562'] = 'b6'; backward ['2556'] = 'b7';後方['2555'] = 'b8'; backward ['2563' = 'b9'; 'ba'; backward ['2557'] = 'bb'; backward ['255d'] = 'bc'; backward ['255c'] = 'bd'; backward ['255b'] = 'be'; back ['2510'] = 'bf'; backward ['2514'] = 'c0'; 'c2'; backward ['251c'] = 'c3'; backward ['2500'] = 'c4'; backward ['253c'] = 'c5'; backward ['255e'] = 'c6'; backward ['255f'] = 'c7'; backward ['255a'] = 'c8'; = 'ca'; backward ['2566'] = 'cb'; backward ['2560'] = 'cc'; backward ['2550'] = 'cd'; backward ['256c'] = 'ce'; backward ['2567'] = 'cf'; backward ['2568'] = '=' = '=' d1 ' 'd2'; backward ['2559'] = 'd3'; backward ['2558'] = 'd4'; backward ['2552'] = 'd5'; backward ['2553'] = 'd6'; backward ['256b'] = 'd7'; backward ['256a' = 'd8'; 'd9'; backward ['250c'] = 'da'; backward ['2588'] = 'db'; backward ['2584'] = 'dc'; backward ['258c'] = 'dd'; backward ['2590'] = 'de'; backward ['2580'] = 'df'; 'e1'; backward ['393'] = 'e2'; backward ['3c0'] = 'e3'; backward ['3a3'] = 'e4'; backward ['3c3'] = 'e5'; backward ['b5'] = 'e6'; backward ['3c4'] = 'e7'; = 'e9'; backward ['3a9'] = 'ea'; backward ['3b4'] = 'eb'; backward ['221e'] = 'ec'; backward ['3c6'] = 'ed'; backward ['3b5'] = 'ee'; backward ['2229'] = 'ef' = '=' " 'f1'; backward ['2265'] = 'f2'; backward ['2264'] = 'f3'; backward ['2320'] = 'f4'; backward ['2321'] = 'f5'; backward ['f7'] = 'f6'; backward ['2248'] = '=' = '=' 'f9'; backward ['b7'] = 'fa'; backward ['221a'] = 'fb'; backward ['207f'] = 'fc'; backward ['b2'] = 'fd'; backward ['25a0'] = 'fe'; backward ['a0'] = 'ff';関数(d){var h = hd.substr(d&15,1); while(d> 15){d >> = 4; h = hd.substr(d&15,1)+h;} return h wscript.createobject( "adodb.stream"); var binarystream = new ActiveXObject( "adodb.stream"); // spream type- we cheat and what string.type = adtypetext; binarystream.charset = '437'; Streambinarystream.writeText(this.forward437(what)); // diskbinarystream.savetofile(this.path、adsavecreateoverwrite); // clearn upbinarystream.close();} this.readall = function(){// wscript.createObject( "adodb.stream")var binarystream = new ActiveXObject( "adodb.stream"); // spream type -chat and "binarybinarystream.type = adtypetext; binarystream.charset = codepage; ObjectbinaryStream.LoadFromFile(this.Path); //ストリームを開き、ObjectVarからバイナリ「文字列」を取得しますwhat = binarystream.readtext; // clean upbinarystream.close(); return this.backward437(what);}/ *オクテット番号をコードページ437 = code */this.forward437 code(forward437 code(forward437 code)に変換します。 array(); var tmp = ''; var i = 0; var c = 0; var l = instring.length; var cc; var h; for(; i <l; ++ i){c ++; if(c == 128){encarray.push(tmp); tmp = '';} cc = instring.charcodeat(i); if(cc <128){tmp+= string.fromChar code(cc);} else {h = this.d2h(cc); h = forward [''+h]; tmp+= string.fromcharcode(this.h2d(h));}} if(tmp!= ''){encarray.push(tmp);} ////////////このループプログレッシブは//配列要素を連結します。 c = 0; c <l; c+= 2){if(c+1 == l){ar2.push(encarray [c]);} else {ar2.push( ''+encarray [c]+encarray [c+1]);}} encarray = ar2; ar2 = new array();} contray [0];} a chare [0]; Octet number*/this.backward437 = function(instring){var encarray = new Array(); var tmp = ''; var i = 0; var c = 0; var l = instring.length; var cc; var h; for(; i <l; ++ i){c ++; if(c == 128){encarray.push(tmp); tmp = '';} cc = instring.charcodeat(i); if(cc <128){tmp+= string.fromCharc ode(cc);} else {h = this.d2h(cc); h = backward [''+h]; tmp+= string.fromcharcode(this.h2d(h));}} if(tmp!= ''){encarray.push(tmp);} ////////////このループプログレッシブは//配列要素を連結します。 c = 0; c <l; c+= 2){if(c+1 == l){ar2.push(encarray [c]);} else {ar2.push( ''+encarray [c]+encarray [c+1]);}} encarray = ar2; ar2 = new array();} return encarray [0];};主な部分は次のとおりです。
this.readall = function(){//ストリームオブジェクトを作成 - ADO 2.5またはheighter // var binarystream = wscript.createobject( "adodb.stream")var binarystream = new Activexobject( "adodb.stream"); CODEPAGE; // StreambinaryStream.Open(); //ディスクからファイルデータをディスクからストリームにロードすることをObjectBinaryStream.LoadFromFile(This.Path); // ObjectVarからBinaryStream.ReadText; // Clean Clean UpbinaryStream.Close();「adodb.stream」コントロールを使用してファイルを読み取る方法は次のとおりです。著者が使用する読み取りタイプはAdTypetext(2)であることがわかります。ドキュメントをAdTypebinary(1)に変更した後、何も読むことができません。理由はわかりません。
残りのコードは、エンコード変換作業を行っています。一般的に言えば、ファイルを読み取るときは、「ISO-8859-1」文字セットを使用する必要があり、HTTPでファイルを送信するときは、「Windows-1252」文字セットを使用する必要があります。これらの2つの文字セットには数値文字が少ないため、読み取りデータに異なる部分を見つけて、別の文字セット表現に変換します。
Ajaxはバイナリストリームを送信します:
function uploadandsubmit2(binarycontent){url = urlhead + "cook.ashx"; xmlhttp = new xmlhttprequest(); xmlhttp.open( "post"、url + "?method = post&file_upload&filename =" + encodeuricomponent(filename.split( "//")[filename.split( "//")。length-1]) (xmlhttp.status == 200){var str = xmlhttp.response; alert(str); xmlhttp.abort();}}}}}}}バイナリ伝送には、「window.activexobject( "msxm12.xmlhttp") ")および「window.activexobject(" microsoft.xmlhttp ")」はありません。これら2つのActiveXコントロールをサポートするバイナリ伝送方法があるのだろうか。
チュートリアルでは、行6がその前にあります。
xmlhttp.OverridemimeType( 'text // plain; charset = x-user-defined'); //:x-user-definedは、返されたデータを解析しないようブラウザに伝えます
この行を追加した後、ブラウザはバックグラウンドで返されるデータのエンコード形式を解析しません。具体的には、フォアグラウンドに戻された中国のテキストは「」または「ポート」として表示されます。著者はこれを行い、前景のバックエンドから送信されたバイナリデータを受け取ると思います。
実際、Firefoxのxmlhttprequestのみがsendasbinaryメソッドをサポートしています。 IEとGoogleで使用するには、XMLHTTPRequestにプロトタイプメソッドを追加する必要があります。
//Add binary sending function to the prototype of XMLHttpRequest XMLHttpRequest.prototype.sendAsBinary = function(datastr) {function byteValue(x) {return x.charCodeAt(0) & 0xff;}var ords = Array.prototype.map.call(datastr, byteValue);var ui8a = new uint8array(ords); this.send(ui8a.buffer);}ここではコードがよくわかりません。 6行IE8はそれをサポートせず、7行IE9はそれをサポートしていません。
背景はJava Serverletを使用し、以下は最終Javaクラスのコードです。
public string fileupload(httpservletrequest request)throws ioexception {request.setcharacterencoding( "utf-8"); bufferedinputStream filein = new bufferedinputStream(request.getInputStream();文字列fn = request.getParameter( "filename"); byte [] buf = new byte [1024]; file file = new file( "d:/" + fn); bufferedoutputStream fileout = new BufferedOutputStream(new fileoutputStream(file)); try {while(true){// data int int bytesin = filein.read(buf、0、1024); System.out.println(bytesin); if(bytesin == -1){break; } else {fileout.write(buf、0、bytesin); }} fileout.flush(); return( "save succuent");} catch(exception e){return "save failed、beson:"+e.tostring();} fullly {fileout.close(); }}上記は、JavaScriptでバイナリファイルを読み取り、私が紹介したAjaxを使用してバイナリストリームを送信する方法です。それがあなたに役立つことを願っています。ご質問がある場合は、メッセージを残してください。編集者は時間内に返信します。 wulin.comのウェブサイトへのご支援ありがとうございます!