首先第一步,我们需要检测用户是否安装了MetaMask这个插件

我们这里需要安装一个包,叫做@metamask/detect-provider

这个可以百度一下用npm安装到对应的项目中就可以了

将这个包引入 :

import detectEthereumProvider from "@metamask/detect-provider"

检测是否安装了MetaMask插件

            async setPeovider() { // 检测提供者
				uni.showLoading({
					title: '检测授权中...',
					mask: true
				});
				const provider = await detectEthereumProvider();
				if (provider) {
					this.startApp(provider); // Initialize your app
				} else {
					uni.showToast({
						title: '请先安装MetaMask插件',
						icon: 'none',
						duration: 3500
					});
					return false;
				}
			},

 这一步可以看成检测插件

           startApp(provider) {
				if (provider !== window.ethereum) {
					uni.showToast({
						title: '安装了多个钱包,加载失败',
						icon: 'none',
						duration: 3500
					});
					return false
				} else {
					uni.showLoading({
						title: '登录中...',
						mask: true
					});
				}
				this.login_metamask()
			},

然后就调起登录框,登录相应的账号

对应的还有一些事件的回调,下面的代码中也都写了注释

          login_metamask() {
				this.eth_requestAccounts(); // 拿到账户对应的账号
				ethereum.on('accountsChanged', (accounts) => { // 地址修改时收到通知
					localStorage.clear()
					this.setPeovider(); // 重新登录
				});
				ethereum.on('connect', (connectInfo) => { // 当 MetaMask 提供者第一次能够向链        提交 RPC 请求时,它会发出此事件。
					uni.clearStorage();
					// Time to reload your interface with accounts[0]!
					this.loginDapp();
				});
				ethereum.on('disconnect', (error) => { // 如果 MetaMask 提供者无法向任何链提        交 RPC 请求,它会发出此事件。
					// 这里可以打印一下error
				});
				// ethereum.on('message', (message) => { // MetaMask 提供者在收到一些应该通知消费者的消息时发出此事件。
				// 	console.log(message.data.result.hash)
				// })
			},
            eth_requestAccounts() { // 链接到MetaMask
				ethereum.request({
					method: 'eth_requestAccounts'
				}).then((account) => {
					this.$store.commit('accounts/connect_wallet', account[0]);
					localStorage.setItem('accounts', account)
					this.loginDapp();
				});
			},
            loginDapp() { // 登录dapp (获取dapp信息)
				this.$appReq.post("login/registerByDapp", {
					'tuiguang_address': this.other.tuiguang_address,
					'username': this.accounts.current_address
				}, (res) => {
					if (res.data.code == 1) {
						if (!this.accounts.user) {
							this.$store.commit('accounts/login', res.data.data);
						}
						this.asyncUser(res.data.data);
					} else {
						this.is_mm = false;
						this.tips = res.data.msg;
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						});
					}
				});
			},
            asyncUser(userMsg) {
				let that = this
				this.$appReq.post("user/asyncUser", {}, (res) => {
					// console.log("=================user==============");
					that.third_login(userMsg)
					if (res.data.code == 1) {
						setTimeout(() => {
							this.getTeamPerson();
						}, 600);
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						});
					}
				});
			},
			third_login(userMsg) { // 登录
				let name = userMsg.name
				let head = userMsg.head
				let account = userMsg.address
				let that = this
				global.$http
					.request({
						url: '/api/login/third_login',
						data: {
							name,
							head,
							account,
						}
					})
					.then(res => {
						res.data.data.address = account
						let data = JSON.stringify(res.data.data)
						localStorage.setItem('userMsg', data)
						uni.showToast({
							title: res.data.msg,
							icon: 'none',
							duration: 3500
						});
						localStorage.setItem('token', res.data.data.token)
						uni.$emit('userMsgToken')
					});
			},
			getTeamPerson() {
				this.$appReq.post("user/getTeamPerson", {}, (res) => {
					// console.log("=================getTeamPerson==============");
					// console.log(res);
					if (res.data.code == 1) {
						this.$store.commit('other/setTeamPerson', res.data.data);
						this.$forceUpdate();
					} else {
						this.$store.commit('other/setTeamPerson', false);
						/* uni.showToast({
							title:res.data.msg,
							icon:'none'
						});	 */
					}
				});
				this.$appReq.post("user/getTeamPerson2", {}, (res) => {
					// console.log("=================getTeamPerson2==============");
					// console.log(res);
					if (res.data.code == 1) {
						this.$store.commit('other/setTeamPerson2', res.data.data);
						this.$forceUpdate();
					} else {
						this.$store.commit('other/setTeamPerson2', false);
						/* uni.showToast({
							title:res.data.msg,
							icon:'none'
						});	 */
					}
				});

			},

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