1. <ul id="0c1fb"></ul>

      <noscript id="0c1fb"><video id="0c1fb"></video></noscript>
      <noscript id="0c1fb"><listing id="0c1fb"><thead id="0c1fb"></thead></listing></noscript>

      99热在线精品一区二区三区_国产伦精品一区二区三区女破破_亚洲一区二区三区无码_精品国产欧美日韩另类一区

      RELATEED CONSULTING
      相關咨詢
      選擇下列產(chǎn)品馬上在線溝通
      服務時間:8:30-17:00
      你可能遇到了下面的問題
      關閉右側工具欄

      新聞中心

      這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
      javascript如何使用Blob對象下載文件

      小編這次要給大家分享的是javascript如何使用Blob對象下載文件,文章內(nèi)容豐富,感興趣的小伙伴可以來了解一下,希望大家閱讀完這篇文章之后能夠有所收獲。

      東河網(wǎng)站制作公司哪家好,找成都創(chuàng)新互聯(lián)公司!從網(wǎng)頁設計、網(wǎng)站建設、微信開發(fā)、APP開發(fā)、響應式網(wǎng)站建設等網(wǎng)站項目制作,到程序開發(fā),運營維護。成都創(chuàng)新互聯(lián)公司于2013年創(chuàng)立到現(xiàn)在10年的時間,我們擁有了豐富的建站經(jīng)驗和運維經(jīng)驗,來保證我們的工作的順利進行。專注于網(wǎng)站建設就選成都創(chuàng)新互聯(lián)公司

      Blob對象

      • 前言
      • 環(huán)境
      • 操作
      • 總結


      Blob是一個類文件的不可變的原始數(shù)據(jù)對象,非javascript原生數(shù)據(jù)類型,F(xiàn)ile對象就是繼承自Blob對象,且在Blob的基礎上進行擴展,以便支持用戶系統(tǒng)上的文件。

      前言

      最近在做以post請求方式導出excel時,想到了可以使用Blob對象將后臺返回的輸出流以arraybuffer或blob的格式接收交給Blob處理,最后使用URL生成鏈接,供瀏覽器下載excel。

      環(huán)境

      1. vue2.x
      2. webpack3.x
      3. axios

      操作

      import axios from 'axios'
      /**
      * 從服務器下載excel
      */
      function downloadExcel (settings) {
       const defaultOptions = {
        responseType: 'arraybuffer'
       }
       Object.assign(settings.options, defaultOptions)
       requestToResponse(settings).then(res => {
        const filename = decodeURI(res.headers['content-disposition'].split('filename=')[1])
        if ('download' in document.createElement('a')) {
         downloadFile(res.data, filename)
        } else {
         Message.error('瀏覽器不支持')
        }
       })
      }
      /**
      * 發(fā)送http請求
      * @param {Object} settings api參數(shù)
      * @returns reponse
      */
      function requestToResponse (settings) {
        const defaultParams = {
        timeout: 45000,
        headers: {
         'X-Requested-With': 'XMLHttpRequest',
         'Content-Type': 'application/json'
        },
        responseType: 'json',
        method: 'POST'
       }
       Object.assign(defaultParams, settings)
        return new Promise((resolve, reject) => {
        axios(defaultParams).then(res => {
         resolve(res)
        }).catch(err => {
         reject(err)
        })
       })
      }
      /**
      * blob下載(兼容IE)
      * @param {String} content 文件內(nèi)容
      * @param {String} filename 文件名
      */
      function downloadFile (content, filename) {
       const blob = new Blob([content])
       // IE
       if (window.navigator && window.navigator.msSaveOrOpenBlob) {
        window.navigator.msSaveOrOpenBlob(blob, filename)
       } else {
        imatateDownloadByA(window.URL.createObjectURL(blob), filename)
       }
      }
      /**
      * 通過a標簽模擬下載
      * @param {String} href
      * @param {String} filename
      */
      function imatateDownloadByA (href, filename) {
       const a = document.createElement('a')
       a.download = filename
       a.style.display = 'none'
       a.href = href
       document.body.appendChild(a)
       a.click()
       a.remove()
       window.URL.revokeObjectURL(href)
      }
      
      // 下載excel
      downloadExcel({
        url: '/default/excel/export',
        responseType: 'arraybuffer'
      })

      responseType設置為arraybuffer
      javascript如何使用Blob對象下載文件
      responseTyp設置成blob
      javascript如何使用Blob對象下載文件
      不設置responseType,出現(xiàn)亂碼
      javascript如何使用Blob對象下載文件
      若引入mockjs,其攔截響應,重置了responseType,會出現(xiàn)亂碼
      javascript如何使用Blob對象下載文件

      總結

      1. 此下載excel只適用于post請求,get請求交給瀏覽器自行解析處理
      2. responseType必須設置成arraybuffer或blob
      3. 下載excel時務必關閉mockjs之類的攔截響應的服務

      看完這篇關于javascript如何使用Blob對象下載文件的文章,如果覺得文章內(nèi)容寫得不錯的話,可以把它分享出去給更多人看到。


      文章名稱:javascript如何使用Blob對象下載文件
      標題URL:http://www.ef60e0e.cn/article/pcpeop.html
      99热在线精品一区二区三区_国产伦精品一区二区三区女破破_亚洲一区二区三区无码_精品国产欧美日韩另类一区
      1. <ul id="0c1fb"></ul>

        <noscript id="0c1fb"><video id="0c1fb"></video></noscript>
        <noscript id="0c1fb"><listing id="0c1fb"><thead id="0c1fb"></thead></listing></noscript>

        蒙山县| 新巴尔虎右旗| 郎溪县| 即墨市| 封丘县| 高平市| 河池市| 济源市| 天全县| 通榆县| 巴彦淖尔市| 三原县| 友谊县| 弥渡县| 宣化县| 房产| 安泽县| 宜兰县| 盱眙县| 清丰县| 邵武市| 广饶县| 黄陵县| 凉山| 卓资县| 泗阳县| 湘阴县| 平安县| 临夏县| 汉中市| 商水县| 新邵县| 齐齐哈尔市| 板桥市| 新源县| 滁州市| 子长县| 乐亭县| 平泉县| 米脂县| 旅游|