uniapp h5在线预览word文档ppt等

article/2025/8/25 14:11:44

1.要预览文档服务首先开启服务
(1)登录 数据万象控制台 ,单击存储桶管理,进入存储桶管理页面。
(2)在存储桶管理页面选择并单击需操作的存储桶,进入相应存储桶管理页面。
(3)单击左侧导航栏文档处理页签,然后选择文档预览配置项。
(4)单击文档预览编辑,将状态修改为开启,单击保存,即可开通文档预览服务。
(5)开通服务后,使用相应的文档预览接口即可实现 下载时实时预览;同时支持 异步创建文档预览任务。
在这里插入图片描述
这里有个很关键选择拼接连接使用第二个html浏览模式
那么具体代码如下

	<template><view class="user_agreement"><web-view :src="allurl" flex="1"></web-view><!-- <image src="https://teachercc-1302927746.file.myqcloud.com/fire_school/Service_agreement.docx?ci-process=doc-preview&page=10" mode=""></image> --></view>
</template><script>export default {data() {return {allurl: ''}},onLoad(e) {let _this = this_this.id = e.idlet fileUrlswitch (e.id) {case '1':fileUrl = 'https://teachercc-1302927746.file.myqcloud.com/fire_school/Course_agreement.docx'break;case '2':fileUrl = 'https://teachercc-1302927746.file.myqcloud.com/fire_school/Personal_commitment.docx'break;case '3':fileUrl = 'https://teachercc-1302927746.file.myqcloud.com/fire_school/Enterprise_commitment.docx'break;case '4':fileUrl = 'https://teachercc-1302927746.file.myqcloud.com/fire_school/Service_agreement.docx'break;default:fileUrl = 'https://teachercc-1302927746.file.myqcloud.com/fire_school/Privacy_policy.docx'break;}_this.allurl = fileUrl + '?ci-process=doc-preview&dstType=html'console.log(_this.allurl)}}
</script><style lang="scss">img {width: 100%;}.user_agreement {min-height: 100%;.sdf {height: 100%;width: 100%;}}
</style>

http://chatgpt.dhexx.cn/article/FlBlknSo.shtml

相关文章

php怎么在线预览word文件?php预览.doc、.docx、.wps文件

php预览Word PHP要实现在线Word预览只需要3步 第一步&#xff1a; 准备一个文件地址&#xff0c;如下&#xff1a; http://usdoc.cn/vw/文件模板.docx 第二步 预览前置地址&#xff1a; http://vw.usdoc.cn/?src 第三步 开始预览 http://vw.usdoc.cn/?srchttp://usdoc.cn/vw/…

Vue在线预览word

先上效果图 下载插件 npm i docx-preview0.1.4 npm i jszip 完整代码 <template><div class"app"><el-button click"preview">预览</el-button><el-dialogv-if"previewShow"title"预览":visible.sync&q…

前端实现在线预览Word文件

简介 在项目中遇到了个需求&#xff0c;大致需求这样的&#xff1a;用户在上传文件前需要先预览一下内容&#xff0c;确认内容是否正确&#xff0c;正确的情况下才可以上传&#xff1b; 那么这里面会涉及到一个在上传前的文档的预览操作&#xff0c;下面就记录一下踩坑记录 d…

前端实现在线预览word(docx),pdf,excel类型的文件

实现方案 找了网上的实现方案&#xff0c;效果看起来不错&#xff0c;放在下面的表格里&#xff0c;里面有一些是可以直接通过npm在vue中引入使用。 文档格式老的开源组件替代开源组件word&#xff08;docx&#xff09;mammothdocx-preview(npm)powerpoint&#xff08;pptx&a…

word文档创建及在线预览方法

工作中经常有时会遇到需要给用户创建word文档并实现word文档在线预览 的需求,我来讲一讲我所知道的解决方案。 一、word文档模板定义 因word文档中内容是根据不同用户显示不一样,所以需要使用较为灵活的模板了,本文使用的是freemarkerxml来定义模板: 1. maven依赖: <depe…

自学Java没学历可以找到工作吗?

除非技术真的diao 炸 天&#xff0c;否则大概率是找不到的 低学历能自学编程的人大有人在&#xff0c;你在搜索引擎上一查&#xff0c;低学历自学编程改变自身命运的不胜枚举。 但无一不例外的&#xff0c;每个求学者的叙述都透漏着心酸、艰难困苦&#xff0c;披荆斩棘。这些词…

自学Java真能找到好工作吗

最近跟学生沟通的时候总是能听到这样的对话 学生&#xff1a;老师&#xff0c;我觉得没必要报个班学习Java&#xff0c;我有好多师兄现在都在自学的&#xff0c;我觉得他们学的也挺不错的&#xff0c;没有想象的那么难&#xff0c;我也准备自学了&#xff01; 老师&#xff1…

自学编程到底多难?能不能找到工作?阿里技术专家这样回答……

