微信小程序（原生）和uniapp预览电子文件doc/pdf/ppt/excel等_uniapp实现app端在线预览word和excel

微信小程序原生预览文件

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("请稍后重试")
		}
	});
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

uniapp预览电子文件

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
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20