第三方 登录 、支付 uni-app、小程序流程

uni-app

登录流程

1. 获取微信appid和密钥
2. 获取appid后，在manifest.json中配置小程序的appid

支付流程(微信支付)

1. 微信开放平台申请支付appid（分享、登录）
2. 填写manifest配置文件
3. 登录拿到code
4. code订单信息（价格）发送给后端
5. 请求成功拿到paymen对象（timestamp时间戳、noceStr、package,paysign支付指纹）4
6. 通过支付api requestPayment发起支付

  weixinPay() {
                console.log("发起支付");
                this.loading = true;
                uni.login({
                    success: (e) => {
                        console.log("login success", e);
                        uni.request({
                            url: `https://unidemo.dcloud.net.cn/payment/wx/mp?code=${e.code}&amount=${this.price}`,
                            success: (res) => {
                                console.log("pay request success", res);
                                if (res.statusCode !== 200) {
                                    uni.showModal({
                                        content: "支付失败，请重试！",
                                        showCancel: false
                                    });
                                    return;
                                }
                                if (res.data.ret === 0) {
                                    console.log("得到接口prepay_id", res.data.payment);
                                    let paymentData = res.data.payment;
                                    uni.requestPayment({
                                        timeStamp: paymentData.timeStamp,
                                        nonceStr: paymentData.nonceStr,
                                        package: paymentData.package,
                                        signType: 'MD5',
                                        paySign: paymentData.paySign,
                                        success: (res) => {
                                            uni.showToast({
                                                title: "感谢您的赞助!"
                                            })
                                        },
                                        fail: (res) => {
                                            uni.showModal({
                                                content: "支付失败,原因为: " + res
                                                    .errMsg,
                                                showCancel: false
                                            })
                                        },
                                        complete: () => {
                                            this.loading = false;
                                        }
                                    })
                                } else {
                                    uni.showModal({
                                        content: res.data.desc,
                                        showCancel: false
                                    })
                                }
                            },
                            fail: (e) => {
                                console.log("fail", e);
                                this.loading = false;
                                uni.showModal({
                                    content: "支付失败,原因为: " + e.errMsg,
                                    showCancel: false
                                })
                            }
                        })
                    },
                    fail: (e) => {
                        console.log("fail", e);
                        this.loading = false;
                        uni.showModal({
                            content: "支付失败,原因为: " + e.errMsg,
                            showCancel: false
                        })
                    }
                })
            },

小程序

流程

1. wx.login 获取到code
2. 通过 open-type="getUserInfo"获取到头像、用户名等信息
3. 把code通过ajax发送给服务器
4. 服务器通过appid+appsecret+code 换取openid和session_key
5. 把openid+用户名、昵称存入服务
   器数据库中
6. 自定义用户信息，登录状态

程序端

• bindgetuserinfo需要用户弹框授权 拿到头像、用户名…

 <button open-type="getUserInfo" bindgetuserinfo="getUserInfo"></button>

• wx.login方法 只能拿到code信息 通过ajax把用户信息和code发送给服务器

服务器端

• 把appid+appsecret+code 发送到微信服务器

微信服务器

• 得到openid(用户的唯一识别id)、session_key
• 有了openid+用户名、昵称存入服务器数据库中
  

支付流程

一、 用户下单

• 后端获取openid
• 生成订单
• 调用支付下单api
• 返回一个预付订单prepay_id
• 后端签名
• 返回给小程序让用户确认

二、 用户确认订单

三、返回支付结果

• 展示支付结果
• 微信后端通知商户后台
• 商户后台可以查询订单信息
  -