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"
		});
	});
},
相关推荐
小徐_233313 小时前
uni-app 项目别再从零搭了!3 个 Wot UI 起手模板怎么选?
前端·uni-app
蜡台13 小时前
uniapp pdf文件预览组件
pdf·uni-app·合同·pdfh5
凡泰AI18 小时前
如何借助MCP打通企业APP内部服务:从统一调用到小程序承接
小程序·uni-app·app·mpaas·mcp·小程序容器
华玥作者19 小时前
uniapp 万条数据不卡顿:我写了个虚拟列表组件 hy-list,原生支持瀑布流
数据结构·uni-app·list·vue3
这是个栗子19 小时前
uni-app 微信小程序开发:常用函数总结(一)
微信小程序·小程序·uni-app·getcurrentpages
乐橙开放平台1 天前
明厨亮灶笔记:乐橙轻应用 H5 + 小程序插件,一套 BFF 出两张播放凭证
人工智能·笔记·物联网·小程序·音视频·notepad++
宠友信息2 天前
消息序号如何保证即时通讯源码聊天记录稳定加载
java·spring boot·redis·python·mysql·uni-app
2501_916008893 天前
苹果上架工具怎么选 不用 Mac 上架 App Store 的几种方案
android·macos·ios·小程序·uni-app·iphone·webview
宠友信息3 天前
MySQL复合索引与Druid优化仿小红书源码个人主页查询链路
数据库·spring boot·websocket·mysql·uni-app
梦幻通灵3 天前
Notepad++格式化Json两种方案【持续更新】
android·json·notepad++