Skip to content
本页导读

微信SDK

支持AndroidiOS

平台兼容性

AndroidiOSweb鸿蒙 Next小程序
xxx

UniApp Vue Nvue

AndroidiOSweb鸿蒙 Next小程序
xxxxx

Api

事件名参数说明
registerUxRegisterOptions注册
isInstalled-是否安装微信
openApp-打开微信
loginUxLoginOptions登录
shareUxShareOptions分享
requestPaymentUxPayOptions请求支付

Android注意事项

需在本插件utssdk -> app-android -> AndroidManifest.xml 文件中将所有 ${applicationId}字段替换成您的真实包名

插件注册universalLink必填, android可为空

ts
wxsdk.register({
	appid: '',
	universalLink: '',
	success: (res) => {
		console.log(res)
	}
} as UxRegisterOptions)
wxsdk.register({
	appid: '',
	universalLink: '',
	success: (res) => {
		console.log(res)
	}
} as UxRegisterOptions)

iOS注意事项

需在本插件utssdk -> app-ios -> Info.plist 文件中修改 CFBundleURLSchemes字段对应的Value为您的微信AppId

插件注册universalLink必填

ts
wxsdk.register({
	appid: '',
	universalLink: '', // ios 必填
	success: (res) => {
		console.log(res)
	}
} as UxRegisterOptions)
wxsdk.register({
	appid: '',
	universalLink: '', // ios 必填
	success: (res) => {
		console.log(res)
	}
} as UxRegisterOptions)

示例代码

