uniapp微信小程序，不下载文件借助小程序直接分享文件

思路：

借助的分享小程序的api，在分享小程序时，把分享的文件名称和url一并分享出去，在打开小程序时进行检查，如果判断出来有这两个数据，则进行文件下载打开操作。

实操：

1.说明一下我的data(){return{}}中的数据：

data:[
    {
	    "name": "doc测试",
	    "url": "https://gitee.com/xiangshang1/test/raw/master/test/%E6%B5%8B%E8%AF%95.doc",
	    "time": "2024-04-26",
    }
],
sharedItem: {
	"name": "产品名称"
},

sharedItem是在分享时存数据的，默认值为产品名称，这样可以在使用右上角分享是正常分享出去

2.methods中的方法：

        //分享小程序保存数据
		setSharedItem(item) {
			this.sharedItem = item; // 将点击的 item 存储到 sharedItem 中
		},
		//打开
		download(url, name) {
			//中文转义
			function encodeChinese(url) {
				let encodedUrl = '';
				for (let i = 0; i < url.length; i++) {
					let char = url.charAt(i);
					// 判断是否为中文字符
					if (/[\u4E00-\u9FA5]/.test(char)) {
						// 如果是中文字符，则进行编码
						encodedUrl += encodeURIComponent(char);
					} else {
						// 如果不是中文字符，则保持原样
						encodedUrl += char;
					}
				}
				return encodedUrl;
			}
			let encodedUrl = encodeChinese(url);
			console.log("转义后的url",encodedUrl);
			let downurl = encodedUrl;
			console.log("转义前的url",url);
			// let downurl = url;
			const hasExtension = name.includes('.');
			const fileExtension = hasExtension ? '' : url.split('.').pop();
			// const fileExtension = url.split('.').pop();
			// console.log("下载链接b", downurl, "名称:", name, "后缀", fileExtension);
			uni.downloadFile({
				url: downurl,
				filePath: uni.env.USER_DATA_PATH + "/" + name + (hasExtension ? '' : ("." + fileExtension)),
				// filePath: uni.env.USER_DATA_PATH + "/" + name + "." + fileExtension,
				success: function (res) {
					console.log("下载成功");
					var filePath = res.filePath || res.tempFilePath;
					//打开函数支持格式：doc,docx,xls,xlsx,ppt,pptx,pdf。
					uni.openDocument({
						filePath: filePath,
						showMenu: true,
						success: function (res) {
							console.log('打开文档成功');
						}, fail: function (error) {
							console.log(filePath, "我打开失败了");
							console.error('打开文档失败', error);
						}
					});
				}, fail: function (error) {
					console.log(url, "我下载失败了");
					console.error('下载文件失败', error);
				}
			});
		},

分别是分享时存储数据，下载打开文档，使用的代码。转义是因为，有些时候带中文的url下载失败，莫名其妙的，就加了个转义

3.在metods级，写onShareAppMessage，onShareAppMessage是官方提供的方法：

onShareAppMessage(res) {
		if (res.from === 'button') {// 来自页面内分享按钮
			console.log("分享的数据", this.sharedItem);
		}
		setTimeout(() => {
			this.sharedItem = { "name": "产品名称" };
			console.log("已初始化sharedItem");
		}, 3000); // 延迟执行
		return {
			title: this.sharedItem.name,
			path: '/pages/index/index?' + "url=" + this.sharedItem.url + "&name=" + this.sharedItem.name
		}
	},

使用setTimeout是为了让sharedItem在分享后重新初始化为产品名称，return会将url和name一并加在页面后面传递出去

4.在onLoad中的代码：

onLoad(e) {
		//显示分享按钮
		uni.showShareMenu({
			withShareTicket: true,
			menus: ['shareAppMessage', 'shareTimeline']
		})
		if (Object.keys(e).length > 1 && e.url != "undefined") {
			console.log("加载时检测到了数据", e)
			this.download(e.url, e.name)
		} else {
			console.log("加载时没有检测到数据");
		}
	},

uni.showShareMenu会在右上角的菜单中显示分享功能，下面的if判断会在数据长度大于一且url不为空时调用下载打开函数。

5.在页面中的代码：

<view v-for="(item, index) in data" :key="index">
	<div class="file">
		<div class="name">{{ item.name }}</div>
		<div class="time">{{ item.time }}</div>
		<button class="openfile" @click="download(item.url, item.name)">打开</button>
		<button open-type="share" class="sharefile" type="primary" shape="circle" @click="setSharedItem(item)">分享</button>
	</div>
</view>