全网最详细的uniapp微信支付教程,包含APP微信支付、微信内置浏览器支付、微信外h5支付


一、APP微信支付

效果预览

1、微信那边的配置
1、微信开放平台申请创建APP,并开通微信支付
(1)微信开放平台https://open.weixin.qq.com
在这里插入图片描述(2)不知道怎么申请和开通的小伙伴去百度一下,已获得支付能力会显示如图的“已获得”,没有微信支付能力的需要点击去申请,按流程进行申请。
在这里插入图片描述

(3)微信支付的APPID是这里申请的APPID,不要和其他的搞混淆了,想微信内置浏览器支付的APPID使用的是微信公众号的APPID。
(4)应用签名必须要填写正确,不然找几天也找不到报错原因

在这里插入图片描述
下载签名生成工具

https://developers.weixin.qq.com/doc/oplatform/Downloads/Android_Resource.html
在这里插入图片描述
(5)安装到手机上,打开后输入app的报名就可以获取了,需要注意的是这个app要是正式打包的才能获取,这个值要填到第三步那里

(6)微信支付操作证书获取可按这个操作流程进行:

https://www.sohu.com/a/234912109_100142931
证书下载下来要存到代码目录里面去,在支付配置的这里要用到

在这里插入图片描述

2、微信支付之前就要生成自己的订单了,也就是存在自己服务器的订单。

//每个人的请求方式封装不一样,可忽略this.$u.api...
this.$u.api.submitOrder({
   
    good_name: _that.bjInfo.name,
    good_id: _that.bjInfo.id,
    user_id: _that.userId,
    address_id: _that.addressInfo.id,
    total: _that.bjInfo.price,
    paymethod: _that.isWechat ? 0 : 1,
    buyType: _that.buyType,
}).then(res => {
   
    console.log(res)
    //这里自己的订单生成成功了,可以调用微信支付了,把下面的微信支付代码封装到一个方法里面在这里调用即可

    //#endif

}).catch(err => {
   
    this.$refs.uToast.show({
   
        title: err.data.msg,
    })
    console.log(err)
})
console.log('微信支付')
//第一步调用后台微信支付接口,一般传参是三个out_trade_no、good_name、total_fee
//这个接口返回所有前端唤起微信支付的所有参数
/**前端需要的参数
let obj = {
		appid: '',
		noncestr: '',
		package: '', // 固定值,以微信支付文档为主
		partnerid: '',
		prepayid: '',
		timestamp: '',
		sign: '' // 根据签名算法生成签名
	};
**/
_that.$u.api.wxPay({
   
	out_trade_no: order.out_trade_no,
	good_name: order.good_name,
	total_fee: order.total_fee,
}).then(res => {
   
	console.log(res)
	let obj = {
   
		appid: res.data.appid,
		noncestr: res.data.noncestr,
		package: res.data.package, // 固定值,以微信支付文档为主
		partnerid: res.data.partnerid,
		prepayid: res.data.prepayid,
		timestamp: res.data.timestamp,
		sign: res.data.sign // 根据签名算法生成签名
	};

	let orderInfo = JSON.stringify(obj);
	// console.log(orderInfo);
	console.log(orderInfo);
	uni.requestPayment({
   
		provider: 'wxpay',
		orderInfo: orderInfo, //微信、支付宝订单数据
		success: res => {
   
		_that.editOrderStatus(order);
	
	},
	fail: function(err) {
   
		_that.$u.route('/pages/payresult/payresult', {
   
		out_trade_no: order.out_trade_no
	})
	console.log('fail:' + JSON.stringify(err));
}
});

3、我的后端是TP6,我选的插件是Yansongdapay
我安装的是2版本,3版本我看作者还在更新,就没用,安装代码如下:

composer require yansongda/pay:~v2.10.2 -vvv
<?php

declare(strict_types=1);

namespace app\websit\controller;

use think\facade\Cache;
use think\facade\View;
use think\facade\Session;
use think\facade\Log;
use app\websit\BaseController;
use think\exception\Handle;
use Yansongda\Pay\Pay;
use think\facade\Db;
use think\facade\Config;

class Wxpay extends BaseController
{
   

    public function submitOrder()
    {
   
        if ($this->request->isPost()) {
   
           //对应上面第一步先创建自己的订单存起来,具体逻辑自己写一下
        } else {
  • 15
    点赞
  • 188
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 23
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 23
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

程序员张礼奎

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值