1、下载蚂蚁开发者工具(IDE)https://docs.alipay.com/mini/ide/download
创建一个空白项目,在app.json中引入相关的页面,我这边如下:
"pages": [
"pages/add-todo/add-todo",
"pages/todos/todos",
"pages/get-info/get-info",
"pages/pay/pay"
],
接下来在add-todo文件夹下的add-todo.axm<view class="page">
<web-view src="你的url" onMessage="onmessage"></web-view>
</view>
注意:所填url必须是https的2、以上已完成跳转你的外链网站;接下来我们通过用户授权获取用户的公开信息(获取用户信息我们必须跳回小程序拿authCode 去获取用户信息);想要跳回小程序 ,在你的html页面中head 中 引入
<script src="https://appx/web-view.min.js"></script>
同时编写方法
<script>
function navigateTo() {
my.navigateTo({
url: '/pages/get-info/get-info',
success: function (res) {
// window.alert('操作结果' + JSON.stringify(res));
}
})
}
</script>
在相应的按钮加入点击事件 onclick="navigateTo()"
(根据自己的需求)根据上面我们跳回的是get-info
在get-info.js中
const app = getApp();
Page({
data: {
inputValue: '',
},
onLoad() {
my.getAuthCode({
scopes: 'auth_user',
success: function(res) {
var authcode=res.authCode
my.httpRequest({
url: 'https://处理用户信息地址?auth_code='+authcode,
method: 'POST',
data: {},
dataType: 'json',
success: function(res) {
var url="https://你想要的跳转地址/"
my.navigateTo({
url: '/pages/todos/todos?url='+url
})
},
fail: function(res) {
var url="https://你想要的跳转地址/"
my.navigateTo({
url: '/pages/todos/todos?url='+url
})
}
})
},
fail:function() {
var url="https://你想要的跳转地址/"
my.navigateTo({
url: '/pages/todos/todos?url='+url
})
},
});
},
add() {
app.todos = app.todos.concat([{
text: this.data.inputValue,
compeleted: false,
}]);
my.navigateBack();
},
});
接下来处理用户信息(下载支付宝官方服务器端SDK 里面有所有接口方法https://docs.open.alipay.com/54/103419/下载后放入vendor中appalipay文件夹下) public function getuserinfo(){
$code = I('get.auth_code');
//APPID
$appid = '小程序appid';
//私钥 文件名(rsa_private_key.pem)
$rsaPrivateKey = "";
//公钥 文件名 (rsa_public_key.pem)
$alipayrsaPublicKey = "";
//初始化
$aop = new \AopClient();
$aop->gatewayUrl = 'https://openapi.alipay.com/gateway.do';
$aop->appId = $appid;
$aop->rsaPrivateKey = $rsaPrivateKey;
$aop->format = 'json';
$aop->charset = 'UTF-8';
$aop->signType = 'RSA2';
$aop->alipayrsaPublicKey = $alipayrsaPublicKey;
$aop->apiVersion = '1.0';
$request = new \AlipaySystemOauthTokenRequest();
$request->setGrantType("authorization_code");
$request->setCode($code);
$result = $aop->execute($request);
$responseNode = str_replace(".", "_", $request->getApiMethodName()) . "_response";
$resultData = (array) $result->$responseNode;
//获取用户信息
$request = new \AlipayUserInfoShareRequest ();
$result = $aop->execute ( $request , $resultData['access_token'] );
$responseNode = str_replace(".", "_", $request->getApiMethodName()) . "_response";
$userData = (array) $result->$responseNode;
//var_dump($userData);//用户公开信息
//此处做用户信息的落库处理
echo json_encode($str);//必须给小程序返回值否则无法执行成功失败方法
}
3、接入支付(支付宝小程序支付使用的是支付宝app支付)同样的支付需要跳转回小程序内进行支付原理和第二步相同 在处理相应要吊起支付的html文件中引入
<script src="https://appx/web-view.min.js"></script>
同样编写方法 <script>
function navigateTo() {
my.navigateTo({
url: '/pages/pay/pay',
success: function (res) {
// window.alert('操作结果' + JSON.stringify(res));
}
})
}
</script>
此次跳转的方法是pay在pay.js中
const app = getApp();
Page({
data: {},
onLoad() {
my.httpRequest({
url: 'https://从服务器端获取支付所需数据的接口地址',
method: 'POST',
data: {},
dataType: 'json',
success: function(res) {
var ali=res.data.data;
my.tradePay({
orderStr: ali, //完整的支付参数拼接成的字符串,从服务端获取,具体是方法请参考小程序开发文档
success: (res) => {
if(res.resultCode==9000){
var url="https://支付成功跳转地址"
my.navigateTo({
url: '/pages/todos/todos?url='+url
})
}else{
var url="https://支付失败跳转地址"
my.navigateTo({
url: '/pages/todos/todos?url='+url
})
}
},
fail: (res) => {
console.log(res)
var url="https://吊起支付失败跳转地址"
my.navigateTo({
url: '/pages/todos/todos?url='+url
})
},
});
},
fail: function(res) {
console.log(res)
my.alert({content: JSON.stringify(res)});
}
});
},
onShow() {
},
addTodo() {
},
});
服务器组装小程序支付所需数据接口 public function sign(){
vendor('appalipay.AopSdk');// 加载类库
$config = array(
'appid' =>'小程序appid',//商户密钥
'rsaPrivateKey' =>'',//私钥
'alipayrsaPublicKey'=>'',//公钥
'charset'=>strtolower('utf-8'),//编码
'notify_url' =>'回调验签地址',//回调地址(支付宝支付成功后回调修改订单状态的地址)
'payment_type' =>1,//(固定值)
'seller_id' =>'支付宝账号',//收款商家账号
'charset' => 'utf-8',//编码
'sign_type' => 'RSA2',//签名方式
'timestamp' =>date("Y-m-d H:i:s"),
'version' =>"1.0",//固定值
'url' => 'https://openapi.alipay.com/gateway.do',//固定值
'method' => 'alipay.trade.app.pay',//固定值
);
//构造业务请求参数的集合(订单信息)
$body = '自己业务定义';
$title = '自己业务定义';
$price = 0.01;//测试数据1分
$content = array();
$content['body'] = $body;
$content['subject'] = $title;//商品的标题/交易标题/订单标题/订单关键字等
$content['out_trade_no'] = 自己组装的订单号;//商户网站唯一订单号
$content['timeout_express'] = '1d';//该笔订单允许的最晚付款时间
$content['total_amount'] = floatval($price);//订单总金额(必须定义成浮点型)
$content['seller_id'] = '支付宝账号';//收款人账号
$content['product_code'] = 'QUICK_MSECURITY_PAY';//销售产品码,商家和支付宝签约的产品码,为固定值QUICK_MSECURITY_PAY
$content['store_id'] = '001';//商户门店编号
$con = json_encode($content);//$content是biz_content的值,将之转化成字符串
//公共参数
$param = array();
$Client = new \AopClient();//实例化支付宝sdk里面的AopClient类,下单时需要的操作,都在这个类里面
$param['app_id'] = $config['appid'];//支付宝分配给开发者的应用ID
$param['method'] = $config['method'];//接口名称
$param['charset'] = $config['charset'];//请求使用的编码格式
$param['sign_type'] = $config['sign_type'];//商户生成签名字符串所使用的签名算法类型
$param['timestamp'] = $config['timestamp'];//发送请求的时间
$param['version'] = $config['version'];//调用的接口版本,固定为:1.0
$param['notify_url'] = $config['notify_url'];//支付宝服务器主动通知地址
$param['biz_content'] = $con;//业务请求参数的集合,长度不限,json格式
//生成签名
$paramStr = $Client->getSignContent($param);
$sign = $Client->alonersaSign($paramStr,$config['rsaPrivateKey'],'RSA2');
$param['sign'] = $sign;
$str['data'] = $Client->getSignContentUrlencode($param);
echo json_encode($str);
}
4、注:小程序中使用todos作用跳转地址的中转在todos.axm
<view class="page">
<web-view src="{{url}}" onMessage="onmessage"></web-view>
</view>
在todos.js中加入const app = getApp();
Page({
data: {
url:""
},
onLoad(option) {
var that=this;
console.log(option)
var url=option.url;
this.setData({ url: url });
},
onShow() {
},
});
5、最后是支付宝的回调验签并处理业务逻辑 public function validate(){
require_once './ThinkPHP/Library/Vendor/appalipay/aop/AopClient.php';
require_once './ThinkPHP/Library/Vendor/appalipay/aop/request/AlipayTradeAppPayRequest.php';
$aop = new \AopClient();
$aop->alipayrsaPublicKey = '';//支付宝公钥
$flag = $aop->rsaCheckV1($_POST, NULL, "RSA2");
//实际返回参数参考https://docs.open.alipay.com/204/105301/
if($flag){
//此处处理业务逻辑
echo "success";//一定要返回success否则支付宝后台会一直相应此地址
}
}
}
注:支付宝开放平台配置要将你的业务域名添加进白名单 登录支付宝开服平台 -> 开发者中心 -> 小程序 -> 设置 -> httpRequest接口请求域名白名单 & H5域名配置 都要添加上
有什么不明白可详细阅读官方文档或私信我