### JSAPI 接口
* * *
JSAPI 接口使用前，请在后台设置支付目录
JSAPI 接口请求步骤：
1. 参照《获取 OPENID》章节，获得 OPENID
2. 通过该 api 构造订单参数获取 jsapi 支付参数
3. 通过 jssdk 或 WeixinJsBridge 方式自行发起支付
4. 服务端接收异步通知
* * *
请求地址：[https://mch.xiaoweijufu.com/wxpay/jsapi](https://mch.xiaoweijufu.com/wxpay/jsapi)
请求参数：
| 字段名称 | 字段类型 | 必填参数 | 说明 |
| --- | --- | --- | --- |
| mchid | string(16) | Y | 商户号 |
| total\_fee | int(16) | Y | 金额。单位：分 |
| out\_trade\_no | string(32) | Y | 用户端自主生成的订单号，在用户端要保证唯一性 |
| body | string(128) | N | 订单内容 |
| title | string(32) | N | 订单标题，非必填 |
| attach | string(127) | N | 用户自定义数据，在notify的时候会原样返回 |
| notify\_url | string(255) | N | 接收微信支付异步通知的回调地址。必须为可直接访问的URL，不能带参数、session验证、csrf验证。留空则不通知 |
| openid | string(32) | Y | 用户openid |
| access\_key | string(32) | Y | 用户对应access\_key |
| sign | string(32) | Y | 数据签名 详见[签名算法](http://help.xiaoweijufu.com/1368912) |
请求返回：
| 字段名称 | 字段类型 | 必填参数 | 说明 |
| --- | --- | --- | --- |
| order\_no | string(16) | Y | 小微聚付 平台订单号 |
| out\_trade\_no | string(16) | Y | 用户生成的订单号原样返回 |
| jsapi\_parameters | string(255) | N | 用于发起支付的支付参数 |
* * *
JSAPI 请求 DEMO:
~~~
<?php
class PayapiHelper {
private $url = 'https://mch.xiaoweijufu.com/wxpay/jsapi';
private $access_key = 'xxxxxx'; // 填写通信Key
private $secret_key = 'xxxxxx'; // 填写通信secret
public function __construct($data=null) {
$this->data = $data;
}
public function pay(){
$data = $this->data;
$data['access_key'] = $this->access_key;
$data['sign'] = $this->sign($data);
return $this->post($data, $this->url);
}
public function post($data, $url) {
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $data);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 0);
$rst = curl_exec($ch);
curl_close($ch);
return $rst;
}
// 签名方法
private function sign(array $attributes) {
ksort($attributes);
$sign = strtoupper(md5(urldecode(http_build_query($attributes)).'&key='.$this->secret_key));
return $sign;
}
}
$order = [
'mchid' => 'xxxxx', //商户号
'total_fee' => 120,
'out_trade_no' => time(),
'body' => 'test', // 订单说明
'openid' => 'xxxxxxxxxxx', // 通过openid接口获取到的openid
];
$payapi = new PayapiHelper( $order );
$re = $payapi->pay();
// 返回结果中包含`jsapi\_parameters`字段，该字段的值即是前端发起时所需的6个支付参数
print_r($re);
~~~
前端发起支付演示代码:
~~~
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<meta name="format-detection" content="email=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<link href="https://cdn.bootcss.com/weui/1.1.2/style/weui.min.css" rel="stylesheet">
<script src="https://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
</head>
<body style="padding:20px;">
<a href="javascript:;" class="weui-btn weui-btn_primary" id="payBtn">微信支付</a>
</body>
<script>
if (typeof WeixinJSBridge == "undefined") {
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
} else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
}
}
function onBridgeReady() {
WeixinJSBridge.call('hideOptionMenu');
}
$('#payBtn').on('click', function () {
WeixinJSBridge.invoke(
'getBrandWCPayRequest', {
// 以下6个支付参数通过payjs的jsapi接口获取
// **************************
"appId": "wxc5205a653b0259ac",
"timeStamp": "15100000000",
"nonceStr": "9cJEu27X6KehHGM8",
"package": "prepay_id=wx162234040923141245861167",
"signType": "MD5",
"paySign": "D64EF3ADBCA224E435D321619710C008"
// **************************
},
function (res) {
if (res.err_msg == "get_brand_wcpay_request:ok") {
WeixinJSBridge.call('closeWindow');
}
}
);
});
</script>
~~~
