h5前端进行支付,后端返回(from)

前端调用后端接口实现支付宝与微信支付

最新推荐文章于 2024-08-11 15:42:08 发布

原创最新推荐文章于 2024-08-11 15:42:08 发布 · 634 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#vue

vue 专栏收录该内容

28 篇文章

订阅专栏

本文介绍了前端如何通过调用后端接口来实现跳转至支付宝和微信进行商品支付。首先，前端获取后端返回的支付数据，然后通过创建隐藏的表单元素提交数据来启动支付宝支付流程。对于微信支付，直接使用返回的支付数据进行页面跳转。文中提到微信支付在本地无法测试，并需要公众号配合。同时，作者欢迎读者分享更优的实现方式。

前端进行点击按钮跳转到支付宝app,对商品进行支付:

首先是我们需要后端的接口,我们去请求,后端会返回from:如下:

然后我们就对数据进行处理:

这个是跳转支付宝的:

   const formElement = document.createElement("div");
            formElement.style.display = "display:none;";
            formElement.innerHTML = res.payData;
            if (formElement.firstChild) {
              formElement.firstChild.target = "_blank";
              document.body.appendChild(formElement);
              formElement.firstChild.submit();
              document.body.removeChild(formElement);
            }

这个是跳转微信的:微信的话用本地是测试不了,然后需要用到公众号;