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' });
  }
相关推荐
前端小白从0开始26 分钟前
Vue3项目实现WPS文件预览和内容回填功能
前端·javascript·vue.js·html5·wps·文档回填·文档在线预览
難釋懷1 小时前
Vue解决开发环境 Ajax 跨域问题
前端·vue.js·ajax
特立独行的猫a1 小时前
Nuxt.js 中的路由配置详解
开发语言·前端·javascript·路由·nuxt·nuxtjs
咸虾米1 小时前
在uniCloud云对象中定义dbJQL的便捷方法
前端·javascript
梨子同志1 小时前
JavaScript Proxy 和 Reflect
前端·javascript
汤圆炒橘子1 小时前
状态策略模式的优势分析
前端
90后的晨仔2 小时前
解析鸿蒙 ArkTS 中的 Union 类型与 TypeAliases类型
前端·harmonyos
IT_陈寒2 小时前
Element Plus 2.10.0 重磅发布!新增Splitter组件
前端·人工智能·后端
挑战者6668882 小时前
vue入门环境搭建及demo运行
前端·javascript·vue.js
贩卖纯净水.2 小时前
Webpack的基本使用 - babel
前端·webpack·node.js