eassy-pay/pages/index/index.vue

<template>
	<view class="content">
		<view class="aaa" >
			<web-view id="web-view-1" :src="url" @message="message" v-if="showweb"></web-view>
		</view>
		
		<!-- <view class="userinfo" @click="showweb=true">
			
		</view> -->
    
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: 'https://yruibao.com/#/pages/index/index',
				// url: 'http://localhost:8080/#/pages/index/index', 
				showweb:false,
				channelId:null,
			}
		},
		onLoad(options) {
			if(uni.getStorageSync('channelId')){
				this.channelId=uni.getStorageSync('channelId')
				this.url=this.url+'?channelId='+this.channelId
				console.log(this.url,'this.channelIdthis.channelId');
				this.showweb=true
			}else{
				this.showweb=true
			}
			// my.alert({
			//     content:JSON.stringify(options.query.key)
			//   })   
			//   console.log(JSON.stringify(options))
			// console.log(options,'optionsoptions');
		},
		onShow() {
		
		},
		methods: {
			// handleMessage(message) {
			// 	console.log('接收到消息了');
			//     // step 2. 小程序页面接收信息时，触发授权调用
			//     if (message.action == 'authorize') {
			//       this.authorize();

			//     }
			//   },

			message(e) {
				console.log(e,'eeeeeeeeee');
				
				if (e.detail.data.action == 'authorize') {
					this.authorize();

				} else if (e.detail.data.action == 'getqiany') {
					console.log('发送签约消息了');
					this.onWebviewMessage()
				}else if(e.detail.data.action=='getCode'){
					console.log('判断3');
					this.getcode()
					
				}else if(e.detail.data.action=='getjmCode'){
					this.getjmcode()
				}
			},
		
			onWebviewMessage() {
				// console.log('onWebviewMessage>>>>>', message)
				// message && my.alert({
				//   title: '收到H5消息',
				//   content: JSON.stringify(message)
				// })
				const {
					detail: {
						type,
						token,
						url,
						authFlowId
					}
				} = message
				switch (type) {
					case 'IDENTITY_ALI_FACE_AWAKE':
						// 拉起支付宝刷脸
						my.startAPVerify({
							url,
							certifyId: token,
							success: function(res) {
								console.log('success', res)
							},
							fail: function(res) {
								console.log('fail', res)
							},
							complete: function(res) {
								console.log('complete', res)
							}
						})
						break;
					case 'RN_DONE':
						// 实名认证完成
						break;
					case 'E_AUTH_FINISHED':
						// 授权认证完成 
						break;
					case 'SIGN_SUCCESS':
						// 签署成功
						// 要跳转的页面或进行其他操作
						// my.navigateTo({
						//   url: '/pages/index/index',
						// });
						break;
					case 'SIGN_FAIL':
						// 签署失败
						break;
					case 'SEAL_EXAMINE':
						// 等待用印审批
						break;
					case 'REVOKE':
						// 签署流程撤销
						break;
					case 'REFUSE':
						// 拒签
						break;
					default:
						break;
				}
			},
			getcode(){
				return new Promise((resolve, reject) => {
					my.getAuthCode({
						scopes: 'auth_user',
						success: res => {
							const authCode = res.authCode;
							console.log(res);
							const webviewContext = my.createWebViewContext('web-view-1');
							webviewContext.postMessage({
								type: 'codeResult',
								data:authCode
							});
		
						},
						fail: err => {
							console.log('my.getAuthCode 调用失败', err)
						}
					});
				});
			},
			getjmcode(){
				return new Promise((resolve, reject) => {
					my.getAuthCode({
						scopes: 'auth_base',
						success: res => {
							console.log(res);
							const authCode = res.authCode;
							const webviewContext = my.createWebViewContext('web-view-1');
							webviewContext.postMessage({
								type: 'jmcodeResult',
								data:authCode
							});
					
						},
						fail: err => {
							console.log('my.getAuthCode 调用失败', err)
						}
					});
				});
			},
			authorize() {
				return new Promise((resolve, reject) => {
					my.getAuthCode({
						scopes: 'auth_user',
						success: res => {
							const authCode = res.authCode;
							// 在服务端获取用户信息
							my.request({
								// 你的服务器地址
								url: 'https://yruibao.com/prod/api/front/user/aliPayOauthToken',
								data: {
									authCode,
								},
								success: (res) => {

									// step 3. 将信息发送到 web-view H5
									const webviewContext = my.createWebViewContext(
										'web-view-1');
									console.log('成功了', res);

									// 发送消息给 WebView 内的 H5 页面
									webviewContext.postMessage({
										type: 'authorizeResult',
										data: res.data
									});
								},
							});
						},
						fail: err => {
							console.log('my.getAuthCode 调用失败', err)
						}
					});
				});
			}


		}
	}
</script>

<style lang="scss">
	
	
	.content{
		.userinfo{
			
			position: fixed;
			bottom: 0;
			z-index: 100;
			width: 750rpx;
			height: 200rpx;
			background: #fff;
		}
	}
</style>