<!-- 附件上傳 -->
<el-form-item label="上傳圖片" ref="uploadElement">
    <el-upload
        class="upload-demo"
        action="/api/file/uploadFile"
        :limit="5"
        :on-success="uploadFileSuccess" 
    >
        <el-button type="primary">添加附件</el-button>
        <template #tip>
            <div class="el-upload__tip">
                pdf, md, word格式均可
            </div>
        </template>
    </el-upload>
</el-form-item>

// 上傳文件返回函數(shù)，為了得到后端返回的下載url，保存到數(shù)據(jù)庫中
uploadFileSuccess(response, file, fileList) {
    let filePath = response.data;
    // 上傳文件成功后的response參數(shù)已經(jīng)是返回報(bào)文中的data部分，不需要使用response.data.data
    alert(response.data);
    // 回調(diào)函數(shù)中的this指針就是當(dāng)前頁面vue對象
    this.attachForm.downloadUrl = filePath;
}

@PostMapping("/uploadFile")
public String uploadFile(@RequestParam("file") MultipartFile file, HttpServletRequest request) throws IllegalStateException, IOException{

    // TODO： 文件保存文件夾，后期可以換成配置文件中的內(nèi)容
    String path = "D:\\uploadfiles";
    String result = "";
    // 調(diào)用fileService保存文件
    result = fileService.storeFile(file, path);
    logger.info("文件已保存至" + result);
    return result;
}

/**
* 存儲文件到系統(tǒng)
 *
 * @param file 文件
 * @path 保存路徑
 * @return 文件名
 * @throws IOException
 * @throws IllegalStateException
 */
@Override
public String storeFile(MultipartFile file, String path) throws IllegalStateException, IOException {
    // 獲取原始文件名
    String fileName = file.getOriginalFilename();
    // // 獲取文件后綴
    // String suffixName = fileName.contains(".") ? fileName.substring(fileName.lastIndexOf(".")) : null;
    // //文件的保存重新按照時(shí)間戳命名
    // String newFileName = System.currentTimeMillis() + suffixName;
    // 最終保存的文件
    File filePath = new File(path + File.separator + fileName);
    // 判斷文件夾是否存在
    if (!filePath.getParentFile().exists()) {
        filePath.getParentFile().mkdirs();
    }
    // 保存文件
    file.transferTo(filePath);
    // 如果成功，會返回文件的絕對路徑，方便下載
    logger.info("文件已保存至" +filePath.toString());
    return filePath.toString();
}

@RequestMapping("/downloadFile")
public void downloadFiles(@RequestParam("file") String downUrl, HttpServletRequest request, HttpServletResponse response){
  OutputStream outputStream=null;
  InputStream inputStream=null;
  BufferedInputStream bufferedInputStream=null;
  byte[] bytes=new byte[1024];
  File file = new File(downUrl);
  String fileName = file.getName();
  logger.info("本次下載的文件為" + downUrl);
  // 獲取輸出流
  try {
      // StandardCharsets.ISO_8859_1 *=UTF-8'
      // response.setHeader("Content-Disposition", "attachment;filename=" +  new String(fileName.getBytes(StandardCharsets.UTF_8), StandardCharsets.ISO_8859_1));
      response.setHeader("Content-Disposition", "attachment;filename=" +  URLEncoder.encode(fileName, "UTF-8"));
      // 以流的形式返回文件
      response.setContentType("application/octet-stream;charset=utf-8");
      inputStream = new FileInputStream(file);
      bufferedInputStream = new BufferedInputStream(inputStream);
      outputStream = response.getOutputStream();
      int i = bufferedInputStream.read(bytes);
      while (i!=-1){
          outputStream.write(bytes,0,i);
          i = bufferedInputStream.read(bytes);
      }
  } catch (IOException e) {
      e.printStackTrace();
  }finally {
      try {
          if (inputStream!=null){
              inputStream.close();
          }
          if (outputStream!=null){
              outputStream.close();
          }
          if (bufferedInputStream!=null){
              bufferedInputStream.close();
          }
      } catch (IOException e) {
          e.printStackTrace();
      }

  }

downloadAttach(url) {
    let _this = this;
    // 發(fā)送get請求
    this.$axios
    .get('/api/file/downloadFile', {
        params: {
            // 向后端傳入下載路徑
            file: url,
        }
    })
    .then(res => {
        // alert("請求成功");
        console.log(res.data); // 獲取服務(wù)端提供的數(shù)據(jù)
        let blob = new Blob([res.data])
        let contentDisposition = res.headers['content-disposition']
        let pattern = new RegExp('filename=([^;]+\\.[^\\.;]+);*')
        let result = pattern.exec(contentDisposition)
        // 使用decodeURI對名字進(jìn)行解碼
        let fileName = decodeURI(result[1])
        let downloadElement = document.createElement('a')
        // 創(chuàng)建下載的鏈接
        let href = window.URL.createObjectURL(blob)
        downloadElement.style.display = 'none'
        downloadElement.href = href
        // 下載后文件名
        downloadElement.download = fileName
        document.body.appendChild(downloadElement)
        // 點(diǎn)擊下載
        downloadElement.click()
        // 下載完成移除元素
        document.body.removeChild(downloadElement)
        // 釋放掉blob對象
        window.URL.revokeObjectURL(href)
    })
    .catch(() => {
        alert("請求出錯");
    })
    // alert(url);
}