微信小程序——支付结果查询

90 阅读 0 评论 60 点赞

我是靠谱客的博主含蓄唇彩，最近开发中收集的这篇文章主要介绍微信小程序——支付结果查询，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

支付结果查询的方法：（没有使用小程序支付方法）
1. 定时器查询（轮询）setInterval+clearInterval

clearInterval：支付完成/失败, （不在查询页面的时候）onUnload、

2. webSocke连接

HTTP协议：一种无状态，无连接的，单向运用协议。

webSocke：html5提供的一种在单个TCP（传输控制协议）连接上进行的全双向通行的协议。

webSocket就是因为HTTP 协议无法实现服务器主动向客户端发起消息，虽然可以定时器，但是效率低，非常浪费资源，还要不停的连接产生的。

-----------http图解：

-----------webSocket图解：

小程序webSocket的运用实例：代码实例借鉴https://www.jianshu.com/p/d78f52498267

<!--index.wxml-->
<view class="container">
<view bindtap="bindViewTap" class="userinfo">
<image class="userinfo-avatar" src="{{userInfo.avatarUrl}}" background-size="cover"></image>
<text class="userinfo-nickname">{{userInfo.nickName}}</text>
</view>
<view class="voice">
<button type="primary" size="default" hover-class="button-hover" class="button-voice-play" bindtap="socketBtnTap">{{socktBtnTitle}}</button>
<button type="primary" size="default" hover-class="button-hover" class="button-voice-play" bindtap="sendMessageBtnTap">发送</button>
</view>
</view>

<!--index.js-->
//获取应用实例
var app = getApp()
var socketOpen = false
var socketMsgQueue = []
Page({
data: {
userInfo: {},
socktBtnTitle: '连接socket'
},
socketBtnTap: function () {
var that = this
var remindTitle = socketOpen ? '正在关闭' : '正在连接'
wx.showToast({
title: remindTitle,
icon: 'loading',
duration: 10000
})
if (!socketOpen) {
//创建一个 WebSocket 连接；
//一个微信小程序同时只能有一个 WebSocket 连接，如果当前已存在一个 WebSocket 连接，会自动关闭该连接，并重新创建一个 WebSocket 连接。
wx.connectSocket({
url: 'ws://域名'
})
//监听WebSocket错误
wx.onSocketError(function (res) {
socketOpen = false
console.log('WebSocket连接打开失败，请检查！')
that.setData({
socktBtnTitle: '连接socket'
})
wx.hideToast()
})
//监听WebSocket连接打开事件。
wx.onSocketOpen(function (res) {
console.log('WebSocket连接已打开！')
wx.hideToast()
that.setData({
socktBtnTitle: '断开socket'
})
socketOpen = true
for (var i = 0; i < socketMsgQueue.length; i++) {
that.sendSocketMessage(socketMsgQueue[i])
}
socketMsgQueue = []
})
//监听WebSocket接受到服务器的消息事件
wx.onSocketMessage(function (res) {
console.log('收到服务器内容：' + res.data)
})
//监听WebSocket关闭
wx.onSocketClose(function (res) {
socketOpen = false
console.log('WebSocket 已关闭！')
wx.hideToast()
that.setData({
socktBtnTitle: '连接socket'
})
})
} else {
//关闭WebSocket连接。
wx.closeSocket()
}
},
//事件处理函数
bindViewTap: function () {
wx.navigateTo({
url: '../logs/logs'
})
},
sendSocketMessage: function (msg) {
if (socketOpen) {
//通过 WebSocket 连接发送数据，需要先 wx.connectSocket，并在 wx.onSocketOpen 回调之后才能发送。
wx.sendSocketMessage({
data: msg
})
} else {
socketMsgQueue.push(msg)
}
},
sendMessageBtnTap: function () {
this.sendSocketMessage('小程序来了')
},
onLoad: function () {
console.log('onLoad')
var that = this
//调用应用实例的方法获取全局数据
app.getUserInfo(function (userInfo) {
//更新数据
that.setData({
userInfo: userInfo
})
})
}
})

连接socket 按钮绑定 socketBtnTap()
发送按钮绑定 sendMessageBtnTap()

首先定义了

var socketOpen = false
var socketMsgQueue = []

点击“连接socket ”按钮触发socketBtnTap()函数

socketOpen为true，wx.connectSocket建立连接

if (!socketOpen) {
//创建一个 WebSocket 连接；
//一个微信小程序同时只能有一个 WebSocket 连接，如果当前已存在一个 WebSocket 连接，会自动关闭该连接，并重新创建一个 WebSocket 连接。
wx.connectSocket({
url: 'ws://域名'
})
}

wx.onSocketOpen监听webSocket，首次连接的时候socketMsgQueue数组是空，for循环不执行

wx.onSocketOpen(function (res) {
console.log('WebSocket连接已打开！')
wx.hideToast()
that.setData({
socktBtnTitle: '断开socket'
})
socketOpen = true
for (var i = 0; i < socketMsgQueue.length; i++) {
that.sendSocketMessage(socketMsgQueue[i])
}
socketMsgQueue = []
})

然后点击“发送”按钮，调用sendMessageBtnTap()函数，然后for循环就可以执行

sendSocketMessage: function (msg) {
if (socketOpen) {
//通过 WebSocket 连接发送数据，需要先 wx.connectSocket，并在 wx.onSocketOpen 回调之后才能发送。
wx.sendSocketMessage({
data: msg
})
} else {
socketMsgQueue.push(msg)
}
},
sendMessageBtnTap: function () {
this.sendSocketMessage('小程序来了')
}

3. MQ（rabbitmq）当时做技术评审的时候没有使用这个，因为小程序不支持

我的理解原理大概是这样子