00:01
下面呢,我们继续来开发微信支付功能,咱们目前呢,已经可以生成了微信支付的二维码,然后咱们下面一扫描二维码来实现后面的操作,那后面怎么做呢?咱们来看一下啊,之前给大家分析过,当我们生成了微信扫描的二维码之后,我们用微信进行支付。而支付之后呢,咱们可以每隔一段时间去调用一次支付状态的接口,查询一下是否成功,如果成功的话,我们来更新订单状态,支付记录的这么一个修改,包括调用医院那边的接口实现订单进行更新,所以咱们下面来做这个事情,那咱们目前呢,就来实现里边的这部分,每隔一段时间去调一次微信支付状态接口,这接口咱们就会来实现,现在我先把前端写出来,每个人时间去调一次这个接口,那下面把这个来写一下,咱们在里边做一下开发。
01:06
首先我们在微信这个JS里边,先把这个查询支付状态的接口在里边先做个定义,然后一会儿我们来进行开发,然后写一下查询支付状态的接口。那这里边呢,我就从课件中把这个方法给各位直接复制过来,咱们一会儿编写这个句接口,这个方法就叫做query pay thes里边根据订单ID,然后得到你这个支付状态,状态可能是支付中,或者支付失败,或者支付成功,这是我们做的第一个定义,然后定义之后呢,我们来到这个页面中,页面中大家看啊,之前咱们生成二维码的时候呢,我们调用的是这个。T这个方法,然后在方法中我们做了这么一个处理,当这里边返回值就是这个配OBBG里边有我们二维码的信息,如果说这个值等于空,那我们提着它支付失败,如果它不等于空,我们就来做。刚才咱说这个事情,那我写一下啊,比如现在我们约定我们做一个操作,咱就实现,比如说这个每隔三秒钟去调用一次查询支付状态的这么一个。
02:27
接口,然后得到我们的支付状态,现在我们来做这个事情,那每隔三秒这怎么做呢?之前呢,咱们曾经写过一个倒计时的方法,里边用JS中一个方法叫定时器的方法,它叫做set interval,所以咱们现在用set interval把这个可以做到。那这个怎么写,给大家写一下啊,首先我们加个方法,叫做set interval。然后在这方法中呢,有这么一个结构,第一部分结构中写上咱们的JS方法,然后下面结构中将你的间隔时间,因为咱是每隔三秒,所以里边我加上一个3000,它就表示3000毫秒,在中间部分来调用咱们这个就是查询状态方法,那查询状态方法我在下面咱来写一下啊,写到这个位置。
03:26
查询支付状态的方法,那这个方法我起个名字就叫这个query。咱们把这个拿过来,然后在里边呢,传入咱们的订单的ID,在下面的调用咱们API中的方法,咱们是微信API里面这个query。把这方法给各位分过来,然后里边传入咱们那个订单号。我在里边传一下。
04:00
OID,然后除完之后加上一个点Z,加上一个response。箭头函数,咱们通过response得到里边的相应内容,比如说在里边呢,咱做判断,如果说它它的支付状态是支付中,那我们直接等待返回,如果不是支付中,那我们进行其他的操作,那这里边我来写一下,就在里边我们做个判断。点上这个。如果说这个值呢,我们叫做支付中,后面咱通过介绍会返回,如果支付中,那我们直接旅困,就让他继续进行查询,如果说它不是支付中,那这里边我们怎么做呢?大家注意啊,因为这个定时器呢,只要你执行,它会不断去执行,每隔三秒都会执行一次,当咱们已经支付成功之后,那我这个方法是不是就不需要再调用了,所以这个怎么做呢?咱们在这个就是set方法中有个返回值,就是咱起名叫这个time。
05:12
那这里边写一下,就是它有一个返回值,这次点time,如果说咱们让它不置行,那我们调一个方法,我写一下啊,在这里边写到咱们就可以清除这个定时器的效果,咱们加个方法叫可粒尔interval里边加上这个timer。把这个定效果给它清除掉,然后清除掉之后咱们把页面重新加载,就是来一个window.location点上这个reload,这个是我们做的这么一个查询支付状态方法,咱们来看一下啊,调用接口得到数据,如果它的值是支付中,那我们继续调用,如果它不是支付中,咱们清除定时器的效果,然后让页面重新加载,咱们在这个set interval中把这个方法我们做做个调用。
06:04
This,点上这个query thes里边传入这个order ID。所以咱们现在就把这个前端部分,我们就做到了每隔三秒去调下这个方法,最终实现我们里边这么一个功能。当然这里边大家看啊,当我关闭弹框的时候,它里边也把这定时器效果给它清除掉。这样的话前端我们就完成了,各位把这方法记住,Set interval,还有这个可wall,咱用它之前做过定时器的,包括这里边的倒计时的等等效果,这个我们就写完了,然后写完之后呢,下面咱就来开发里边那个相关的接口,也就这个查询支付状态接口,而这个查询支付状态接口咱们也是要去调用微信里边的接口把这做到,而这过程中咱们除了查询之外,还要去更新咱们订单的状态,包括去调用医院那边的接口,把这个信息做更新,那下面咱就开始把这个我们来做个实现。
我来说两句