微信wx://和支付宝alipays://协议格式详解
一、支付宝alipays://协议
支付宝App
1. 概述
本文档提供支付宝App支付的Java服务端实现方法,重点关注入参和返回值,特别是官方返回值示例。实现基于支付宝官方文档,使用alipays协议拼接方式。
2. 使用环境
使用环境:
- APP内:
- WebView:支持通过WebView中的location.href跳转唤起支付宝APP
- Intent:支持通过Android原生Intent方式唤起支付宝APP
- 均支持:iOS和Android平台均可通过多种方式调用此协议
- 浏览器:支持在移动端浏览器中通过location.href跳转唤起支付宝APP
- 微信内:受限制,微信内置浏览器会拦截此协议
- 支付宝内:不适用,已在支付宝APP内无需再次唤起
3. 入参说明
支付宝App支付服务端接口主要需要以下参数:
参数名 | 类型 | 必填 | 说明 |
---|---|---|---|
appId | String | 是 | 应用ID,由支付宝开放平台分配 |
privateKey | String | 是 | 应用私钥,用于签名 |
alipayPublicKey | String | 是 | 支付宝公钥,用于验签 |
outTradeNo | String | 是 | 商户订单号,由商户自定义,64个字符内,仅支持字母、数字、下划线 |
totalAmount | String | 是 | 订单总金额,单位为元,精确到小数点后两位 |
subject | String | 是 | 订单标题 |
notifyUrl | String | 是 | 异步通知地址,支付宝服务器主动通知商户服务器里指定的页面http/https路径 |
4. 返回值说明
4.1 orderStr返回值
服务端调用alipay.trade.app.pay
接口后,会返回一个包含orderStr的字符串,该字符串需要传递给移动端,由移动端唤起支付宝客户端完成支付。
官方返回值示例:
perl
alipay_sdk=alipay-sdk-java-dynamicVersionNo&app_id=2014100900013000&biz_content=%7B%22timeout_express%22%3A%2230m%22%2C%22product_code%22%3A%22QUICK_MSECURITY_PAY%22%2C%22total_amount%22%3A%220.01%22%2C%22subject%22%3A%221%22%2C%22body%22%3A%22%E6%88%91%E6%98%AF%E6%B5%8B%E8%AF%95%E6%95%B0%E6%8D%AE%22%2C%22out_trade_no%22%3A%22IQJZSRC1YMQB5HU%22%7D&charset=utf-8&format=json&method=alipay.trade.app.pay¬ify_url=https%3A%2F%2Fapi.xx.com%2Freceive_notify.htm&sign_type=RSA2×tamp=2016-08-25%2020%3A26%3A31&version=1.0&sign=cYmuUnKi5QdBsoZEAbMXVMmRWjsuUj%2By48A2DvWAVVBuYkiBj13CFDHu2vZQvmOfkjE0YqCUQE04kqm9Xg3tIX8tPeIGIFtsIyp%2FM45w1ZsDOiduBbduGfRo1XRsvAyVAv2hCrBLLrDI5Vi7uZZ77Lo5J0PpUUWwyQGt0M4cj8g%3D
orderStr包含的关键参数:
app_id
: 开发者的应用IDbiz_content
: 业务请求参数的集合,最大长度不限,除公共参数外所有请求参数都必须放在这个参数中传递charset
: 请求使用的编码格式,如utf-8format
: 返回格式,如jsonmethod
: 接口名称,固定为 alipay.trade.app.paynotify_url
: 支付宝服务器主动通知商户服务器里指定的页面http/https路径sign_type
: 商户生成签名字符串所使用的签名算法类型,如RSA2timestamp
: 发送请求的时间version
: 调用的接口版本,固定为1.0sign
: 商户请求参数的签名串
4.2 alipays协议URL
使用alipays协议拼接后的URL格式为:
ini
alipay://alipayclient/h5PayUrl?h5_pay_url=<支付链接URL编码>
其中,h5_pay_url
参数需要进行URL编码。
5. Java实现示例
以下是一个简化的Java实现示例,重点展示入参和返回值:
java
/**
* 支付宝App支付Java实现示例
* 重点展示入参和返回值
*/
public class AlipayAppPayExample {
/**
* 生成支付宝App支付的orderStr
*
* 入参说明:
* @param appId 应用ID
* @param privateKey 应用私钥
* @param alipayPublicKey 支付宝公钥
* @param outTradeNo 商户订单号
* @param totalAmount 订单金额
* @param subject 订单标题
*
* 返回值:orderStr字符串,用于唤起支付宝App
*/
public static String getOrderStr(String appId, String privateKey, String alipayPublicKey,
String outTradeNo, String totalAmount, String subject) {
// 实际业务逻辑已省略
// 返回官方示例的orderStr
return "alipay_sdk=alipay-sdk-java-dynamicVersionNo&app_id=2014100900013000&biz_content=%7B%22timeout_express%22%3A%2230m%22%2C%22product_code%22%3A%22QUICK_MSECURITY_PAY%22%2C%22total_amount%22%3A%220.01%22%2C%22subject%22%3A%221%22%2C%22body%22%3A%22%E6%88%91%E6%98%AF%E6%B5%8B%E8%AF%95%E6%95%B0%E6%8D%AE%22%2C%22out_trade_no%22%3A%22IQJZSRC1YMQB5HU%22%7D&charset=utf-8&format=json&method=alipay.trade.app.pay¬ify_url=https%3A%2F%2Fapi.xx.com%2Freceive_notify.htm&sign_type=RSA2×tamp=2016-08-25%2020%3A26%3A31&version=1.0&sign=cYmuUnKi5QdBsoZEAbMXVMmRWjsuUj%2By48A2DvWAVVBuYkiBj13CFDHu2vZQvmOfkjE0YqCUQE04kqm9Xg3tIX8tPeIGIFtsIyp%2FM45w1ZsDOiduBbduGfRo1XRsvAyVAv2hCrBLLrDI5Vi7uZZ77Lo5J0PpUUWwyQGt0M4cj8g%3D";
}
/**
* 生成支付宝App支付的alipays协议URL
*
* 入参说明:
* @param orderStr 通过alipay.trade.app.pay接口获取的orderStr
*
* 返回值:alipays协议URL,用于唤起支付宝App
*/
public static String getAlipaysUrl(String orderStr) {
try {
// 对orderStr进行URL编码
String encodedOrderStr = java.net.URLEncoder.encode(orderStr, "UTF-8");
// 拼接alipays协议URL
return "alipay://alipayclient/h5PayUrl?h5_pay_url=" + encodedOrderStr;
} catch (Exception e) {
e.printStackTrace();
return null;
}
}
/**
* 主方法,演示调用过程
*/
public static void main(String[] args) {
// 示例参数
String appId = "2021000117650139";
String privateKey = "MIIEvQIBADANBgkqhkiG9w..."; // 应用私钥
String alipayPublicKey = "MIIBIjANBgkqhkiG9w0BA..."; // 支付宝公钥
String outTradeNo = "ORDER_20250521001"; // 商户订单号
String totalAmount = "88.88"; // 订单金额
String subject = "测试商品"; // 订单标题
// 1. 获取orderStr
String orderStr = getOrderStr(appId, privateKey, alipayPublicKey, outTradeNo, totalAmount, subject);
System.out.println("orderStr返回值示例:");
System.out.println(orderStr);
// 2. 获取alipays协议URL
String alipaysUrl = getAlipaysUrl(orderStr);
System.out.println("\nalipays协议URL:");
System.out.println(alipaysUrl);
}
}
6. 注意事项
- 支付订单是在用户输入支付密码后创建,并非唤起收银台时创建
- 订单实际创建时间以用户支付时间为准
- 私钥信息应妥善保管,不要硬编码在代码中
- 异步通知处理时必须验证签名,确保通知来自支付宝
- 使用Alipays协议时,需要对参数进行URL编码
7. 参考资料
2. 支付宝转账到账户
协议格式:
ini
alipays://platformapi/startapp?appId=09999988&actionType=toAccount&goBack=NO&amount=<金额>&userId=<收款方ID>&memo=<备注>
参数说明:
appId
:固定值09999988actionType
:固定值toAccountgoBack
:是否返回(YES/NO)amount
:转账金额userId
:收款方的支付宝IDmemo
:转账备注
使用环境:
- APP内:
- WebView:支持通过WebView中的location.href跳转唤起支付宝APP转账功能
- Intent:支持通过Android原生Intent方式唤起支付宝APP转账功能
- 均支持:iOS和Android平台均可通过多种方式调用此协议
- 浏览器:支持在移动端浏览器中通过location.href跳转唤起支付宝APP转账功能
- 微信内:受限制,微信内置浏览器会拦截此协议
- 支付宝内:不适用,已在支付宝APP内可直接调用转账功能
官方文档:
JavaScript实现示例:
javascript
/**
* 支付宝转账到账户唤起
*/
function alipayTransfer(userId, amount, memo) {
location.href = `alipays://platformapi/startapp?appId=09999988&actionType=toAccount&goBack=NO&amount=${amount}&userId=${userId}&memo=${encodeURIComponent(memo)}`;
}
3. 支付宝小程序跳转
协议格式:
xml
alipays://platformapi/startapp?appId=<小程序ID>&page=<页面路径>&query=<查询参数>
参数说明:
appId
:小程序IDpage
:要跳转的页面路径query
:查询参数,格式为key1=value1&key2=value2
使用环境:
- APP内:
- WebView:支持通过WebView中的location.href跳转唤起支付宝APP并打开小程序
- Intent:支持通过Android原生Intent方式唤起支付宝APP并打开小程序
- 均支持:iOS和Android平台均可通过多种方式调用此协议
- 浏览器:支持在移动端浏览器中通过location.href跳转唤起支付宝APP并打开小程序
- 微信内:受限制,微信内置浏览器会拦截此协议
- 支付宝内:支持在支付宝内通过此协议直接跳转至其他小程序
官方文档:
JavaScript实现示例:
javascript
/**
* 支付宝小程序跳转唤起
*/
function openAlipayMiniProgram(appId, page, queryParams) {
const queryString = Object.keys(queryParams)
.map(key => `${key}=${encodeURIComponent(queryParams[key])}`)
.join('&');
location.href = `alipays://platformapi/startapp?appId=${appId}&page=${encodeURIComponent(page)}&query=${encodeURIComponent(queryString)}`;
}
4. 支付宝当面付条码支付(扫一扫)
协议格式:
ini
alipays://platformapi/startapp?appId=20000123&actionType=scan&barcodeType=<条码类型>&scanType=<扫码类型>
参数说明:
appId
:固定值20000123actionType
:固定值scanbarcodeType
:条码类型,qr表示二维码,bar表示条形码scanType
:扫码类型,qr表示扫描二维码,bar表示扫描条形码
使用环境:
- APP内:
- WebView:支持通过WebView中的location.href跳转唤起支付宝APP扫一扫功能
- Intent:支持通过Android原生Intent方式唤起支付宝APP扫一扫功能
- 均支持:iOS和Android平台均可通过多种方式调用此协议
- 浏览器:支持在移动端浏览器中通过location.href跳转唤起支付宝APP扫一扫功能
- 微信内:受限制,微信内置浏览器会拦截此协议
- 支付宝内:不适用,已在支付宝APP内可直接调用扫一扫功能
官方文档:
JavaScript实现示例:
javascript
/**
* 支付宝扫一扫唤起
*/
function openAlipayScan(barcodeType = 'qr', scanType = 'qr') {
location.href = `alipays://platformapi/startapp?appId=20000123&actionType=scan&barcodeType=${barcodeType}&scanType=${scanType}`;
}
5. 支付宝手机网站支付
协议格式:
支付宝手机网站支付是通过表单提交到支付宝收银台的方式实现的,不直接使用alipays://协议。
使用环境:
- APP内:
- WebView:支持在APP内嵌入WebView中通过表单提交方式跳转至支付宝收银台
- Intent:不支持直接通过Intent调用,需通过WebView加载表单
- 仅WebView支持:此方式主要依赖于WebView的表单提交功能
- 浏览器:支持在移动端浏览器中通过表单提交方式跳转至支付宝收银台
- 微信内:支持在微信内置浏览器中通过表单提交方式跳转至支付宝收银台
- 支付宝内:不适用,已在支付宝APP内无需再次唤起
官方文档:
支付宝手机网站支付官方文档 支付宝手机网站支付通过alipays协议唤起支付宝APP
标准实现流程:
- 服务端调用alipay.trade.wap.pay接口,生成form表单
- 服务端执行支付宝SDK中的pageExecute方法,读取响应中的body()结果
- 服务端将form表单返回给前端
- 前端将form表单插入页面并自动提交
- 用户在支付宝收银台完成支付
JavaScript实现示例:
javascript
/**
* 处理支付宝手机网站支付返回的表单
* @param {string} formHtml 支付宝返回的表单HTML
*/
function processAlipayWapForm(formHtml) {
// 创建一个临时div元素
const div = document.createElement('div');
div.innerHTML = formHtml;
document.body.appendChild(div);
// 自动提交表单
const form = div.querySelector('form');
if (form) {
form.submit();
}
}
Java服务端提取alipays协议实现(OkHttp + Jsoup):
java
import okhttp3.OkHttpClient;
import okhttp3.Request;
import okhttp3.Response;
import org.jsoup.Jsoup;
import org.jsoup.nodes.Document;
import org.jsoup.nodes.Element;
/**
* 支付宝手机网站支付 - 服务端提取alipays协议
* 注意:此方法非官方推荐,仅供特殊场景使用
*/
public class AlipayWapPayUtil {
/**
* 从支付宝手机网站支付返回的表单中提取并构造alipays协议
*
* @param payOrderId 支付订单号
* @return alipays协议URL
*/
public static String extractAlipaysUrlFromWapPay(String payOrderId) throws Exception {
// 1. 调用自己的服务端接口获取支付宝表单
String formHtml = getAlipayFormFromServer(payOrderId);
// 2. 使用Jsoup解析HTML
Document doc = Jsoup.parse(formHtml);
Element form = doc.selectFirst("form");
if (form == null) {
throw new Exception("支付宝返回的表单格式不正确");
}
// 3. 提取表单action地址和参数
String actionUrl = form.attr("action");
if (actionUrl == null || actionUrl.isEmpty()) {
throw new Exception("无法获取支付宝表单action地址");
}
// 4. 构造alipays协议URL
// 使用固定的appId=20000067(支付宝内置收银台应用)
String alipaysUrl = "alipays://platformapi/startapp?appId=20000067&url="
+ java.net.URLEncoder.encode(actionUrl, "UTF-8");
return alipaysUrl;
}
/**
* 调用自己的服务端接口获取支付宝表单
*
* @param payOrderId 支付订单号
* @return 支付宝表单HTML
*/
private static String getAlipayFormFromServer(String payOrderId) throws Exception {
OkHttpClient client = new OkHttpClient();
// 这里应该是调用自己服务端的支付接口,返回支付宝生成的表单
Request request = new Request.Builder()
.url("https://your-server.com/api/alipay/wap-pay?orderId=" + payOrderId)
.build();
try (Response response = client.newCall(request).execute()) {
if (!response.isSuccessful()) {
throw new Exception("服务端接口调用失败: " + response.code());
}
return response.body().string();
}
}
}
6. 支付宝电脑网站支付
协议格式:
电脑网站支付不使用alipays://协议,而是通过表单提交到支付宝收银台。
使用环境:
- APP内:
- WebView:不适用,电脑网站支付主要针对PC端浏览器环境
- Intent:不适用,电脑网站支付主要针对PC端浏览器环境
- 不支持:此支付方式不适用于移动APP环境
- 浏览器:支持在PC端浏览器中通过表单提交方式跳转至支付宝收银台
- 微信内:不适用,电脑网站支付主要针对PC端浏览器环境
- 支付宝内:不适用,电脑网站支付主要针对PC端浏览器环境
官方文档:
JavaScript实现示例:
javascript
/**
* 处理支付宝电脑网站支付
* @param {string} formHtml 支付宝返回的表单HTML
*/
function processAlipayPcForm(formHtml) {
const tempDiv = document.createElement('div');
tempDiv.innerHTML = formHtml;
document.body.appendChild(tempDiv);
tempDiv.querySelector('form').submit();
}
7. 支付宝扫码支付(Native支付)
协议格式:
ini
alipays://platformapi/startapp?saId=10000007&qrcode=<二维码内容URL编码>
参数说明:
saId
:固定值10000007,表示支付宝内置的扫码功能qrcode
:经过URL编码的支付宝收款二维码内容,通常以qr.alipay.com/开头
使用环境:
- APP内:
- WebView:支持通过WebView中的location.href跳转唤起支付宝APP并自动识别指定二维码
- Intent:支持通过Android原生Intent方式唤起支付宝APP并自动识别指定二维码
- 均支持:iOS和Android平台均可通过多种方式调用此协议
- 浏览器:支持在移动端浏览器中通过location.href跳转唤起支付宝APP并自动识别指定二维码
- 微信内:受限制,微信内置浏览器会拦截此协议
- 支付宝内:不适用,已在支付宝APP内可直接调用扫码功能
支付类型说明:
此协议用于唤起支付宝APP的扫码功能,并自动识别指定的二维码内容,实现Native支付(扫码支付)。常用于App内集成支付宝扫码支付功能,无需用户手动扫描二维码。
官方接口调用
支付宝扫码支付需要调用官方接口 alipay.trade.precreate
(统一收单线下交易预创建接口)获取二维码内容。
接口说明
- 接口名称:
alipay.trade.precreate
- 接口文档:opendocs.alipay.com/open/02ekfg
- 适用场景:线下实体店收银台扫码支付、自助售货机等场景
请求参数
json
{
"out_trade_no": "20150320010101001",
"seller_id": "2088102146225135",
"total_amount": "88.88",
"subject": "Iphone6 16G",
"body": "Iphone6 16G",
"product_code": "QR_CODE_OFFLINE"
}
返回值结构
json
{
"alipay_trade_precreate_response": {
"code": "10000",
"msg": "Success",
"out_trade_no": "20150320010101001",
"qr_code": "https://qr.alipay.com/bax03783b9b89qye3sax0066"
},
"sign": "ERITJKEIJKJHKKKKKKKHJEREEEEEEEEEEE"
}
关键字段说明:
code
: 返回码,10000表示成功qr_code
: 二维码内容,用于生成二维码图片或拼接alipays协议
JavaScript实现示例:
javascript
/**
* 支付宝扫码支付唤起
* @param {string} qrcodeContent 支付宝收款二维码内容
*/
function openAlipayQrcodePay(qrcodeContent) {
const encodedQrcode = encodeURIComponent(qrcodeContent);
location.href = `alipays://platformapi/startapp?saId=10000007&qrcode=${encodedQrcode}`;
}
Java服务端实现示例:
java
import com.alipay.api.AlipayApiException;
import com.alipay.api.AlipayClient;
import com.alipay.api.DefaultAlipayClient;
import com.alipay.api.request.AlipayTradePrecreateRequest;
import com.alipay.api.response.AlipayTradePrecreateResponse;
import com.alibaba.fastjson.JSONObject;
import java.net.URLEncoder;
/**
* 支付宝扫码支付(Native支付)
*/
public class AlipayNativePayUtil {
// 支付宝网关
private static final String GATEWAY_URL = "https://openapi.alipay.com/gateway.do";
// 编码格式
private static final String CHARSET = "UTF-8";
// 返回格式
private static final String FORMAT = "json";
// 签名类型
private static final String SIGN_TYPE = "RSA2";
/**
* 调用支付宝统一收单线下交易预创建接口,获取二维码内容
*
* @param outTradeNo 商户订单号
* @param totalAmount 订单金额
* @param subject 订单标题
* @return 二维码内容
* @throws AlipayApiException 支付宝API异常
*/
public String createQrCode(String appId, String privateKey, String alipayPublicKey,
String outTradeNo, String totalAmount, String subject) throws AlipayApiException {
// 创建AlipayClient实例
AlipayClient alipayClient = new DefaultAlipayClient(
GATEWAY_URL, appId, privateKey, FORMAT, CHARSET, alipayPublicKey, SIGN_TYPE);
// 创建API请求对象
AlipayTradePrecreateRequest request = new AlipayTradePrecreateRequest();
// 构建业务参数
JSONObject bizContent = new JSONObject();
bizContent.put("out_trade_no", outTradeNo);
bizContent.put("total_amount", totalAmount);
bizContent.put("subject", subject);
bizContent.put("product_code", "QR_CODE_OFFLINE");
// 设置业务参数
request.setBizContent(bizContent.toString());
// 调用接口获取响应
AlipayTradePrecreateResponse response = alipayClient.execute(request);
// 判断响应是否成功
if (response.isSuccess()) {
// 返回二维码内容
return response.getQrCode();
} else {
throw new AlipayApiException("创建支付宝二维码失败,错误码:" + response.getCode() + ",错误信息:" + response.getMsg());
}
}
/**
* 生成支付宝扫码支付的alipays协议URL
*
* @param qrCode 二维码内容
* @return alipays协议URL
*/
public String generateAlipaysUrl(String qrCode) throws Exception {
// URL编码二维码内容
String encodedQrCode = URLEncoder.encode(qrCode, CHARSET);
// 拼接alipays协议URL
return "alipays://platformapi/startapp?saId=10000007&qrcode=" + encodedQrCode;
}
}
二、微信wx://协议
1. 微信App支付
协议格式:
xml
weixin://app/<APPID>/pay/?nonceStr=<随机字符串>&package=Sign%3DWXPay&partnerId=<商户号>&prepayId=<预支付交易会话ID>&timeStamp=<时间戳>&sign=<签名>&signType=<签名类型>
参数说明:
APPID
:微信开放平台审核通过的应用APPIDnonceStr
:随机字符串package
:固定值Sign=WXPaypartnerId
:商户号prepayId
:预支付交易会话IDtimeStamp
:时间戳sign
:签名signType
:签名类型,如MD5
使用环境:
- APP内:
- WebView:支持通过WebView中的location.href跳转唤起微信APP支付功能
- Intent:支持通过Android原生Intent方式唤起微信APP支付功能
- 均支持:iOS和Android平台均可通过多种方式调用此协议
- 浏览器:支持在移动端浏览器中通过location.href跳转唤起微信APP支付功能
- 微信内:不适用,微信内已有原生支付接口,无需使用此协议
- 支付宝内:受限制,支付宝内置浏览器会拦截此协议
官方文档:
JavaScript实现示例:
javascript
/**
* 微信App支付唤起
*/
function openWeixinAppPay(payParams) {
const weixinUrl = `weixin://app/${payParams.appid}/pay/?nonceStr=${payParams.nonceStr}&package=Sign%3DWXPay&partnerId=${payParams.partnerId}&prepayId=${payParams.prepayId}&timeStamp=${payParams.timeStamp}&sign=${payParams.sign}&signType=${payParams.signType}`;
location.href = weixinUrl;
}
2. 微信H5支付
协议格式:
arduino
weixin://wap/pay?<payment_params>
参数说明:
微信H5支付通常由服务端生成支付链接,前端通过跳转到该链接来唤起微信支付。
使用环境:
- APP内:
- WebView:支持在APP内WebView中通过此协议唤起微信APP支付功能
- Intent:支持通过Android原生Intent方式唤起微信APP支付功能
- 均支持:iOS和Android平台均可通过多种方式调用此协议
- 浏览器:支持在移动端浏览器中通过location.href跳转唤起微信APP支付功能
- 微信内:不适用,微信内已有JSAPI支付,无需使用此协议
- 支付宝内:受限制,支付宝内置浏览器会拦截此协议
官方文档:
JavaScript实现示例:
javascript
/**
* 微信H5支付唤起
*/
function openWeixinH5Pay(payUrl) {
// 检测是否在微信内置浏览器中
const isWeixinBrowser = /MicroMessenger/i.test(navigator.userAgent);
if (isWeixinBrowser) {
// 在微信内直接跳转到支付链接
location.href = payUrl;
} else {
// 在外部浏览器中尝试使用weixin://协议唤起微信
const weixinUrl = `weixin://wap/pay?${payUrl.split('?')[1]}`;
location.href = weixinUrl;
}
}
3. 微信小程序跳转
协议格式:
ruby
wx<AppID>://
参数说明:
微信小程序跳转通常通过微信开放标签或JS-SDK实现,不直接使用协议。
使用环境:
- APP内:
- WebView:有限支持,需要通过微信开放标签方式
- Intent:支持通过Android原生Intent方式(URL Scheme)唤起微信并打开小程序
- 部分支持:不同平台支持程度不同,Android可通过Intent实现,iOS需特殊处理
- 浏览器:有限支持,需要通过微信开放标签或URL Scheme方式
- 微信内:完全支持,可通过JSSDK直接跳转到小程序
- 支付宝内:不支持,无法在支付宝内跳转到微信小程序
官方文档:
JavaScript实现示例(使用开放标签):
html
<!-- 引入微信JS-SDK -->
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script>
// 配置微信JS-SDK
wx.config({
debug: false,
appId: 'YOUR_APP_ID',
timestamp: 'TIMESTAMP',
nonceStr: 'NONCE_STR',
signature: 'SIGNATURE',
jsApiList: ['launchMiniProgram']
});
/**
* 跳转到微信小程序
*/
function navigateToMiniProgram(appId, path) {
wx.ready(function() {
wx.launchMiniProgram({
appId: appId,
path: path
});
});
}
</script>
4. 微信Native支付(扫码支付)
协议格式:
微信Native支付是指用户通过微信"扫一扫"扫描商户的二维码完成支付,不使用wx://协议。
使用环境:
- APP内:
- WebView:不适用,Native支付主要用于PC网站或线下场景,生成二维码供用户扫描
- Intent:不适用,Native支付不使用协议唤起方式
- 不支持:此支付方式不适用于APP内唤起微信支付
- 浏览器:适用于PC端浏览器,生成二维码供用户扫描
- 微信内:不适用,微信内已有JSAPI支付,无需使用扫码支付
- 支付宝内:不适用,无法在支付宝内使用微信支付
官方文档:
JavaScript实现示例(生成二维码):
javascript
/**
* 生成微信支付二维码
*/
function generateWeixinPayQRCode(codeUrl, containerId) {
// 使用qrcode.js库生成二维码
new QRCode(document.getElementById(containerId), {
text: codeUrl,
width: 256,
height: 256
});
}
5. 微信开放标签
协议格式:
微信开放标签不使用wx://协议,而是通过微信JS-SDK和特定的HTML标签实现。
使用环境:
- APP内:
- WebView:支持在APP内WebView中使用微信开放标签,但需要进行签名验证
- Intent:不适用,开放标签主要用于网页环境
- 仅WebView支持:此功能依赖于WebView的HTML和JavaScript支持
- 浏览器:支持在移动端和PC端浏览器中使用
- 微信内:完全支持,是微信内网页调用微信能力的官方推荐方式
- 支付宝内:不支持,无法在支付宝内使用微信开放标签
官方文档:
JavaScript实现示例:
html
<!-- 引入微信JS-SDK -->
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script>
// 配置微信JS-SDK
wx.config({
debug: false,
appId: 'YOUR_APP_ID',
timestamp: 'TIMESTAMP',
nonceStr: 'NONCE_STR',
signature: 'SIGNATURE',
openTagList: ['wx-open-launch-weapp', 'wx-open-launch-app']
});
</script>
<!-- 打开小程序 -->
<wx-open-launch-weapp id="launch-btn" appid="wx1234567890" path="pages/index/index">
<template>
<button>打开小程序</button>
</template>
</wx-open-launch-weapp>
三、协议唤起的兼容性与降级处理
1. 浏览器兼容性
不同浏览器对自定义协议的支持程度不同,需要考虑兼容性问题:
- iOS Safari:iOS 9及以上版本对自定义协议唤起有严格限制,需要用户手动触发
- Android Chrome:较新版本也增加了对自定义协议的限制
- 微信内置浏览器:对非微信协议有拦截
- 支付宝内置浏览器:对非支付宝协议有拦截
使用环境:
- APP内:
- WebView:需要根据不同APP的WebView设置,部分APP可能会拦截协议跳转
- Intent:Android平台可通过Intent方式绕过部分限制,但需要适配不同Android版本
- 部分支持:不同平台和WebView实现对协议支持程度不同
- 浏览器:各浏览器对协议支持程度不同,需要做好降级处理
- 微信内:只支持微信自身协议,会拦截其他应用协议
- 支付宝内:只支持支付宝自身协议,会拦截其他应用协议
2. 通用降级处理方案
javascript
/**
* 通用协议唤起函数(含降级处理)
*/
function launchApp(scheme, fallbackUrl) {
// 记录唤起时间
const startTime = Date.now();
// 尝试唤起应用
location.href = scheme;
// 添加超时检测
setTimeout(() => {
// 如果页面仍然可见,说明唤起失败
if (!document.hidden) {
// 跳转到降级页面
location.href = fallbackUrl;
}
}, 2000);
}
使用环境:
- APP内:
- WebView:适用于各类APP内WebView,需要APP允许协议跳转
- Intent:Android平台可结合Intent方式实现更可靠的唤起
- 均支持:此降级方案在各种环境中均可使用
- 浏览器:适用于各类移动端浏览器,提供了唤起失败后的降级方案
- 微信内:适用于微信内,但对非微信协议需要特殊处理
- 支付宝内:适用于支付宝内,但对非支付宝协议需要特殊处理
四、注意事项与最佳实践
-
安全性考虑:
- 所有支付相关的签名和敏感参数应在服务端生成,前端只负责展示和跳转
- 避免在前端存储敏感支付信息
- 使用HTTPS协议保证传输安全
-
用户体验优化:
- 提供明确的支付引导和状态提示
- 实现合理的超时处理和降级方案
- 考虑不同设备和浏览器的兼容性
-
开发建议:
- 严格按照官方文档实现,避免使用非官方API
- 定期检查和更新协议格式,确保与最新版本兼容
- 在各种环境下充分测试,包括不同设备、浏览器和网络条件
使用环境:
- APP内:
- WebView:所有最佳实践均适用于APP内WebView环境,特别注意WebView安全设置
- Intent:Android平台使用Intent方式时需注意权限和安全问题
- 均支持:不同平台需采用不同实现方式,但安全原则相同
- 浏览器:所有最佳实践均适用于各类浏览器环境
- 微信内:需特别注意微信对非微信协议的限制,做好降级方案
- 支付宝内:需特别注意支付宝对非支付宝协议的限制,做好降级方案