uniapp+vue2+h5图片下载保存,微信浏览器、非微信浏览器

小程序端

javascript 复制代码
onDown() {
	// 检查相册权限
	uni.authorize({
		scope: 'scope.writePhotosAlbum',
		success: () => {
			this.downloadImage();
		},
		fail: () => {
			uni.showToast({
				title: "请授权相册权限",
				icon: "none"
			});
		}
	});
},
downloadImage() {
	common.request('post', '/agent/Managestart/downQrcode', {
		device_id: this.device_id
	}).then(res => {
		if (res.code === 1) {
			uni.downloadFile({
				url: res.data,
				success: (downloadRes) => {
					if (downloadRes.statusCode === 200) {
						uni.saveImageToPhotosAlbum({
							filePath: downloadRes.tempFilePath,
							success: () => {
								uni.showToast({
									title: "保存成功"
								});
							},
							fail: () => {
								uni.showToast({
									title: "保存失败",
									icon: "none"
								});
							}
						});
					}
				}
			});
		}
	});
}

微信打开

javascript 复制代码
onDown() {
	common.request('post', '/agent/Managestart/downQrcode', {
		device_id: this.device_id
	}).then(res => {
		if (res.code == 1) {
			const imageData = common.image(res.data);

			// 检测是否是微信浏览器
			const isWeixin = /MicroMessenger/i.test(navigator.userAgent);
			if (isWeixin) {
				// 微信浏览器:强制跳转到图片 URL
				window.location.href = imageData;
			} else {
				// 非微信浏览器:通用下载方式
				const link = document.createElement("a");
				link.href = imageData;
				link.download = "qrcode.png";
				document.body.appendChild(link);
				link.click();
				document.body.removeChild(link);
			}
		} else {
			uni.showToast({
				title: "获取图片失败",
				icon: "none"
			});
		}
	}).catch(() => {
		uni.showToast({
			title: "网络异常",
			icon: "none"
		});
	});
},
相关推荐
2501_916008899 小时前
深入解析iOS机审4.3原理与混淆实战方法
android·java·开发语言·ios·小程序·uni-app·iphone
QT.qtqtqtqtqt10 小时前
uni-app小程序前端开发笔记(更新中)
前端·笔记·小程序·uni-app
喵喵虫20 小时前
uniapp修改封装组件失败 styleIsolation
uni-app
游戏开发爱好者81 天前
日常开发与测试的 App 测试方法、查看设备状态、实时日志、应用数据
android·ios·小程序·https·uni-app·iphone·webview
2501_915106321 天前
app 上架过程,安装包准备、证书与描述文件管理、安装测试、上传
android·ios·小程序·https·uni-app·iphone·webview
2501_915106321 天前
使用 Sniffmaster TCP 抓包和 Wireshark 网络分析
网络协议·tcp/ip·ios·小程序·uni-app·wireshark·iphone
宠友信息1 天前
2025社交+IM及时通讯社区APP仿小红书小程序
java·spring boot·小程序·uni-app·web app
“负拾捌”1 天前
python + uniapp 结合腾讯云实现实时语音识别功能(WebSocket)
python·websocket·微信小程序·uni-app·大模型·腾讯云·语音识别
局外人LZ2 天前
Uniapp脚手架项目搭建,uniapp+vue3+uView pro+vite+pinia+sass
前端·uni-app·sass
2501_915918412 天前
在 iOS 环境下查看 App 详细信息与文件目录
android·ios·小程序·https·uni-app·iphone·webview