前端调取支付宝支付接口(后台进行封装,没有直接调取支付宝接口),调用返回的数据中,将会有一串的form表单数据返回,我们需要将此表单在当前调用页面submit下,以跳转到支付扫码页;

支付宝返回的form 数据:

<form name="punchout_form" method="post" action="https://openapi.alipay.com/gateway.do?charset=GBK&method=alipay.trade.page.pay&sign=tXR6yxB9Uowu7tfbXVPHBoQXeyOqP2JXvo%2Fzmz%2BIA08aWin63h1%2FF7gHNN7I2K%2FnTV3ZYtvPkILu%2FS8uPmzpsAv1SJev0UNN2AbLDIGvbd%2BWn5neyIUqKcu5ySP1S8Bt4fbnvkMgnlijR25obVi5aFbj99JBZDrpeJ5cB9uq7Ccx7nX54%2F7coNv26PFD%2FPirlIKVVr2avD2w%3D%3D&return_url=http%3A%2F%2Fwww.shanshiwangluo.com%2F%23%2FpayNotify&notify_url=http%3A%2F%2Fwww.shanshiwangluo.com%2Fssmall%2Fportal%2Forder%2Fpay%2FaliCallback&version=1.0&app_id=2018062260383877&sign_type=RSA2&timestamp=2018-12-15+17%3A13%3A32&alipay_sdk=alipay-sdk-java-dynamicVersionNo&format=json">
<input type="hidden" name="biz_content" value="{ &quot;out_trade_no&quot;:&quot;1812141933252566&quot;, &quot;product_code&quot;:&quot;FAST_INSTANT_TRADE_PAY&quot;, &quot;total_amount&quot;:0.02, &quot;subject&quot;:&quot; 订单:1812141933252566&quot;, &quot;extend_params&quot;:{ &quot;sys_service_provider_id&quot;:&quot;2018062211454921&quot; } }">
<input type="submit" value="立即支付" style="display:none" >
</form>
<script>document.forms[0].submit();</script>

实例代码:

//支付宝支付
async aliPay(orderCode,phone,price){
var resp=await aliPay(orderCode,phone,price);
if(resp.msg=="SUCCESS"){
const div=document.createElement('divform');
div.innerHTML=resp.data;
document.body.appendChild(div);
document.forms[].acceptCharset='GBK';//保持与支付宝默认编码格式一致,如果不一致将会出现:调试错误,请回到请求来源地,重新发起请求,错误代码 invalid-signature 错误原因: 验签出错,建议检查签名字符串或签名私钥与应用公钥是否匹配
                   document.forms[].submit();
}else{
this.$alert("错误:"+resp.data,"提示",{
confirmButtonText:'确定'
});
}
},

* 温馨提示:在form submit 前,必须设置 acceptCharset='GBK' ,此处不一定是要GBK ,可以是UTF-8 ,前提是支付宝返回的action 必须是UTF-8  ,需保持一致

第一次接触支付宝电脑端扫描支付,在这个编码格式上花了我几个小时的时间,找到问题后,真的觉得非常无语。。。。

报错误截图:

