最新国产好看的视频,伊人天堂AV在线,国产Aaaaaa视频,蜜臀视频在线观看一区,人妻av色图,密臀久久久精品影片,青青视频免费观看毛片,久草在线观看视,国产三级精品色情在线

Vue通過阿里云oss的url連接直接下載文件并修改文件名的方法

 更新時間:2020年12月25日 11:05:30   作者:小白艱辛路  
這篇文章主要介紹了Vue通過阿里云oss的url連接直接下載文件并修改文件名的方法,本文給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下

我測試過很多遍,想要通過a標(biāo)簽的形式來直接點擊url下載文件并重命名但是都失敗了,最終只能下載卻不能重命名 所以 換了java后臺來修改名字.以下代碼

應(yīng)用

我做的網(wǎng)頁是點擊文件直接下載

在這里插入圖片描述

直接下載下來了,一開始的文件名是上傳到oss時以id命名的名字,現(xiàn)在下載的時候想改名,遇到了問題,所以寫了這篇博客

首先是后臺代碼

接口

/**
  * 附件下載
  * <p>
  *
  * @param param
  * @return ResponseDTO
  */
 @PostMapping(value = "/download")
 public void downloadFile(@RequestParam Map<String, Object> param, HttpServletResponse response) throws Exception {
  String url1 = param.get("url").toString();
  URL url = new URL(url1);
  URLConnection conn = url.openConnection();
  InputStream inputStream = conn.getInputStream();
  response.reset();
  response.setContentType(conn.getContentType());
   //純下載方式 文件名應(yīng)該編碼成UTF-8
  response.setHeader("Content-Disposition",
    "attachment; filename=" + URLEncoder.encode(param.get("name").toString(), "UTF-8"));
  byte[] buffer = new byte[1024];
  int len;
  OutputStream outputStream = response.getOutputStream();
  while ((len = inputStream.read(buffer)) > 0) {
   outputStream.write(buffer, 0, len);
  }
  inputStream.close();
 }

代碼里面的 url 需要事先 去阿里云獲取,我因為前端上傳的時候 獲取到了url就直接傳到后臺用了.

前端vue代碼

前端

//下載和預(yù)覽
  handlePreview(file) {
  if (file.type == 'png' || file.type == 'jpg') {
   this.imageUrl = file.url;
   this.imageDetail = true;
  } else {
   var form = document.createElement("form");
   document.body.appendChild(form);
   form.method = "post";
   form.appendChild(this.generateHideElement('url',file.url));
   form.appendChild(this.generateHideElement('name',file.name));
   form.action = "接口地址"http:// 路由地址+接口地址
   form.submit();
  }
  },
  generateHideElement(name, value) {
  var tempInput = document.createElement("input");
  tempInput.type = "hidden";
  tempInput.name = name;
  tempInput.value = value;
  return tempInput;
  },

好了這就完了,很簡單的一段代碼, 我也是剛學(xué)vue歡迎大佬指點

到此這篇關(guān)于Vue通過阿里云oss的url連接直接下載文件并修改文件名的方法的文章就介紹到這了,更多相關(guān)vue 阿里云oss下載文件內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

  • 利用nodeJS+vue圖片上傳實現(xiàn)更新頭像的過程

    利用nodeJS+vue圖片上傳實現(xiàn)更新頭像的過程

    Vue是一套構(gòu)建用戶界面的框架,最近工作中遇到了一個需求,需要做一個更新頭像的通能,下面這篇文章主要給大家介紹了關(guān)于利用nodeJS+vue圖片上傳的相關(guān)資料,需要的朋友可以參考下
    2022-04-04
  • vuex?mutation?action同級調(diào)用方式

    vuex?mutation?action同級調(diào)用方式

    這篇文章主要介紹了vuex?mutation?action同級調(diào)用方式,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教
    2022-03-03
  • SpringBoot+Vue3實現(xiàn)文件的上傳和下載功能

    SpringBoot+Vue3實現(xiàn)文件的上傳和下載功能

    上傳文件和下載文件是我們平時經(jīng)常用到的功能,接下來就讓我們用SpringBoot,Vue3和ElementPlus組件實現(xiàn)文件的上傳和下載功能吧,感興趣的朋友跟隨小編一起看看吧
    2023-01-01
  • vue使用driver.js完成頁面引導(dǎo)功能的示例詳解

    vue使用driver.js完成頁面引導(dǎo)功能的示例詳解

    在Vue中,driver.js通常是指用于實現(xiàn)用戶引導(dǎo)和教程功能的JavaScript庫,它可以幫助開發(fā)者在應(yīng)用程序中創(chuàng)建交互式的引導(dǎo)和教程,以引導(dǎo)用戶了解應(yīng)用程序的不同功能和界面,本文就簡單的給大家介紹一下vue如何使用driver.js完成頁面引導(dǎo)功能
    2023-08-08
  • vue2.5.2使用http請求獲取靜態(tài)json數(shù)據(jù)的實例代碼

    vue2.5.2使用http請求獲取靜態(tài)json數(shù)據(jù)的實例代碼

    這篇文章主要介紹了vue2.5.2使用http請求獲取靜態(tài)json數(shù)據(jù)的實例代碼,需要的朋友可以參考下
    2018-02-02
  • vue中使用window.open()參數(shù)示例詳解

    vue中使用window.open()參數(shù)示例詳解

    這篇文章主要介紹了vue中使用window.open()參數(shù)詳解,本文通過示例代碼給大家介紹的非常詳細,對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2023-04-04
  • vue3升級常見問題詳細匯總

    vue3升級常見問題詳細匯總

    隨著vue3?的發(fā)布和越來越多項目的使用,之前使用?vue2?的項目也不能拉下,vue2?升級?vue3?迫在眉睫,下面這篇文章主要給大家介紹了關(guān)于vue3升級常見問題的相關(guān)資料,需要的朋友可以參考下
    2023-03-03
  • 如何在 Vue.js 中使用第三方j(luò)s庫

    如何在 Vue.js 中使用第三方j(luò)s庫

    本篇文章主要介紹了如何在 Vue.js 中使用第三方j(luò)s庫,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-04-04
  • Vue3-新特性defineOptions和defineModel示例詳解

    Vue3-新特性defineOptions和defineModel示例詳解

    在Vue3.3中新引入了defineOptions宏主要是用來定義Option API的選項,可以用defineOptions定義任意的選項,props、emits、expose、slots除外,本文給大家介紹Vue3-新特性defineOptions和defineModel,感興趣的朋友一起看看吧
    2023-11-11
  • vue插件開發(fā)之使用pdf.js實現(xiàn)手機端在線預(yù)覽pdf文檔的方法

    vue插件開發(fā)之使用pdf.js實現(xiàn)手機端在線預(yù)覽pdf文檔的方法

    這篇文章主要介紹了vue插件開發(fā)之使用pdf.js實現(xiàn)手機端在線預(yù)覽pdf文檔的方法,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2018-07-07

最新評論

木兰县| 铜陵市| 永兴县| 铜梁县| 大兴区| 贺州市| 绍兴县| 南江县| 垫江县| 临武县| 城固县| 柳江县| 正阳县| 长宁县| 新乡县| 平泉县| 绥化市| 方正县| 合作市| 南宁市| 措美县| 太康县| 上犹县| 长阳| 龙井市| 钟祥市| 赤壁市| 大名县| 犍为县| 娱乐| 永寿县| 嫩江县| 张家界市| 湟源县| 江阴市| 宾阳县| 隆子县| 洪洞县| 德阳市| 岑巩县| 金门县|