まず、ノードXLSXの使用は、KOA-multerプラグNPMがインストールノードXLSX KOA-multer mockjs --save
二つは、ファイルのエクスポートをエクセル
図1に示すように、要求されたデータのフロントエンドは、ブロブによってダウンロードに対応するデータファイルを解析する(BLOBコンテナのストレージオブジェクトは、バイナリデータとして見ることができます)
1 exportExcel(E){ 2 axios({ 3 の方法は、 "get"、 4 URL: "/ API / exportexcel"、 5 responseType: 'ブロブ' 6 })。次に、(非同期(RES)=> { 7は = uploadExcelせ(filename)で=> { 8 CONSTブロブ=新たなBLOB([RES]、{タイプ: 'アプリケーション/ vnd.openxmlformats-officedocument.spreadsheetml.sheet;のcharset = UTF-8'}); 9 CONSTのURL = URL.createObjectURL( BLOB); 10 CONST ALINK =のdocument.createElement( 'A'); 11 aLink.setAttribute( 'ダウンロード'は、ファイル名); 12 aLink.setAttribute(」 href」、URL);13 document.body.appendChild(ALINK) 14 aLink.click() 15 document.body.removeChild(ALINK) 16 URL.revokeObjectURL(BLOB)。 17 } 18 uploadExcel( 'mySheetName.xlsx')。 19 }) 20 }
図2に示すように、ノードXLSX処理によって後端とストリームバッファデータを返します
1 CONST = NXlSX( "ノードXLSX"必要); 2 CONST =ザは、( "mockjs"必要モック) 。3 router.get( '/ API / exportexcel'、非同期(CTX)=> { 4。 // ヘッダ 5。 CONST _headers = [ '数'、 '名前'、 '年齢'、 '地方'、 "都市"、 "ゾーン" ]; 6個の // 表形式のデータを 7 constの_data = [... Mock.mock({「ARR | 30 -30 " :[{ 8。 " ID | + +1しました":1 、 9 名:" @cname " 10 "年齢| 18-34 ":23である、 11。 "州":"@province」 、 12 "都市": "@city" 、 13 "郡": "@county" 14 。}]})ARR]。 15は =データを聞かせて[]。 16 のために(せ i = 0; I <_data.length; iは++ ){ 17 LETのARR = []; 18 のために(せキーで{[I] _data) 19 arr.push(_data [I] [キー]) 20 } 21 data.push(ARR)。 22 } 23 data.unshift(_headers)。 24 // 数据格式为[[ "こんにちは"、 "223"]、[ "22"、 "23"]。 25 LET= NXlSX.build緩衝液([{名: "SHEETNAME" 、データ:データ}]); 26である // 戻り流遠位バッファ 27 = ctx.body バッファ 28 });
三つは、ファイルのインポートエクセル、返された後部先端を解析します
1、入力[ファイル]ファイルの後端部を通過することにより、フロントエンド
1 importExcel(E){ 3 LETファイル= e.currentTarget.files [0 ]。 4 FILEDIRは=せfile.name。 5 FORMDATAは=ましょう新しい)いるFormData(; 6 formData.append( 'ファイル' 、ファイル)。 7 せコンフィグ= { 8つの ヘッダー:{ 9 'のContent-Type': 'マルチパート/フォームデータ' 10 } 11 } 12 axios.post( "/ API / importexcel"、FORMDATA、コンフィグ).then((RES)= > { 13 にconsole.log(RES); 14 // 处理数据 15 16 }) 17 }
次に2、バックエンド・ストレージ・ファイル、プロセスデータ、およびファイルを削除
。1のconst = multerインクルードが( 'KOA-multer'を必要と); 2のconst = NXlSX( "ノードXLSX"が必要です); 3。 LET =ストレージmulter.diskStorage({ 4。 // ファイルパス 5。 あなたがしたいですか:機能(REQ、ファイル、 CB){ 6 CB(NULL、 './server/data' ) 。7 }、 8 //は、ファイル名を変更 9。 ファイル名:関数(REQ、ファイル、CB){ 10 のvar FILEFORMAT =(file.originalname).split( " 。 " ); 11 CB(NULL、Date.now()+ "" + FILEFORMAT [fileFormat.length - 1 ])。 12 } 13 }) 14 // 加载配置 15 LETアップロード= multer({ストレージ:ストレージ}) 16 router.post( '/ API / importexcel'、upload.single( 'ファイル')、非同期(CTX)=> { 17 LETファイル= ctx.req.file.filename; 18 CONST xlsxfile = "./server/data/" + ファイル; 19 非同期関数readExcel(){ 20 リターン 新しいプロミス((決意、リジェクト)=> { 21 のlet OBJ = NXlSX.parse(xlsxfile); 22 (OBJ)を解決。 23 }); 24 } 25 非同期関数のgetData(V){ 26 ctx.body = V [0 ] .DATA。 27 fs.unlinkSync(xlsxfile)。 28 } 29は dataObjは=せ)(readExcelを待ちます。 30 のgetData(dataObj)を待ちます。 31 });