2017-04-17 279 views
3

我試圖通過調用Spring REST端點來下載Reactjs中的Excel文件,但我遇到了損壞文件的問題。React excel文件下載損壞

陣營稱...

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..but看在response.data看起來像...

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

打開文件我得到...由於數據不可讀,無法打開文件。打開該文件在服務器上創建是確定

任何想法表示歡迎

乾杯

+0

'new blob([response],'?(我不確定w所編碼的數據在「數據」字段中) –

+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'); 
    }); 
}