2017-04-17 19 views
3

私はReactjsでSpring RESTエンドポイントを呼び出すことでExcelファイルをダウンロードしようとしていますが、破損したファイルに関する問題が発生しています。React excel file download corrupt

は、私は上記のコードを実行すると呼んで...

getFile(){ 
    axios.get('get/download') 
     .then((response) => { 
      var blob = new Blob([response.data], {type:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'}); 
      filesaver.saveAs(blob, "excel.xlsx"); 
     }); 
} 

春コントローラ....

@RequestMapping(value = "/download", method = RequestMethod.GET) 
    public void downloadExcelFile(final HttpServletResponse response) throws IOException { 
     response.setHeader("Content-Encoding", "UTF-8"); 
     response.setHeader("Content-Disposition", "attachment; filename="file.xlsx"); 
     response.setContentType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"); 

     final File xls = service.createExcelFile(response); 

     final FileInputStream in = new FileInputStream(xls); 
     final OutputStream out = response.getOutputStream(); 

     final byte[] buffer = new byte[8192]; 
     int length; 

     while ((length = in.read(buffer)) > 0) { 
      out.write(buffer, 0, length); 
     } 
     in.close(); 
     out.close(); 
    } 

サービス...

public File createExcelFile(final HttpServletResponse response) { 
    XSSFWorkbook xssfWorkbook = null; 
    final File xls = new File("excel.xlsx"); 
     try { 
      final FileOutputStream fos = new FileOutputStream(xls); 

      xssfWorkbook = new XSSFWorkbook(); 
      //setup excel file... 
      xssfWorkbook.write(fos); 
      xssfWorkbook.close(); 
     } 
     catch (final Exception e) { 
      LOGGER.error(String.format("Something went wrong")); 
     } 
    return xls; 
} 

私はExcelを取得リアクトokですが、response.dataを見てみましょう...

"PKs��J_rels/.rels���j�0��}↵�{㴃1F�^Ơ�2��l%1I,c�[� 

ファイルを開こうとしています...読み込めないデータが原因でファイルを開くことができませんでした。ファイルがサーバー上に作成開くと任意のアイデアが

乾杯を歓迎

okです

あなただけaxios要求に応答タイプを追加する必要があり
+0

「新しいBlob([レスポンス]、「?符号化されたデータが「データ」フィールドにある) –

+0

同様の問題を抱えている。この上に何か運がありますか? –

答えて

2

:機能のダウンロード以下の私のアプリケーションで

responseType: 'arraybuffer' 

ファイルをExcel:

function exportIssues() { 
    axios.get('/issues/export', { responseType: 'arraybuffer' }) 
    .then((response) => { 
     var blob = new Blob([response.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }); 
     fileSaver.saveAs(blob, 'fixi.xlsx'); 
    }); 
}