开发「bufpay.com 个人即时到账收款平台」的时候,支付页面需要 poll轮询 查询订单状态。
bufpay 支付接口如下:
接口地址:https://bufpay.com/api/pay/aid (在后台应用配置页面查看)
调用方法:POST
调用参数:
- name, 必填, 订单销售商品名称
- pay_type, 必填, 支付方式(可选alipay/wechat)
- price, 必填, 订单价格
- order_id, 必填, 订单号
- order_uid, 必填, 订单购买用户(可以为空字符串,但是建议设置为购买用户编号,便于后续对账)
- notify_url, 必填, 支付成功后回调地址
- return_url, 必填, 支付成功后前台跳转地址(可以为空字符串)
- sign, 必填, 将参数按 name + pay_type + price + order_id + order_uid + notify_url + return_url + app secret 顺序拼接后 MD5 注意:使用该接口的建议方法是:在你的产品付款接口后台构造好上面的参数,然后渲染一个自动提交的 form 返回给用户浏览器,
用户浏览器会 post 这些参数到 BufPay,然后就会显示支付页面;
如果 api 后面加 ?format=json 那么返回结果就是 json 格式的,需要开发者自己展示付款二维码。
支付页面设计之初就是在 bufpay.com 域名下面,如果要自己渲染支付页面就指定接口返回的内容为 json。
但是有些开发者是后台直接请求支付页面,然后把支付页面的 html 的内容直接在自己的域名下面渲染给用户,这样,在开发者自己的域名下面,支付页面调用 bufpay.com 的订单查询接口就会出现跨域问题。
Failed to load https://bufpay.com/: Redirect from 'https://bufpay.com/' to 'https://www.bufpay.com/' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://bufpay.com' is therefore not allowed access.
为了避免这种问题,我们需要修改接口支持 jsonp 调用, 在服务端增加:
cb = self.get_argument('callback', None)
if cb:
return self.write('%s(%s)' % (cb, json.dumps({'status': od['status'] if od else 'not_exist'})))
callback 参数判断,如果传了 callback 参数,就把原本为 json 的格式转换成 callback(json) 这样。
然后客户端修改,自己实现 jsonp 请求(如果是jQuery就比较简单):
var $jsonp = (function(){
var that = {};
that.send = function(src, options) {
var callback_name = options.callbackName || 'callback',
on_success = options.onSuccess || function(){},
on_timeout = options.onTimeout || function(){},
timeout = options.timeout || 10; // sec
var timeout_trigger = window.setTimeout(function(){
window[callback_name] = function(){};
on_timeout();
}, timeout * 1000);
window[callback_name] = function(data){
window.clearTimeout(timeout_trigger);
on_success(data);
}
var script = document.createElement('script');
script.type = 'text/javascript';
script.async = true;
script.src = src;
document.getElementsByTagName('head')[0].appendChild(script);
}
return that;
})();
调用的时候就:
$jsonp.send("https://bufpay.com/api/query/{{aoid}}?callback=cb&_=" + new Date().getTime(), {
callbackName: 'cb',
onSuccess: function(ret){
//do something
}
});
这样就解决了跨域问题。
插播广告,BufPay 支付平台,个人支付接口
BufPay 个人收款