zoukankan      html  css  js  c++  java
  • JS中使用base64编码上传下载文件

    下载文件:使用FileSaver.js   https://github.com/eligrey/FileSaver.js/blob/master/README.md       

    手机端UC浏览器无法下载  安卓火狐浏览器可上传、下载

    import * as fileSave from 'file-saver';
      download(spath: string, swjm: string) {
        this.tableService.getwjnrws(spath).subscribe(data => {
          const content = data.swjnr;
          if (content) {
            console.log('下载' + content);
            const index = swjm.lastIndexOf('.');
            const fileType = swjm.substring(index);
            const mime = {
             ......  // MIME 参考手册: http://www.w3school.com.cn/media/media_mimeref.asp
              '.zip': 'application/zip',
              '.json': 'application/json'
            };
    
            if (fileType in mime) {
    
              const myFile = this.createFile(content, mime[fileType]);
    
              // const file = new File([myFile], swjm, { type: mime[fileType] });
    
              fileSave.saveAs(myFile, swjm);
    
            }
    
          }
        });
    
      }
    
      createFile(data, type) {
        const bytes = window.atob(data);
        let n = bytes.length;
        const u8arr = new Uint8Array(n);
        while (n--) {
          u8arr[n] = bytes.charCodeAt(n); // 返回在指定的位置的字符的 Unicode 编码
        }
        return new Blob([u8arr], { type: type });
      }
    

      上传文件:

     upload(files: FileList, service: HiswsService) {
       function getDateStr(d:Date){ ......
    //格式化日期代码省略…… return `${year}/${mouthStr}/${dayStr} ${hourStr}:${minuteStr}:${secondStr}`; } if (files.length) { const file = files[0]; // const fileType = file.type; const reader = new FileReader(); // new一个FileReader实例 reader.onload = function (e) { const t: any = e.target; console.log('上传:' + t.result); let wjnr = ''; const d = t.result.split('base64,')[1]; if (d) { wjnr = d; } else { wjnr = t.result; } const today = new Date(); const sygid = sessionStorage.getItem('currentUser'); const data = new FileBean('', file.name, '', `${file.size}`, '1', file.name, getDateStr(today), wjnr, sygid); service.wjsave(data).subscribe( s => { console.log('wjsave:' + s); if (s.state) { alert('上传文件成功!'); } else { alert('上传失败:' + s.errorMsg); } } ); }; reader.readAsDataURL(file); // 返回一个基于Base64编码的data-uri对象 } }

     service所做的事情就是发get 或 post请求给后端

    return this.http.post<SaveOutputBean>(surl, fileBean, httpOptions)  //上传
    
    return this.http.get<FileContent>(lurl)  //下载
    

      

  • 相关阅读:
    Bootstrap表格的使用
    [JS练习] 瀑布流照片墙
    [C#基础] 委托
    [C#基础] 泛型
    [C#基础] 继承
    [C#基础] 类
    [C#基础] 数据类型
    Unity获取手机的电量时间
    C#网络通信Socket详解
    记C#一次服务器搭建和数据库应用
  • 原文地址:https://www.cnblogs.com/yongwangzhiqian/p/9721775.html
Copyright © 2011-2022 走看看