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)  //下载

 

  

 

posted @ 2018-09-29 08:26  jht_newbie  阅读(713)  评论(0编辑  收藏  举报