Vue前端在线预览文件插件

Vue前端在线预览文件插件

一、使用场景

1.1.像文档资料等,只想让他人在线预览,但不能下载。此等场景需求可以用到此插件。

二、此文档介绍两种插件

1.view.xdocin插件
(上线后免费几天,然后收费,添加作者后,可以延长使用几天)
![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/404a2019c36a4e7f943568c9c01eff33.png
2.view.officeapps.live插件
(微软插件,说的是免费,使用中)

三、代码示例

1.1.view.xdocin插件

https://view.xdocin.com/view?src=你的文档地址

注:
1.文档地址要用utf-8编码,并且外网可访问
2.添加的多行水印个数,不能调节
3.修改打印等参数,参考文档XDOC文档预览服务接口

2.微软view.officeapps.live插件

https://view.officeapps.live.com/op/embed.aspx?src=" + encodeURIComponent(file.url)
https://view.officeapps.live.com/op/view.aspx?src=(file.url的urlencode编码)

注:
1.微软的两种预览方式,一种好像可以打印,另一种不是,可以自行测试。
2.预览的整体响应速度不是很快,文档页数太多,有时翻页会出现只能翻到5页左右,需重新打开,等文件全部加载完毕。

总结:
1.随着互联网时代的飞速发展,越来越多的工作开始依赖于云端服务,我们的办公方式也逐渐发生了翻天覆地的变化。后台管理系统需要一种快速查看文档,无需下载并安装软件。
2.市面上的预览插件很多,上述两种方式,都是本人用过的总结,不喜勿喷,谢谢。

一个在学习的开发者,勿喷,欢迎交流

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/850160.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

二叉树的实现(初阶数据结构)

1.二叉树的概念及结构 1.1 概念 一棵二叉树是结点的一个有限集合,该集合: 1.或者为空 2.由一个根结点加上两棵别称为左子树和右子树的二叉树组成 从上图可以看出: 1.二叉树不存在度大于2的结点 2.二叉树的子树有左右之分,次序不能…

DevOps入门

DevOps: 让技术团队、运维、测试等团队实现一体式流程自动化 CICD: CI:持续集成 CD:持续交付持续集成:从编码、编译、测试、发布项目到仓库的自动化流程持续交付:包含持续集成,并且增加将项目部署到对应的环境的自动化流程 传统项目闭环流程: DevOps闭环流程…

软考架构-计算机网络考点

会超纲,3-5分 网络分类 按分布范围划分 局域网 LAN 10m-1000m左右 房间、楼宇、校园 传输速率高 城域网 MAN 10km 城市 广域网 WAN 100km以上 国家或全球(英特网) 按拓扑结构划分 总线型:利用率低、干…

问题:设备管理指标为完好率不低于( ),待修率不高于5%,事故率不高于1%。 #知识分享#经验分享#经验分享

问题:设备管理指标为完好率不低于( ),待修率不高于5%,事故率不高于1%。 A、100% B、95% C、90% D、80% 参考答案如图所示

思维,CF1575K - Knitting Batik

目录 一、题目 1、题目描述 2、输入输出 2.1输入 2.2输出 3、原题链接 二、解题报告 1、思路分析 2、复杂度 3、代码详解 一、题目 1、题目描述 2、输入输出 2.1输入 2.2输出 3、原题链接 1575K - Knitting Batik 二、解题报告 1、思路分析 诈骗题,上面…

Android开机动画关闭流程

一步一图项目上要加一个开机动画结束的回调,我这边看下如何加 好,老规矩,如何启动动画?动画是谁启动的?怎么关闭的?谁通知关闭的 带着问题看源码 动画的启动流程 开机动画的主入口在哪? 这个…

数据结构--线性表和串

个人介绍 hello hello~ ,这里是 code袁~💖💖 ,欢迎大家点赞🥳🥳关注💥💥收藏🌹🌹🌹 🦁作者简介:一名喜欢分享和记录学习的…

2024-06-08 Unity 编辑器开发之编辑器拓展9 —— EditorUtility

文章目录 1 准备工作2 提示窗口2.1 双键窗口2.2 三键窗口2.3 进度条窗口 3 文件面板3.1 存储文件3.2 选择文件夹3.3 打开文件3.4 打开文件夹 4 其他内容4.1 压缩纹理4.2 查找对象依赖项 1 准备工作 ​ 创建脚本 “Lesson38Window.cs” 脚本,并将其放在 Editor 文件…

Vue3【十二】09Computed计算属性

Vue3【十二】09Computed计算属性 计算属性 获取全名 这种方式是只读的不能修改 这样定义fullName是一个计算属性&#xff0c;可读可写 案例截图 目录结构 代码 Person.vue <template><div class"person"><h1>我是 Person 组件</h1>姓&…

基于OpenVINO实现无监督异常检测

异常检测(AD) 在欺诈检测、网络安全和医疗诊断等关键任务应用中至关重要。由于数据的高维性和底层模式的复杂性&#xff0c;图像、视频和卫星图像等视觉数据中的异常检测尤其具有挑战性。然而&#xff0c;视觉异常检测对于检测制造中的缺陷、识别监控录像中的可疑活动以及检测医…

三维重建 虚拟内窥镜(VE)是什么?怎么实现 使用场景

1.虚拟内窥镜&#xff1a; 就是利用计算机图形学、虚拟现实、图像处理和科学可视化等信息处理技术仿真光学内窥镜对病人进行诊断的一种技术。 VE(Virtual Endoscopy)&#xff0c;虚拟内镜技术。这种CT重建图像可以模拟各种内镜检查的效果&#xff0c;它是假设视线位于所要观察…

高能来袭|联想拯救者携手《黑神话:悟空》玩转东方神话世界

从2020年首次发布实机演示视频以来&#xff0c;《黑神话&#xff1a;悟空》便在全球范围内获得了广泛关注&#xff0c;成为国产3A游戏的现象级爆款。6月&#xff0c;联想拯救者正式宣布成为《黑神话&#xff1a;悟空》全球官方合作伙伴&#xff0c;致力于共同革新国产游戏体验&…

第十二届蓝桥杯C++青少年组中/高级组选拔赛2020年11月22日真题解析

一、编程题 第1题&#xff1a;求和 【题目描述】 输入一个正整数 N(N < 100)&#xff0c;输出 1 到 N(包含 1 和 N)之间所有奇数的和。 【输入描述】 输入一个正整数 N(N < 100) 【输出描述】 输出 1 到 N 之间的所有奇数的和 【输入样例】 3【输出样例】 4答案&…

LIP模型动力学方程例子

线性倒立摆(Linear Inverted Pendulum, LIP)模型是用于描述和控制人形机器人步态的重要工具。LIP模型假设质心沿着一条固定的直线运动,并且所有质量集中在质心上。这简化了计算,使得模型更容易用于控制和稳定分析。 LIP模型动力学方程 LIP模型的基本假设是: 机器人的质心…

【病理数据】svs格式数据解读

Openslide 病理图像通常以.svs格式存储在数据库中。要想使用python处理svs格式的图像&#xff0c;我们通常使用Openslide模块。 关于Openslide模块的安装详见这个博客&#xff1a; 【解决Error】ModuleNotFoundError: No module named ‘openslide‘ 病理图像数据结构 病理图…

Latex中表格(3)

Latex中的表格 一、多行或多列单元格 这篇主要说Latex中表格出现多行或者多列单元格的形式. 一、多行或多列单元格 可能用到的宏包 \usepackage{booktabs}\usepackage{multirow} 代码&#xff1a; \begin{table}[h!] \centering \caption{Your caption here} \begin{tabul…

【iOS】UI——关于UIAlertController类(警告对话框)

目录 前言关于UIAlertController具体操作及代码实现总结 前言 在UI的警告对话框的学习中&#xff0c;我们发现UIAlertView在iOS 9中已经被废弃&#xff0c;我们找到UIAlertController来代替UIAlertView实现弹出框的功能&#xff0c;从而有了这篇关于UIAlertController的学习笔记…

Nextjs学习教程

一.手动创建项目 建议看这个中文网站文档,这个里面的案例配置都是手动的,也可以往下看我这个博客一步步操作 1.在目录下执行下面命令,初始化package.json文件 npm init -y2.安装react相关包以及next包 yarn add next react react-dom // 或者 npm install --save next react…

k8s常见故障--yaml文件检查没有问题 pod起不来(一直处于创建中)

故障信息 pod一直处于创建中 查看pod详细信息显示 kubectl describe pod 容器id文字 Events: Type Reason Age From Message Normal Scheduled 5m30s default-scheduler Successfully assigned default/nginx-server2-f97c6b9d5-d6dsp to worker02 Warning FailedCreatePod…

C语言之字符函数总结(全部!),一篇记住所有的字符函数

前言 还在担心关于字符的库函数记不住吗&#xff1f;不用担心&#xff0c;这篇文章将为你全面整理所有的字符函数的用法。不用记忆&#xff0c;一次看完&#xff0c;随查随用。用多了自然就记住了 字符分类函数和字符转换函数 C语言中有一系列的函数是专门做字符分类和字符转换…