zoukankan      html  css  js  c++  java
  • input上传文件的各种转换操作(一)

    文件对象---->base64

    base64 ---> blob

    blob --- > flie

    本地json文件 ---> 读取成json

    指定url浏览器下载文件

    import { getBase64, dataURLtoBlobs, blobToFile } from '@/utils/util.js'

    本地json文件 ---> 读取成json

        geJsonData (file) {
          const __this = this
          var reader = new FileReader()// 新建一个FileReader
          reader.readAsText(file, 'UTF-8')// 读取文件
          reader.onload = function (evt) { // 读取完文件之后会回来这里
            var fileString = evt.target.result // 读取文件内容
            const jsonObj = JSON.parse(fileString)
            __this.actData[file.name] = jsonObj.animations
          }
        },

    文件对象---->base64

    // util.js
    
    export function getBase64 (img, callback) {
      console.log('getBase64', img)
      const reader = new FileReader()
      reader.addEventListener('load', (e) => {
        callback(reader.result)
      })
      reader.readAsDataURL(img)
    }
    
    
    handleChange (info) {
        // 得到blob格式数据 上传
        getBase64(item.originFileObj, (result) => {
                __this.fileBlobObj[item.name] = dataURLtoBlobs(result)
                __this.postImage(item)
         })
    
    }

    base64 ---> blob

    // 将base64转换为blob
    export function dataURLtoBlobs (dataurl) {
      var arr = dataurl.split(',')
      var mime = arr[0].match(/:(.*?);/)[1]
      var bstr = atob(arr[1])
      var n = bstr.length
      var u8arr = new Uint8Array(n)
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n)
      }
      return new Blob([u8arr], { type: mime })
    }

    blob --- > flie

    // 将blob转换为file
    export function blobToFile (theBlob, fileName) {
      theBlob.lastModifiedDate = new Date()
      theBlob.name = fileName
      return theBlob
    }

    4、下载

      function openDownloadDialog (url, saveName) {
        if (typeof url === 'object' && url instanceof Blob) {
          url = URL.createObjectURL(url)
        }
        var aLink = document.createElement('a')
        aLink.href = url
        aLink.download = saveName || ''
        var event
        if (window.MouseEvent) event = new MouseEvent('click')
        else {
          event = document.createEvent('MouseEvents')
          event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
        }
        aLink.dispatchEvent(event)
      }
    
      openDownloadDialog(sheet2blob(sheet), xmlName + '.xlsx')

    5、

  • 相关阅读:
    axios
    vue打包之后生成一个配置文件修改请求接口
    微信小程序小结(2) ------ 自定义组件
    eros --- Windows Android真机调试
    weex前端式写法解决方案---eros
    微信小程序小结(1) ------ 前后端交互及wx.request的简易封装
    configparser模块--配置文件
    怎样尊重一个程序员
    poj1326(bfs)
    安装篇——压缩包安装MySql数据库
  • 原文地址:https://www.cnblogs.com/dhjy123/p/14988142.html
Copyright © 2011-2022 走看看