# 小程序支付常见问题
请注意
针对微信支付,您也可以使用 FinClip 提供的关联微信小程序支付功能,降低开发成本,快速复用微信支付能力。点击这里了解能力
由于 FinClip 小程序是运行在微信以外的集成了 FinClip 小程序 SDK 的第三方APP,故不能使用原来在微信小程序中已经实现的微信支付;而是先让第三方 APP 接入微信支付的能力,然后再由小程序调起APP的微信支付能力,最后跳转至微信完成支付。
具体实现步骤如下:
# 1. APP 接入微信支付
首先APP需要接入微信支付能力:微信支付支持在开放平台 (opens new window)注册并完成认证的移动端应用APP接入支付功能。APP接入支付后,商户通过微信提供的SDK调用微信支付模块完成收款需求。
iOS Phone)。详情说明请参考微信支付APP接入介绍 (opens new window)和指引文档 (opens new window)。
# 2. APP 实现自定义注入接口
APP集成了微信支付的能力后,需要开发者注册自定义接口将支付能力注入至SDK中,让小程序能调用,详细说明如下。
# 2.1 Android端
注册自定义小程序接口的具体说明请参照FinClip小程序开放平台-自定义小程序接口
- 自定义Api类,实现AbsApi接口,指定api名称为"requestPayment"。
public class WxPayApi extends AbsApi {
private final Context context;
public WxPayApi(Context context) {
this.context = context;
}
private static final String API_NAME_REQUEST_PAYMENT = "requestPayment";
@Override
public String[] apis() {
return new String[]{API_NAME_REQUEST_PAYMENT};
}
// ...
}
- 注册自定义Api类。
if (FinAppClient.INSTANCE.isFinAppProcess(this)) {
return;
}
// SDK初始化结果回调,用于接收SDK初始化状态
FinCallback<Object> callback = new FinCallback<Object>() {
@Override
public void onSuccess(Object result) {
// SDK初始化成功,注册自定义小程序接口
FinAppClient.INSTANCE.getExtensionApiManager().registerApi(new WxPayApi(DemoApp.this));
}
// ...
};
- 实现自定义Api类invoke()方法,在invoke方法内调用后台下单接口,下单成功后调起微信支付。
@Override
public void invoke(String event, JSONObject param, ICallback callback) {
if (API_NAME_REQUEST_PAYMENT.equals(event)) {
IWXAPI wxApi = WXAPIFactory.createWXAPI(context, null);
// 判断是否安装了微信
if (!wxApi.isWXAppInstalled()) {
JSONObject result = new JSONObject();
try {
result.put("errMsg", "WeChat not installed");
} catch (JSONException e) {
e.printStackTrace();
}
callback.onFail(result);
return;
}
// 调用后台下单接口,拿到调起微信支付所需参数,此处省略,开发者请自行实现
// ...
PayReq request = new PayReq();
request.appId = Constants.WX_APP_ID;
request.partnerId = mchid;
request.prepayId = prepayId;
request.packageValue = "Sign=WXPay"; // 微信订单详情扩展字符串,暂填写固定值Sign=WXPay
request.nonceStr = nonceStr; // 随机字符串,不长于32位
request.timeStamp = timeStamp;
request.sign = sign;
wxApi.sendReq(request); // 调起微信支付
}
}
- 在微信支付信息回调WXPayEntryActivity,结果回调方法内利用自定义api invoke方法参数callBack对象将支付结果返回给小程序。
public class WXPayEntryActivity extends Activity implements IWXAPIEventHandler {
// ...
@Override
public void onResp(BaseResp resp) {
if (resp.getType() == ConstantsAPI.COMMAND_PAY_BY_WX) {
WxPayApi.notifyPayResult(resp.errCode);
finish();
}
}
}
public class WxPayApi extends AbsApi {
// ...
private static ICallback callback;
public static void notifyPayResult(int errCode) {
if (callback != null) {
if (errCode == 0) {
callback.onSuccess(null);
} else {
JSONObject result = new JSONObject();
try {
result.put("errCode", errCode);
} catch (JSONException e) {
e.printStackTrace();
}
callback.onFail(result);
}
WxPayApi.callback = null;
}
}
@Override
public void onDestroy() {
super.onDestroy();
callback = null;
}
@Override
public void invoke(String event, JSONObject param, ICallback callback) {
if (API_NAME_REQUEST_PAYMENT.equals(event)) {
WxPayApi.callback = null;
// ...
}
}
}
- FinClip还提供了官方的安卓APP Demo 工程和小程序 (opens new window)作为示范,如有需求,您可以前往下载体验。
# 2.2 iOS 端
- 在原生App中调用SDK的注入requestPayment方法,requestPayment是微信小程序对应的支付方法名。
__weak typeof(self) weakSelf = self;
[[FATClient sharedClient] registerExtensionApi:@"requestPayment" handle:^(id param, FATExtensionApiCallback callback) {
// 下单-支付调用,调用结果通过回调通告小程序
[weakSelf getTestPayment:callback];
}];
- 模拟下单、支付
// 支付时,支付的回调是异步的,故这里将小程序的回调持有,在适当的时机调用(用户可根据自己的场景自行实现自己调用的逻辑)
@property (nonatomic, copy) FATExtensionApiCallback callback;
- (void)getTestPayment:(FATExtensionApiCallback)callback {
NSString *urlString = @"https://xxx.example.com/api/order"; // 下单接口,模拟下单
NSURL *url = [NSURL URLWithString:urlString];
NSMutableURLRequest *requset = [NSMutableURLRequest requestWithURL:url];
requset.HTTPMethod = @"POST";
__weak typeof(self) weakSelf = self;
NSURLSessionTask *task = [[NSURLSession sharedSession] dataTaskWithRequest:requset completionHandler:^(NSData * _Nullable data, NSURLResponse * _Nullable response, NSError * _Nullable error) {
NSHTTPURLResponse *httpResponse = (NSHTTPURLResponse *)response;
if (httpResponse.statusCode == 200) {
// 下单成功后,模拟微信支付
PayReq *request = [[PayReq alloc] init];
request.partnerId = @"partnerId";
request.prepayId = @"prepayId";
request.package = @"Sign=WXPay";
request.nonceStr = @"nonceStr";
request.timeStamp = 100000;
request.sign= @"sign";
dispatch_async(dispatch_get_main_queue(), ^{
[WXApi sendReq:request completion:^(BOOL success) {
if (success) {
// 唤起微信成功时,将回调持有,方便后面使用(这里实现方式可以自行定义,此处只是模拟)
weakSelf.callback = callback;
} else {
// 唤起微信失败时,直接调用回调,传入失败
callback(FATExtensionCodeFailure, nil);
}
}];
});
return;
}
callback(FATExtensionCodeFailure, nil);
}];
[task resume];
}
- 微信支付成功时,回调处理
#pragma mark - WXApiDelegate
//发起支付请求回调
- (void)onReq:(BaseReq *)req {
}
//支付结果回调
- (void)onResp:(BaseResp *)resp {
if ([resp isKindOfClass:[PayResp class]]) {
PayResp *response = (PayResp*)resp;
//response.errCode
// WXSuccess = 0, /**< 成功 */
// WXErrCodeCommon = -1, /**< 普通错误类型 */
// WXErrCodeUserCancel = -2, /**< 用户点击取消并返回 */
// WXErrCodeSentFail = -3, /**< 发送失败 */
// WXErrCodeAuthDeny = -4, /**< 授权失败 */
// WXErrCodeUnsupport = -5, /**< 微信不支持 */
switch (response.errCode) {
case WXSuccess: // 支付成功时,回调调用
self.callback(FATExtensionCodeSuccess, nil);
break;
default: // 支付失败时,回调调用
self.callback(FATExtensionCodeFailure, nil);
break;
}
}
}
请注意
小程序支付api requestPayment的回调,需要用户进行维护。因为支付功能是异步的,需要在支付成功或失败的回调中,调用小程序支付api requestPayment的回调。
这里伪代码使用当前类持有小程序支付api requestPayment的回调,在支付功能的回调中进行调用。用户可以根据自己的场景需求,使用其他技术进行处理。
- FinClip还提供了官方的iOS APP Demo 工程和小程序 (opens new window)作为示范,您可以前往下载体验。
# 3. 小程序实现接口的调用
移动端相关 api 准备好后,在小程序中使用代码如下:
// 小程序中调用代码
wx.requestPayment({
success: (res) => {
console.log('payment success', res)
},
fail: (res) => {
console.log('payment fail', res.errMsg)
}
})
# 4. 小程序接入支付宝支付
FinClip小程序接入支付宝支付的步骤与接入微信支付的步骤基本一致,此处不再赘述,APP接入支付宝支付请参考文档支付宝支付接入文档 (opens new window)。