微信小程序(原生)和uniapp预览电子文件doc/pdf/ppt/excel等

微信小程序原生预览文件

javascript 复制代码
function previewFile(value) {
	const fileExtName = `${value.ext}`;
	const randFile = new Date().getTime() + fileExtName;
	uni.showLoading({
		title: '加载中...'
	})

	wx.downloadFile({
		url: value.url, // 文件的本身url
		filePath: wx.env.USER_DATA_PATH + '/' + randFile, // 本地自定义的文件名
		success: function(res) {
			// console.log("filePath", res)
			let filePath = res.filePath; // 微信临时文件路径(这里要使用自定义的名字文件名,否则打开的文件名是乱码)
			let fileType = value.ext.substring((1));
			wx.openDocument({
				filePath: filePath,
				fileType: fileType,
				// showMenu: true,  // 是否显示右上角菜单按钮 默认为false(看自身需求,可要可不要。后期涉及到右上角分享功能)
				success: function() {
					// console.log("打开文件成功")
				},
				fail: function() {
					// console.log("打开文件失败,请稍后重试")
				}
			});
			uni.hideLoading();
		},
		fail: function() {
			// console.log("请稍后重试")
		}
	});
}

uniapp预览电子文件

javascript 复制代码
function previewFile(value) {
	let fileType = value.ext.substring((1));   //去掉点 如下.doc=>doc
	uni.showLoading({
		title: '加载中...'
	})
	uni.downloadFile({
		url: value.url,
		success: function(res) {
			let filePath = res.tempFilePath;
			uni.openDocument({
				filePath: filePath,
				fileType,
				success: function(res) {
					// console.log('打开文档成功');
				}
			});
			uni.hideLoading();
		}
	});
}
相关推荐
东风西巷1 天前
PDFgear:免费全能的PDF处理工具
前端·pdf·软件需求
百思可瑞教育1 天前
Vue中使用keep-alive实现页面前进刷新、后退缓存的完整方案
前端·javascript·vue.js·缓存·uni-app·北京百思可瑞教育
风早爽太1 天前
在uni-app中使用lottie-web来展示Lottie动画
uni-app
Autumn_yun1 天前
uniapp 实现项目多语言切换
uni-app
nodcloud1 天前
点可云进销存商城如何部署在微信小程序
微信小程序·小程序
懒大王95271 天前
uni-app + Vue3 + EZUIKit.js 播放视频流
开发语言·javascript·uni-app
懒大王95271 天前
uni-app + Vue3 开发展示 echarts 图表
前端·uni-app·echarts
百思可瑞教育2 天前
Vue 生命周期详解:从初始化到销毁的全过程剖析
前端·javascript·vue.js·前端框架·uni-app·北京百思可瑞教育·百思可瑞教育
Sunny_yiyi2 天前
Java根据模版导出PDF文件
java·开发语言·pdf
jingling5552 天前
uniapp | 快速上手ThorUI组件
前端·笔记·前端框架·uni-app