js下载pdf文件并预览(base64),但文件太大无法正常显示

复制代码
base64转blob
javascript 复制代码
    dataURLtoBlob(dataurl ) {
      let arr = dataurl.split(','),
        mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]),
        n = bstr.length,
        u8arr = new Uint8Array(n)
      while (n--) {
        u8arr[n] = bstr.charCodeAt(n)
      }
      return new Blob([u8arr], { type: mime })
    },

下载文件并凭借文件地址:

javascript 复制代码
 const link = 'data:application/pdf;base64,' + pdf文件(base64)
 let blob = this.dataURLtoBlob(link)
 this.fileUrl = window.URL.createObjectURL(blob)

用iframe预览文件:

javascript 复制代码
      <iframe
          :src="fileUrl"
          v-loading="loading"
          frameborder="0"
          style="width: 100%"
          height="620px"/>
相关推荐
我是一只小青蛙8888 小时前
JavaScript DOM操作全解析
开发语言·javascript·ecmascript
AI视觉网奇8 小时前
Uncaught SyntaxError: Failed to construct ‘RTCPeerConnection‘:
前端·javascript·html
再学一点就睡15 小时前
前端网络实战手册:15个高频工作场景全解析
前端·网络协议
C_心欲无痕15 小时前
有限状态机在前端中的应用
前端·状态模式
C_心欲无痕16 小时前
前端基于 IntersectionObserver 更流畅的懒加载实现
前端
candyTong16 小时前
深入解析:AI 智能体(Agent)是如何解决问题的?
前端·agent·ai编程
柳杉16 小时前
建议收藏 | 2026年AI工具封神榜:从Sora到混元3D,生产力彻底爆发
前端·人工智能·后端
weixin_4624462316 小时前
使用 Puppeteer 设置 Cookies 并实现自动化分页操作:前端实战教程
运维·前端·自动化
CheungChunChiu16 小时前
Linux 内核动态打印机制详解
android·linux·服务器·前端·ubuntu
Irene199117 小时前
Vue 官方推荐:kebab-case(短横线命名法)
javascript·vue.js