springboot+vue+axios 로컬 파일 (txt excel) 다운로드 실현

백엔드


설명: 저는 로컬 파일을 읽고 전방에서 파일 이름을 전송한 다음에 후방을 통해 파일을 전방으로 전송하고 전방 페이지에서'다운로드'단추를 누르면 다운로드 기능을 실현합니다.본고는 주로 자바가 txt 텍스트를 다운로드하는 것을 다루는데 excel 코드는 기본적으로 차이가 많지 않다. 인터넷에서 많은 다운로드 excel은 모두 백엔드 코드에 표두를 쓴다. 나는 직접 만든 excel 표를 전단에 전달하고 다운로드할 수 있다.
java는 excel 표와 txt 텍스트를 다운로드합니다. 백엔드는 기본적으로 같습니다.앞부분에 약간의 차이가 있습니다. 아래에 표시됩니다.
@GetMapping("/download/{fileName}") public void download(@PathVariable(“fileName”) String fileName, HttpServletRequest request, HttpServletResponse resp) throws IOException { FileInputStream fis = null; try { String filePath =“C:/servicelogs/”+fileName; fis = new FileInputStream(filePath); resp.setContentType(“application/vnd.ms-excel;charset=UTF-8”); resp.setCharacterEncoding(“UTF-8”); resp.setHeader(“Content-Disposition”, “attachment;filename=” + java.net.URLEncoder.encode(fileName, “UTF-8”)); byte[] b = new byte[100]; int len; while ((len = fis.read(b)) > 0) { resp.getOutputStream().write(b, 0, len); } } catch(Exception e) {logger.error ("파일 [{}] 다운로드 오류", fileName);}finally { resp.getOutputStream().flush(); resp.getOutputStream().close(); fis.close(); } }

프런트 엔드


앞부분은 vue elementui를 사용합니다.
downloadLog(index,row) {let filename=row.fileName;this.$axios({method:'get','url:'/onlinecar/log/download/'+filename,headers:{'Authentication':store.state.account.token},responseType:'blob','//수신 형식 설정, 그렇지 않으면 문자형 데이터:this.qs.stringify({fileName:filename,})})를 반환합니다.then((res)=>{ let data=res.data; if (!data){ return; } const blob=new Blob([data])
//아래에 설명된 이 코드는 excel 표를 다운로드할 때 추가할 것입니다. 다른 excel txt는 같은//const blob=New Blob([data], {//type:'application/vnd.ms-excel'/type:'application/vnd.ms-excel'이라는 코드는 excel 표를 다운로드하는 데 필요합니다. txt 파일을 다운로드할 때//이 문장이 필요하지 않습니다. 이것은 txt 파일을 다운로드하는 전단과 유일한 차이점입니다.
      if (window.navigator.msSaveOrOpenBlob){ //  IE10
        navigator.msSaveBlob(blob,filename);
      }else { //  IE H5 
        let url = window.URL.createObjectURL(blob);
        let link = document.createElement('a');
        link.style.display = 'none';
        link.href = url;
        link.setAttribute('download', filename);
        document.body.appendChild(link);
        link.click()
      }
      
    }).catch((error)=>{
      this.$message.error(error);
    })
  },

이렇게 하면 돼, 댓글도 모르고 물어봐.

좋은 웹페이지 즐겨찾기