一、背景
开发微信小程序时，涉及到微信支付的开发环节，特此记录一下
二、前提
2.1、注册微信支付商户号
官方注册地址👉👉：接入微信支付 - 微信商户平台
备注：此商户号为超级管理员，一般由更上级领导进行注册( 非前端人员注册 )，会成为公司收款账户，主要填写超管信息并上传企业资料(如：营业执照，对公银行账户信息，法人身份证)
2.2、小程序关联商户号
微信公众平台地址👉👉：微信公众平台
已注册的小程序，登录微信公众平台，在左侧功能项找到微信支付，选择商户号管理，将小程序与商户号关联
如果已经关联了，就会显示已关联的商户号信息👇
三、微信支付流程
3.1、微信官方支付流程图
官网地址👉👉：pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_4&index=3
四、具体实现
4.1、获取OpenID
OpenID是用户唯一标识，通过临时登录凭证 code 换取的(登录凭证code，5分钟有效期)，通过code向后端接口获取OpenID
<script>
import {
getBindSocial,wxLogin_api
} from "@/action/action";
import {
MINITYPE
} from '@/constants/hostConfig';
export default{
data() {
return {
phone: '',
}
},
methods: {
wexin_login(){
wx.login({
success: (res) =>{
console.log(res.code,'code')
let userCode = res.code
//将code传递给服务器
getBindSocial({
jscode: userCode,
type: MINITYPE,
}).then(res =>{
console.log('res',res);
//将code传递给接口会返回openid，unionid，phone
})
}
})
}
},
}
</script>
4.2、调用预支付接口获取支付核心数据
将获取的openid与接口需要携带的参数，调用接口，获取支付核心数据
4.3、调用微信官方支付接口 wx.requestPayment()，弹出支付界面
微信支付接口地址👉👉：wx.requestPayment(Object object) | 微信开放文档
将 wx_advance_pay()接口返回的数据对象，作为wx.requestPayment()参数值，得到支付结果👇
调用后，会弹出付款界面，微信开发者工具需要扫码支付
如果是手机支付会弹出微信付款界面，支付完成后会收到账单信息