ts
<script setup>
	// #ifdef APP
	import * as wxsdk from "@/uni_modules/ux-weixin"
	import { UxLoginOptions, UxRegisterOptions, UxShareOptions, UxPayOptions, UxMiniProgram } from "@/uni_modules/ux-weixin"
	// #endif
	
	let title = ''
	const code = ref('')
	
	function isAPP(): boolean {
		// #ifdef APP
		return true
		// #endif
		// #ifndef APP
		uni.showToast({
			title: '仅支持APP',
			icon: 'none'
		})
		return false
		// #endif
	}
	
	function isInstalled() {
		if(!isAPP()) return
		
		// #ifdef APP
		uni.showToast({
			title: wxsdk.isInstalled() ? '已安装微信' : '未安装微信',
			icon: 'none'
		})
		// #endif
	}
	
	function onAuth() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.login({
			success: (res) => {
				console.log(res);
				code.value = res.code
				uni.showModal({
					title: '授权成功',
					content: `授权凭证:${res.code}`
				})
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxLoginOptions)
		// #endif
	}
	
	function shareWebpage() {
		if(!isAPP()) return
		
		// #ifdef APP
		uni.downloadFile({
			url: 'https://www.uxframe.cn/logo/logo.png',
			success: (e) => {
				wxsdk.share({
					type: 0,
					title: 'UxFrame低代码高性能UI框架',
					summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
					href: 'https://www.uxframe.cn',
					// imageUrl: '/static/logo.png',
					imageUrl: e.tempFilePath,
					success: (res) => {
						console.log(res);
					},
					fail: (err) => {
						console.log(err);
					}
				} as UxShareOptions)
			}
		})
		// #endif
	}
	
	function shareText() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.share({
			type: 1,
			title: 'UxFrame低代码高性能UI框架',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function shareImage() {
		if(!isAPP()) return
		
		// #ifdef APP
		uni.downloadFile({
			// url: 'https://www.uxframe.cn/logo/logo.png',
			url: 'https://oss.bgbgsc.com/bingo-file/2024/09/03/20240903151559A042.png',
			// url: 'http://xiao-xi-zai-jia.obs.cn-east-3.myhuaweicloud.com:80/33b10e5e975f482e8940be834e693216%2Fthumbnail%2F1722343759659a91184270ed81bc47c4fc9f4ab83974a807736df24eebbccfa605940797e90c4.jpg',
			success: (e) => {
				console.log(e.tempFilePath);
				wxsdk.share({
					type: 2,
					// imageUrl: '/static/logo.png'
					imageUrl: e.tempFilePath,
					success: (res) => {
						console.log(res);
					},
					fail: (err) => {
						console.log(err);
					}
				} as UxShareOptions)
			}
		})
		// #endif
	}
	
	function shareMusic() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.share({
			type: 3,
			title: 'UxFrame低代码高性能UI框架',
			summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
			imageUrl: '/static/logo.png',
			// imageUrl: 'https://www.uxframe.cn/logo/logo.png',
			mediaUrl: 'http://staff2.ustc.edu.cn/~wdw/softdown/index.asp/0042515_05.ANDY.mp3',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function shareVideo() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.share({
			type: 4,
			title: 'UxFrame低代码高性能UI框架',
			summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
			imageUrl: '/static/logo.png',
			// imageUrl: 'https://www.uxframe.cn/logo/logo.png',
			mediaUrl: 'https://www.uxframe.cn/source/intro/demo.mp4',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function shareMp() {
		if(!isAPP()) return
		
		// #ifdef APP
		uni.getImageInfo({
			src: 'https://oss.bgbgsc.com/bingo-file/2024/09/03/20240903151559A042.png',
			// src: 'http://xiao-xi-zai-jia.obs.cn-east-3.myhuaweicloud.com:80/33b10e5e975f482e8940be834e693216%2Fthumbnail%2F1722343759659a91184270ed81bc47c4fc9f4ab83974a807736df24eebbccfa605940797e90c4.jpg',
			success: (res) => {
				console.log(res.path);
				wxsdk.share({
					type: 5,
					title: 'UxFrame低代码高性能UI框架',
					summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
					// imageUrl: '/static/logo.png',
					imageUrl: 'https://oss.bgbgsc.com/bingo-file/2024/09/03/20240903151559A042.png',
					miniProgram: {
						id: 'gh_b5453753cee',
						type: 0,
						path: '',
						webUrl: 'https://www.uxframe.cn'
					} as UxMiniProgram,
					success: (res) => {
						console.log(res);
					},
					fail: (err) => {
						console.log(err);
					}
				} as UxShareOptions)
			}
		})
		// #endif
	}
	
	function requestPayment() {
		if(!isAPP()) return
		
		// #ifdef APP-ANDROID
		wxsdk.requestPayment({
			mchid: '商户号',
			prepayId: '预付单',
			sign: '签名',
			signType: '签名类型',
			nonceStr: '随机字符串',
			timeStamp: '时间戳',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxPayOptions)
		// #endif
	}
	
	function openMiniProgram() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.openMiniProgram({
			miniProgram: {
				id: 'gh_b5453753cee',
				type: 0,
				path: '',
			} as UxMiniProgram,
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function openCustomerService() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.share({
			openCustomerServiceChat: true,
			corpid: '******************',
			customerUrl: 'https://work.weixin.qq.com/kfid/kfc********',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function openApp() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.openApp()
		// #endif
	}
	
	onLoad((e: OnLoadOptions) => {
		title = e['title'] ?? ''
		
		// #ifdef APP
		wxsdk.register({
			appid: 'wx29666d279a7f52a8',
			universalLink: '',
			success: (res) => {
				console.log(res)
			}
		} as UxRegisterOptions)
		// #endif
	})
	
</script>
<script setup>
	// #ifdef APP
	import * as wxsdk from "@/uni_modules/ux-weixin"
	import { UxLoginOptions, UxRegisterOptions, UxShareOptions, UxPayOptions, UxMiniProgram } from "@/uni_modules/ux-weixin"
	// #endif
	
	let title = ''
	const code = ref('')
	
	function isAPP(): boolean {
		// #ifdef APP
		return true
		// #endif
		// #ifndef APP
		uni.showToast({
			title: '仅支持APP',
			icon: 'none'
		})
		return false
		// #endif
	}
	
	function isInstalled() {
		if(!isAPP()) return
		
		// #ifdef APP
		uni.showToast({
			title: wxsdk.isInstalled() ? '已安装微信' : '未安装微信',
			icon: 'none'
		})
		// #endif
	}
	
	function onAuth() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.login({
			success: (res) => {
				console.log(res);
				code.value = res.code
				uni.showModal({
					title: '授权成功',
					content: `授权凭证:${res.code}`
				})
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxLoginOptions)
		// #endif
	}
	
	function shareWebpage() {
		if(!isAPP()) return
		
		// #ifdef APP
		uni.downloadFile({
			url: 'https://www.uxframe.cn/logo/logo.png',
			success: (e) => {
				wxsdk.share({
					type: 0,
					title: 'UxFrame低代码高性能UI框架',
					summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
					href: 'https://www.uxframe.cn',
					// imageUrl: '/static/logo.png',
					imageUrl: e.tempFilePath,
					success: (res) => {
						console.log(res);
					},
					fail: (err) => {
						console.log(err);
					}
				} as UxShareOptions)
			}
		})
		// #endif
	}
	
	function shareText() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.share({
			type: 1,
			title: 'UxFrame低代码高性能UI框架',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function shareImage() {
		if(!isAPP()) return
		
		// #ifdef APP
		uni.downloadFile({
			// url: 'https://www.uxframe.cn/logo/logo.png',
			url: 'https://oss.bgbgsc.com/bingo-file/2024/09/03/20240903151559A042.png',
			// url: 'http://xiao-xi-zai-jia.obs.cn-east-3.myhuaweicloud.com:80/33b10e5e975f482e8940be834e693216%2Fthumbnail%2F1722343759659a91184270ed81bc47c4fc9f4ab83974a807736df24eebbccfa605940797e90c4.jpg',
			success: (e) => {
				console.log(e.tempFilePath);
				wxsdk.share({
					type: 2,
					// imageUrl: '/static/logo.png'
					imageUrl: e.tempFilePath,
					success: (res) => {
						console.log(res);
					},
					fail: (err) => {
						console.log(err);
					}
				} as UxShareOptions)
			}
		})
		// #endif
	}
	
	function shareMusic() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.share({
			type: 3,
			title: 'UxFrame低代码高性能UI框架',
			summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
			imageUrl: '/static/logo.png',
			// imageUrl: 'https://www.uxframe.cn/logo/logo.png',
			mediaUrl: 'http://staff2.ustc.edu.cn/~wdw/softdown/index.asp/0042515_05.ANDY.mp3',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function shareVideo() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.share({
			type: 4,
			title: 'UxFrame低代码高性能UI框架',
			summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
			imageUrl: '/static/logo.png',
			// imageUrl: 'https://www.uxframe.cn/logo/logo.png',
			mediaUrl: 'https://www.uxframe.cn/source/intro/demo.mp4',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function shareMp() {
		if(!isAPP()) return
		
		// #ifdef APP
		uni.getImageInfo({
			src: 'https://oss.bgbgsc.com/bingo-file/2024/09/03/20240903151559A042.png',
			// src: 'http://xiao-xi-zai-jia.obs.cn-east-3.myhuaweicloud.com:80/33b10e5e975f482e8940be834e693216%2Fthumbnail%2F1722343759659a91184270ed81bc47c4fc9f4ab83974a807736df24eebbccfa605940797e90c4.jpg',
			success: (res) => {
				console.log(res.path);
				wxsdk.share({
					type: 5,
					title: 'UxFrame低代码高性能UI框架',
					summary: 'UxFrame是基于UNI-APP-X开发的低代码高性能原生UI框架',
					// imageUrl: '/static/logo.png',
					imageUrl: 'https://oss.bgbgsc.com/bingo-file/2024/09/03/20240903151559A042.png',
					miniProgram: {
						id: 'gh_b5453753cee',
						type: 0,
						path: '',
						webUrl: 'https://www.uxframe.cn'
					} as UxMiniProgram,
					success: (res) => {
						console.log(res);
					},
					fail: (err) => {
						console.log(err);
					}
				} as UxShareOptions)
			}
		})
		// #endif
	}
	
	function requestPayment() {
		if(!isAPP()) return
		
		// #ifdef APP-ANDROID
		wxsdk.requestPayment({
			mchid: '商户号',
			prepayId: '预付单',
			sign: '签名',
			signType: '签名类型',
			nonceStr: '随机字符串',
			timeStamp: '时间戳',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxPayOptions)
		// #endif
	}
	
	function openMiniProgram() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.openMiniProgram({
			miniProgram: {
				id: 'gh_b5453753cee',
				type: 0,
				path: '',
			} as UxMiniProgram,
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function openCustomerService() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.share({
			openCustomerServiceChat: true,
			corpid: '******************',
			customerUrl: 'https://work.weixin.qq.com/kfid/kfc********',
			success: (res) => {
				console.log(res);
			},
			fail: (err) => {
				console.log(err);
			}
		} as UxShareOptions)
		// #endif
	}
	
	function openApp() {
		if(!isAPP()) return
		
		// #ifdef APP
		wxsdk.openApp()
		// #endif
	}
	
	onLoad((e: OnLoadOptions) => {
		title = e['title'] ?? ''
		
		// #ifdef APP
		wxsdk.register({
			appid: 'wx29666d279a7f52a8',
			universalLink: '',
			success: (res) => {
				console.log(res)
			}
		} as UxRegisterOptions)
		// #endif
	})
	
</script>
html
<template>
	<ux-page>
		<ux-navbar :title="title" :border="false"></ux-navbar>
		
		<ux-scroll>
			<ux-card direction="column" icon="flag-filled" title="微信SDK" :bold="true">
				<ux-text text="支持微信授权、分享、支付、拉起微信企业客服等功能"></ux-text>
				<ux-row :flex="true" align="top" :mt="5" style="width: 100%;">
					<ux-text text="详细文档:"></ux-text>
					<ux-text style="flex: 1" name="微信SDK" text="https://www.uxframe.cn/api/weixin.html" path="/pages/webview/webview" mode="link"</ux-text>
				</ux-row>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="基本" :bold="true">
				<ux-col>
					<ux-button text="是否安装微信" @click="isInstalled()"></ux-button>
					<ux-button text="打开微信" :mt="10" @click="openApp()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="微信授权" :bold="true">
				<ux-col>
					<ux-text :text="code"></ux-text>
					
					<ux-button text="拉起授权" :mt="10" @click="onAuth()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="微信分享" :bold="true">
				<ux-col>
					<ux-button text="图文" @click="shareWebpage()"></ux-button>
					<ux-button text="文本" :mt="10" @click="shareText()"></ux-button>
					<ux-button text="图片" :mt="10" @click="shareImage()"></ux-button>
					<ux-button text="音频" :mt="10" @click="shareMusic()"></ux-button>
					<ux-button text="视频" :mt="10" @click="shareVideo()"></ux-button>
					<ux-button text="小程序" :mt="10" @click="shareMp()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="微信支付" :bold="true">
				<ux-col>
					<ux-button text="拉起支付" @click="requestPayment()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="打开小程序" :bold="true">
				<ux-col>
					<ux-button text="打开小程序" @click="openMiniProgram()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="微信企业客服" :bold="true">
				<ux-col>
					<ux-button text="拉起客服" @click="openCustomerService()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-placeholder :height="200">
				<ux-row justify="center" align="center" style="height: 100%;">
					<ux-text prefix-icon="soapbubble-filled" text="真的没有了~"></ux-text>
				</ux-row>
			</ux-placeholder>
		</ux-scroll>
		
	</ux-page>
</template>
<template>
	<ux-page>
		<ux-navbar :title="title" :border="false"></ux-navbar>
		
		<ux-scroll>
			<ux-card direction="column" icon="flag-filled" title="微信SDK" :bold="true">
				<ux-text text="支持微信授权、分享、支付、拉起微信企业客服等功能"></ux-text>
				<ux-row :flex="true" align="top" :mt="5" style="width: 100%;">
					<ux-text text="详细文档:"></ux-text>
					<ux-text style="flex: 1" name="微信SDK" text="https://www.uxframe.cn/api/weixin.html" path="/pages/webview/webview" mode="link"</ux-text>
				</ux-row>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="基本" :bold="true">
				<ux-col>
					<ux-button text="是否安装微信" @click="isInstalled()"></ux-button>
					<ux-button text="打开微信" :mt="10" @click="openApp()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="微信授权" :bold="true">
				<ux-col>
					<ux-text :text="code"></ux-text>
					
					<ux-button text="拉起授权" :mt="10" @click="onAuth()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="微信分享" :bold="true">
				<ux-col>
					<ux-button text="图文" @click="shareWebpage()"></ux-button>
					<ux-button text="文本" :mt="10" @click="shareText()"></ux-button>
					<ux-button text="图片" :mt="10" @click="shareImage()"></ux-button>
					<ux-button text="音频" :mt="10" @click="shareMusic()"></ux-button>
					<ux-button text="视频" :mt="10" @click="shareVideo()"></ux-button>
					<ux-button text="小程序" :mt="10" @click="shareMp()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="微信支付" :bold="true">
				<ux-col>
					<ux-button text="拉起支付" @click="requestPayment()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="打开小程序" :bold="true">
				<ux-col>
					<ux-button text="打开小程序" @click="openMiniProgram()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-card direction="column" icon="arrowright" title="微信企业客服" :bold="true">
				<ux-col>
					<ux-button text="拉起客服" @click="openCustomerService()"></ux-button>
				</ux-col>
			</ux-card>
			
			<ux-placeholder :height="200">
				<ux-row justify="center" align="center" style="height: 100%;">
					<ux-text prefix-icon="soapbubble-filled" text="真的没有了~"></ux-text>
				</ux-row>
			</ux-placeholder>
		</ux-scroll>
		
	</ux-page>
</template>
css
<style lang="scss">
	
</style>
<style lang="scss">
	
</style>