web页面调用支付宝支付
此文章是前端单独模拟完成支付,若在线上环境则需要后台配合产生签名等参数
-
在蚂蚁金服开放平台申请沙箱环境
将沙箱环境中的密钥、应用网关、回调地址补全,生成密钥的方法在此
配置好的沙箱环境如图示
-
利用RSA签名验证工具生成签名,方法在此
-
前端调用,附上代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <div style="200px;height:200px;background:red;" onclick="to()"></div> </body> <script src="../js/jquery-1.12.1.js"></script> <script> var prodConfig = { "body": "body", "subject": "daledou", "out_trade_no": "70501111111S001111110", "timeout_express": "90m", "total_amount": 9.00, "product_code": "QUICK_WAP_WAY" } var alipayConfig = { biz_content: JSON.stringify(prodConfig), app_id: '自己的appid', version: '1.0', format: 'json', sign_type: 'RSA2', method: 'alipay.trade.wap.pay', notify_url: 'http://***/alipy/notify_url.php', return_url: 'http://***/alipy/return_url.php', charset: 'UTF-8', sign: 'L3quItR9hqIfsgjZVqDO/L8k5dmdSSn7KCQcHMRsZl0yzFa9im5Ge/ZXZh1sIo+fqr5zJkUUYmZknERw+iPiiNt/w0VLKPzjgzL4afoQ4oS5vnD8SzdccA9C1E5GxjvJCXGseeciQpyNkMmvXwTcL7egS4ukn2dAV0lpcM8KNPJdi+1HlWgAlnFT0Xq6Kqs24GD+Fd4ogpXoWOa3HfSjY1+DY+7FwKyunTvR9isN/kRIckW887GE2Dy2jRSghhANrf47f54SDMu+UcuRsNfxsgwfSTiafTW1q8Eym/2G7PBOWnI0I5llD7bs9Qu3zB/b+IpLlkEa0jUNj1rXgvkjww==', timestamp: '2017-11-15 14:55:46' } function to() { httpPost('https://openapi.alipaydev.com/gateway.do', alipayConfig) } function httpPost(URL, PARAMS) { var temp = document.createElement("form"); temp.action = URL; temp.method = "post"; temp.style.display = "none"; for (var x in PARAMS) { var opt = document.createElement("textarea"); opt.name = x; opt.value = PARAMS[x]; temp.appendChild(opt); } document.body.appendChild(temp); temp.submit(); return temp; } </script> </html>