zoukankan      html  css  js  c++  java
  • 电脑端支付宝支付 -前端获取支付宝返回的form 以及submit 调用支付扫码页面

    前端调取支付宝支付接口(后台进行封装,没有直接调取支付宝接口),调用返回的数据中,将会有一串的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[0].acceptCharset='GBK';//保持与支付宝默认编码格式一致,如果不一致将会出现:调试错误,请回到请求来源地,重新发起请求错误代码 invalid-signature 错误原因: 验签出错,建议检查签名字符串或签名私钥与应用公钥是否匹配
                       document.forms[0].submit();
                   }else{
                       this.$alert("错误:"+resp.data,"提示",{
                           confirmButtonText:'确定'
                       });
                   }
               },

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

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

    报错误截图:

  • 相关阅读:
    C# Renci.SshNet SFTP--FTP 操作help
    点评js异步加载的4种方式
    C# csv 操作类
    Redis分布式缓存
    webApi FileReader
    Web API 2 authentication with JWT
    Web SQL
    jQuery图像照片剪裁插件Jcrop中文演示
    使用ajax跨域withCredentials的作用
    JavaScript 判断浏览器类型及版本
  • 原文地址:https://www.cnblogs.com/zty-Love/p/10123953.html
Copyright © 2011-2022 走看看