电脑端支付宝支付 -前端获取支付宝返回的form 以及submit 调用支付扫码页面的更多相关文章

  1. PHP PC端支付宝扫码支付

    前面的文章已经描述过在蚂蚁金服开放平台创建应用签约等流程,详见:PHP App端支付宝支付,这里就不多说了,剩下的分两步,第一步是支付前的准备工作,也就是整合支付类文件,我已经整合好可以直接用,代码开 ...

  2. .NET Core2.0 环境下MVC模式的支付宝扫码支付接口-沙箱环境开发测试

    所有配置以及相关信息均可以从PC支付中获取 使用的生成二维码的组件名为QRCoder,该组件引用了一个第三方实现的System.Drawing类库,和支付宝官网类似 当面付SDK为Alipay.Aop ...

  3. python支付宝页面扫码支付

    一.介绍 基于网上一个支付宝pay.py封装了支付宝API的文件进行的,以下代码只支持网页扫码支付,手机端会提示调用支付宝支付 #pay文件代码 from datetime import dateti ...

  4. PC、h5项目接入第三方支付宝扫码登录、扫码付款

    首先介绍一下pc项目接入支付宝扫码支付. 1.pc.移动接入支付宝扫码支付. 其实这个逻辑很简单,前端所需要处理的不是很多,后台会给一个连接,前端只需要将要支付的订单id拼接在这个连接上,然后打开跳转 ...

  5. 使用form表单提交请求如何获取后台返回的数据?

    问题描述 一般的form表单提交是单向的:只能给服务器发送数据,但是无法获取服务器返回的数据,也就是无法读取HTTP应答包. 想要真正的半双工通讯一般需要使用Ajax, 但是Ajax对文件传输也很麻烦 ...

  6. 微信支付之扫码支付、公众号支付、H5支付、小程序支付相关业务流程分析总结

    前言 很久以来,一直想写一篇微信支付有关的总结文档:一方面是总结自己的一些心得,另一方面也可以帮助别人,但是因种种原因未能完全理解透彻微信支付的几大支付方式,今天有幸做一些总结上的文章,也趁此机会,将 ...

  7. 微信扫码支付功能详细教程————Java

    前言  首先声明 我并非原创 原创是 http://blog.csdn.net/wangqiuyun/article/details/51241064 我只是在前辈的基础 加以解释说明 还有自己的一些 ...

  8. java实现微信支付之扫码支付

    本文直接从代码调用微信扫码支付讲起.账号配置,参数生成等请参考官方文档:https://pay.weixin.qq.com/wiki/doc/api/native.php?chapter=6_1 微信 ...

  9. asp.net core 微信扫码支付(扫码支付,H5支付,公众号支付,app支付)之1

    2018-08-13更新生成二维码的方法 在做微信支付前,首先要了解你需要什么方式的微信支付,目前本人做过的支付包含扫码支付.H5支付.公众号支付.App支付等,本人使用的是asp.net mvc c ...

随机推荐

  1. html标签详解(2)

    http标签详解 声明 1:这里的文字都是我从我自己csdn账号拷贝过来,是本人学习总结的结晶,所以请尊重本作品.2:如要要转载本文章,则要说明文字的出处.3:如有哪里不对欢迎指出. 在上一篇文章中主 ...

  2. linux overcommit flag

    linux中有一个overcomit的配置,这个配置关系到进程在过多申请memory资源的时候,系统的表现(启发式允许,不检查,or 阻止) /proc/sys/vm/overcommit_memor ...

  3. Salesforce Sales Cloud 零基础学习(二) Account 和 Contact

    上一篇我们讲了Sales Cloud 中关于一个公司的产品和定价手册的概念,产品需要卖给企业客户(包括渠道伙伴以及合作伙伴等等)或者是个人客户,那客户信息存在哪里?针对企业客户,通过谁去串联起和企业客 ...

  4. mysql数据库单表只有一个主键自增id字段,ibatis实现id自增

    mysql数据库单表只有一个主键自增id字段,ibatis实现id自增 <insert id="autoid">        insert into user_id ...

  5. 遇到的一些Jquery,js函数

     jQuery.extend()        jQuery.merge():函数用于合并两个数组内容到第一个数组. <script> $(function () { ,,], [,,] ...

  6. Win3内存管理之私有内存跟共享内存的申请与释放

    Win3内存管理之私有内存跟共享内存的申请与释放 一丶内存简介私有内存申请 通过上一篇文章.我们理解了虚拟内存与物理内存的区别. 那么我们有API事专门申请虚拟内存与物理内存的. 有私有内存跟共享内存 ...

  7. Go语言的map如何判断key是否存在

    判断方式为value,ok := map[key], ok为true则存在 package main import "fmt" func main() { demo := map[ ...

  8. Perl和操作系统交互(一):system、exec和反引号

    调用操作系统命令:system函数 system函数可以直接让perl调用操作系统中的命令并执行. system入门示例 例如: #!/usr/bin/perl system 'date +" ...

  9. HttpClient+Jsoup模拟登陆贺州学院教务系统,获取学生个人信息

    前言 注:可能学校的教务系统已经做了升级,当前的程序不知道还能不能成功获取信息,加上已经毕业,我的账户已经被注销,试不了,在这里做下思路跟过程的记录. 在我的毕业设计中”基于SSM框架贺州学院校园二手 ...

  10. C# 反射Reflection Assembly

    反射反射程序员的快乐 一:什么叫反射 反射:是.net framework提供的一个访问metadata的帮助类,可以获取信息并且使用 反射的优点:动态 反射的缺点:1:稍微麻烦  2:能避开编译器的 ...