自己的H5页面如何集成支付宝支付

Question

请问在自己的H5页面如何集成支付宝支付 ？H5用Vue.js做的，数据通过调用自己服务器取得，现在想集成支付宝支付，请问是在自己服务器端集成还是在前端网页端集成？

Answer 1

关于后端怎么配置我不清楚，支付宝官方文档应该会提到，前端还是要写点代码的：
主要就是一个回调函数

               res => {     const div = document.createElement('div');
                    div.innerHTML = res.html;
                    document.body.appendChild(div);
                    document.forms.alipaysubmit.submit(); }

Answer 2

楼上的这段代码非常有用；32个赞，在vue.js的script中写入这段代码就好了，res是服务器返回的对象，里面包含form表单，其他的正常书写就好了，困扰了二天，试验一下就出了结果，非常感谢barefootChild

const div = document.createElement('div');

                div.innerHTML = res.html;
                document.body.appendChild(div);
                document.forms.alipaysubmit.submit();
                
                

Answer 3

谢邀。

比较遗憾，我没有做过支付宝的集成…… 倒是做过paypal，与一些国外信用卡支付的集成。
具体怎么集成，看看文档与demo就ok了。

前端页面还是服务器端集成？

这个就看你支付业务的复杂度了，如果只是一个简单的扫码支付什么的，直接页面集成就好。具体还是得看支付宝官方文档的建议。当你支付业务相当复杂(比如循环付款,不知道支付宝有没有)或者觉得页面不安全，放在服务器也可以的。

注意下面：

1. 支付后的消息回调(paypal 叫做IPN),这块的文档一定要看仔细看清楚，理解官方文档中说的每一种状态，成功、失败、处理中等等(可能支付宝中没有这些……我不太清楚)。 对每一种状态的处理都要考虑全面。

2. 注意消息回调的延迟，可能用户付钱了，但是支付服务器可能会有处理延迟，这种情况要考虑好。

3. 对参数的校验及其严格，关于价格最好是在服务器端计算，然后传给支付宝，不要相信客户端给的数据。

4. 支付界面引导要友好，比如用户在付款成功后，但服务器出错了，没有做出对应处理，要给用户一个联系你们的入口，免得用户懵逼……

以上是我做一些支付集成后的感触……
千万不要坑用户。。。
关于钱的代码一定要全力对待，真的不能马虎的……

Answer 4

之前做过支付宝前端支付，需要后端返回一串代码。前端只要触发这段代码就能支付，至于需要哪些参数给后端，看你们业务了。详情看支付宝文档

Answer 5

救你这个，是说到了重点，submit，我居然忘记执行方法。