vue2实现二进制流pdf浏览器预览功能

这篇具有很好参考价值的文章主要介绍了vue2实现二进制流pdf浏览器预览功能。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

该方法不需要使用插件 

获取后端二进制文件流后直接处理

// 获取文件流处理
viewPdf(id) {
  return request({
    url: `...`,
    method: 'get',
    headers: { 'Content-Type': 'application/octet-stream' },
    responseType: 'blob'
  }).then(res => {
    // res为二进制文件流
    const blob = new Blob([res], { type: 'application/pdf;charset=utf-8' })
    const href = URL.createObjectURL(blob)
    window.open(href, 'newWindow')
  })
}

然后点击调用方法使用文章来源地址https://www.toymoban.com/news/detail-807454.html

clickViewPdf(id) {
  viewPdf(id)
}

到了这里,关于vue2实现二进制流pdf浏览器预览功能的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Vue前端渲染blob二进制对象图片的方法

    近期做开发,联调接口。接口返回的是一张图片,是对二进制图片处理并渲染,特此记录一下。 本文章是转载文章,原文章:Vue前端处理blob二进制对象图片的方法 接口response是下图 显然,获取到的是一堆乱码,前端需要将其解析出来,百度之后发现解析二进制文档流的写法

    2024年02月15日
    浏览(62)
  • vue 后端返回二进制流-前端通过blob对象下载文件-图片

    前言 在实际开发中我们经常会遇见下载文件的场景,比如下载合同,下载文件 下载文件有2种方式,一种是后端返回二进制流,前端通过blob对象接受根据不同类型下载 还有一种把地址直接在浏览器新窗口打开浏览器打开pdf可以预览和下载,其他文件直接下载 但不管是那种方

    2024年02月05日
    浏览(76)
  • FPGA实现二进制转BCD码

    bcd码:以4bit二进制码表示一个十进制码 例如,432(d) = 0100-0011-0010(bcd) 这里具体的判断方法为:(满5)加3法 二进制位宽为W,则BCD位宽只需要(W + (W - 4) / 3+1)位 FPGA Verilog实现二进制转BCD码 二进制数转换成BCD码的Verilog实现 modelsim仿真验证 至此,结束

    2024年02月13日
    浏览(57)
  • vue如何通过$http的post方法请求下载二进制的Excel文件

    使用此function 使用此function, test.vue instanceName: \\\"exportExcel\\\",导出excel文件 instanceName: \\\"downloadLog\\\",下载.log后缀的txt文件 封装接口 代码中使用:

    2024年01月18日
    浏览(50)
  • Python读取二进制文件:深入解析与技术实现

    目录 一、引言 二、二进制文件的基础 1、二进制文件的组成 2、二进制文件的编码 三、Python读取二进制文件的方法 1、使用内置函数open() 2、使用numpy库 四、处理读取的二进制数据 1、解析数据 2. 转换数据类型 五、总结与展望 1、高效读取二进制文件 2、处理复杂的二进制文件

    2024年02月04日
    浏览(41)
  • 二进制加密PHP Webshell原理及简单实现

    今天继续给大家介绍渗透测试相关知识,本文主要内容是二进制加密PHP Webshell原理及简单实现。 免责声明: 本文所介绍的内容仅做学习交流使用,严禁利用文中技术进行非法行为,否则造成一切严重后果自负! 再次强调:严禁对未授权设备进行渗透测试! 为了躲避WAF、杀软

    2023年04月09日
    浏览(42)
  • 【FPGA】Verilog:二进制并行加法器 | 超前进位 | 实现 4 位二进制并行加法器和减法器 | MSI/LSI 运算电路

    0x00 并行加法器和减法器 如果我们要对 4 位加法器和减法器进行关于二进制并行运算功能,可以通过将加法器和减法器以 N 个并行连接的方式,创建一个执行 N 位加法和减法运算的电路。 4 位二进制并行加法器 4 位二进制并行减法器

    2024年02月05日
    浏览(55)
  • 数据结构:使用顺序栈的基本操作,实现十进制转为二进制,十六进制的转换

    使用系统环境: 1:win10,使用工具dev 2:使用系统win10 3:参考书籍数据结构(C语言版——严蔚敏 吴伟民) ( 注意:此文章默认,学习者拥有一定的数据机构栈,C语言的知识,书籍第20页,2.1算法的代码进行一个简化。)

    2024年02月05日
    浏览(64)
  • vue3+axios:图片链接转换成二进制文件流后并提交服务器

    1、使用Image类创建一个新的图片。 2、将图片转换成base64。 3、将base64图片使用File类转换成二进制文件流 4、将二进制文件流使用 FormData类转换成binary类型提交服务器。 Image类创建一个新的图片 图片转换成base64 base64转换成二进制文件流 二进制流文件提交到服务器

    2024年02月15日
    浏览(46)
  • FPGA——verilog实现格雷码与二进制的转换

    格雷码是一种循环二进制码或者叫作反射二进制码。跨时钟域会产生亚稳态问题(CDC问题):从时钟域A过来的信号难以满足时钟域B中触发器的建立时间和保持时间,输入与clk的变化不同步而导致了亚稳态。此时触发器输出端Q在有效时钟沿之后比较长的一段时间处于不确定的

    2024年02月15日
    浏览(57)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包