vue将base64编码转为pdf方法

html 复制代码
<iframe width="100%" height="100%" src="" frameborder="0" id="iframe"></iframe>
html 复制代码
使用方法:
直接调用就行
viewPdf('传入base64编码即可')
clike 复制代码
  //content是base64编码格式
  const viewPdf =(content:any)=> {
    const blob = base64ToBlob(content);
    // @ts-ignore
    if (window.navigator && window.navigator.msSaveOrOpenBlob) {
      // @ts-ignore
      window.navigator.msSaveOrOpenBlob(blob);
    } else {
      let iframe = document.getElementById("iframe")
      if(iframe){
        //我这里是用iframe嵌入的 
        // @ts-ignore
        iframe.src= URL.createObjectURL(blob);
      }
      // window.open(fileURL);// 打开ppf文件(如果不用iframe嵌入 打开新的页面 就可用window.open来打开)
    }
  }
  // 2.base转二进制文件流
  const base64ToBlob = (code:any)=> {
    code = code.replace(/[\n\r]/g, '');// 检查base64字符串是否符合base64编码
    // atob() 方法用于解码使用 base-64 编码的字符串。
    const raw = window.atob(code);
    const rawLength = raw.length;
    const uInt8Array = new Uint8Array(rawLength);
    for (let i = 0; i < rawLength; ++i) {
      // 将解码后的逐个字符转换成Unicode序号,放入Unit8Array数组
      uInt8Array[i] = raw.charCodeAt(i);
    }
    // 通过Blob将Uint8Array数组转换成pdf类型的文件对象
    return new Blob([uInt8Array], { type: 'application/pdf' });
  }
相关推荐
Mr Xu_4 小时前
前端开发中CSS代码的优化与复用:从公共样式提取到CSS变量的最佳实践
前端·css
鹏北海-RemHusband5 小时前
从零到一:基于 micro-app 的企业级微前端模板完整实现指南
前端·微服务·架构
LYFlied5 小时前
AI大时代下前端跨端解决方案的现状与演进路径
前端·人工智能
光影少年5 小时前
AI 前端 / 高级前端
前端·人工智能·状态模式
一位搞嵌入式的 genius5 小时前
深入 JavaScript 函数式编程:从基础到实战(含面试题解析)
前端·javascript·函数式
anOnion5 小时前
构建无障碍组件之Alert Dialog Pattern
前端·html·交互设计
choke2335 小时前
[特殊字符] Python 文件与路径操作
java·前端·javascript
云飞云共享云桌面6 小时前
高性能图形工作站的资源如何共享给10个SolidWorks研发设计用
linux·运维·服务器·前端·网络·数据库·人工智能
wqq63108556 小时前
Python基于Vue的实验室管理系统 django flask pycharm
vue.js·python·django
Deng9452013146 小时前
Vue + Flask 前后端分离项目实战:从零搭建一个完整博客系统
前端·vue.js·flask