最近逛知乎&#xff0c;看到一个问题&#xff0c;有感而发&#xff0c;原问题如下&#xff1a; 想自学编程恳请大神推荐app网站&#xff01;? 数学不好&#xff0c;再从小学数学开始重修 想学习编程&#xff0c;请问各位大神 1、编程要求哪方面数学知识&#xff1f; 2、有…

自学Java真的可以找到工作吗?

就java得市场而言&#xff0c;不管自学还是科班找到工作都不是很难。当然&#xff0c;自学的话&#xff0c;首先要解决的是自制力的问题&#xff0c;如果没有自制力&#xff0c;也就没有了恒心&#xff0c;学不了东西&#xff0c;自然也找不到工作。 其次&#xff0c;java发展…

java能自学吗_java能自学吗?

java能自学吗&#xff1f; Java是一门面向对象编程语言&#xff0c;不仅吸收了C语言的各种优点&#xff0c;还摒弃了C里难以理解的多继承、指针等概念&#xff0c;因此Java语言具有功能强大和简单易用两个特征。Java语言作为静态面向对象编程语言的代表&#xff0c;极好地实现了…

自学编程5个月找到了月薪12K的工作,我的方法值得大家借鉴

昨晚在刷知乎的时候&#xff0c;突然跳出了字节发来的录用邮件&#xff0c;期待了很久offer&#xff0c;最大的感受就是这5个月的编程自学没有白费。 高中对编程很感兴趣&#xff0c;但是一边搞主课一边自学编程导致高考没考好&#xff0c;编程也没学出什么苗头。于是选择了一个…

自学java到可以找工作要多久_自学编程需要多久才能找到工作?

自学编程需要多久才能找到工作&#xff1f; 很多编程初学者都会有这种疑问&#xff0c;自学学到什么程度或者学多久能够找到工作&#xff0c;这种问题没有统一答案&#xff0c;因为每个人的出发时候的基础以及在学习过程中掌握的程度不尽相同&#xff0c;也会导致结果不一样&am…

自学java能找到工作吗?公司会要吗?

java是一门面向对象编程语言&#xff0c;它不仅仅吸收了C语言的各种优点&#xff0c;还摒弃了C语言当中很难理解的多继承、指针等概念&#xff0c;所以&#xff0c;java语言具有着功能简单、简单易用这两个特征。 java学习起来还是非常的简单的&#xff0c;现在有很多的人都会自…

零基础自学编程的程序员如何找到工作

现在很多年轻人喜欢计算机,喜欢软件开发,想从事IT行业但又不是学这个专业的,很多人就想通过自学的途径走上这条道路,但大家肯定也和我当初一样有很多的困惑。本人学校学的是国际贸易专业,毕业之后的不顺利加上自身的兴趣爱好,走上编程的道路,下面就结合亲身经历说说自己…

自学单片机能找到工作吗?能有出路吗?

你现在的情况跟我十年前很像啊&#xff0c; 或许我当时的情况比你现在还糟一些。 我们是电气工程毕业的&#xff0c;第一年学了一些电气相关的知识&#xff0c;后面几年学校给我们安排的全是电梯的课程。 我和很多人的想法一样&#xff0c;电梯还需要开专业的课程&#xff1f…

配置Nginx端口

一、起因 昨天晚上闲来无事,上了下阿里云发现自己的域名和服务器都还没过期,所以就把自己的域名绑定到服务器地址上,做了一个DNS解析。但是我发现,每次需要访问8888端口时仍需要使用 域名:8888 这种方式访问,所以我想用Nginx做一个反向代理,将默认打开的80端口转发到808…

宝塔配置Nginx

如果出404 就是因为点击了 恢复默认配置 解决办法 &#xff1a; 重新 指向 目录位置即可

本地项目配置nginx代理请求接口

nginx安装 安装下载地址&#xff1a;http://nginx.org/en/download.htmlnginx配置 相关命令(针对小白&#xff0c;本人也是)&#xff1a; 1. start nginx // 启动ng服务器2. nginx -s reload // 服务杀死后进行重启&#xff08;每次修改配置需执行此操作&#xff09;3. nginx -…

5分钟教你快速配置nginx实现访问

文章目录 需求操作步骤一、开放端口二、在nginx配置文件中配置端口1&#xff09;server块2&#xff09;区分root和alias3&#xff09;区分server块的root和location块的root4&#xff09;proxy_pass处理跨域 三、根据配置文件往路径下丢包 总结 需求 工作中我们时常需要完成个…

Debian配置Nginx和PHP

要求&#xff1a; 安装nginx软件包&#xff1b; 配置文件名为ispweb.conf&#xff0c;放置在/etc/nginx/conf.d/目录下&#xff1b; 网站根目录为/mut/crypt&#xff08;目录不存在需创建&#xff09;&#xff1b; 启用FastCGI功能&#xff0c;让nginx能够解析php请求&#xff…