长夜漫漫,无心睡眠。
起身打开电脑,有种强烈的想写东西的欲望。脑袋里把最近做的需求过了一遍,让我最吃足苦头的还是微信支付,不是说有多难,而是坑太多,防不胜防,具体遇到的坑后续总结后再一并更新。
第一次做微信开发,第一次做微信支付,没办法,硬着头皮来,边看文档边思考整个逻辑,等到整个流程过了一遍后,就开始着手撸代码了。
唯有代码才能抑制我的洪荒之力。。Come on!!!
Config参数配置(配置成功可略过此步)
<?php
error_reporting(E_ALL || ~E_NOTICE);
header("Content-type:text/html; charset=utf-8");
require_once "sdk/jssdk.php";
$jssdk = new JSSDK(appId, 密钥);
$signPackage = $jssdk->GetSignPackage();
?>
//通过config接口注入权限验证配置
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '<?php echo $signPackage["appId"];?>',
timestamp: '<?php echo $signPackage["timestamp"];?>',
nonceStr: '<?php echo $signPackage["nonceStr"];?>',
signature: '<?php echo $signPackage["signature"];?>',
jsApiList: ['getBrandWCPayRequest'] // 必填,需要使用的JS接口列表
});
建议debug开启调试模式,config配置提示成功后,开始进入主题。
网页授权获取openid
由于微信支付需要用户openid,而获取openid则需要进行网页授权,将获取到的openid存入cookie中,避免每次请求都要进行一次授权来获取openid。
1.授权用静默授权即可,首先获取code
https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
如果用户同意授权,页面将跳转至 redirect_uri/?code=CODE&state=STATE。若用户禁止授权,则重定向后不会带上code参数,仅会带上state参数redirect_uri?state=STATE
2.获取code后,请求以下链接获取access_token:
https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code
请求成功后,返回的数据中可获得openid,进而可进行下一步的支付。
微信支付关键点是要获取到openid。
以下为代码实现:
$(function(){
var openId="";
var code="";
//获取openId
openId=getcookie('openId');
_code = getQueryString('code');
if (openId==null){
if(_code==null){
var fromurl = location.href;
var url="https://open.weixin.qq.com/connect/oauth2/authorize?appid=公众号ID&redirect_uri="+encodeURIComponent(fromurl)+"&response_type=code&scope=snsapi_base&state=123#wechat_redirect";
window.location.href=url;
}else{
$.ajax({
url: serverUrl+"api/webpay.openid?_v=1.3.4&code="+_code,
type: "get",
async:false,
cache:false,
dataType:'json',
success: function (result) {
if (result.data != null && result.data.hasOwnProperty('openid') && result.data.openid !=""){
openId = result.data.openid;
addcookie("openId",openId,36000);
//进行支付逻辑...
}else{
location.href(fromurl);
}
}
});
}
}else{
openId = getcookie('openId');
//进行支付逻辑...
}
})
//获取code参数
function getQueryString(name) {
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
var r = window.location.search.substr(1).match(reg);
if (r != null) {
return unescape(r[2]);
}
return null;
}
function addcookie(name,value,expireHours){
var cookieString=name+"="+escape(value)+"; path=/";
//判断是否设置过期时间
if(expireHours>0){
var date=new Date();
date.setTime(date.getTime+expireHours*3600*1000);
cookieString=cookieString+"; expire="+date.toGMTString();
}
document.cookie=cookieString;
}
function getcookie(name){
var strcookie=document.cookie;
var arrcookie=strcookie.split("; ");
for(var i=0;i<arrcookie.length;i++){
var arr=arrcookie[i].split("=");
if(arr[0]==name)return decodeURIComponent(arr[1]);
}
return null;
}