js网页唤起支付宝进行支付

在做uni-app项目中,打包成 ios App的时候,为了绕过苹果支付的审核,所以用的 webview 加载支付宝的网页支付,进行付款

具体实现流程:

前端通过 url 将商品单价,商品数量,商品总额等后端所需要的参数传到我们写的 html支付 页面中,

支付页面拿到参数后再像后端发起订单的请求,后端将订单返回回来,我们通过后端返回回来的订单数据,拉起支付宝发起支付!

整个过程其实不难,代码也很简单,详情请看代码......

 <!DOCTYPE html>

 <html lang="zh">

     <head>

         <meta charset="UTF-8">

         <meta name="viewport" content="width=device-width, initial-scale=1.0">

         <meta http-equiv="X-UA-Compatible" content="ie=edge">

         <title></title>

     </head>

     <body>

         <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

         <script type="text/javascript">

             function getRequest() {

               var url = location.search; //获取url中"?"符后的字串

               var theRequest = new Object();

               if (url.indexOf("?") != -1) {

                 var str = url.substr(1);

                 strs = str.split("&");

                 for(var i = 0; i < strs.length; i ++) {

                   theRequest[strs[i].split("=")[0]]=decodeURI(strs[i].split("=")[1]);

                 }

               }

               return theRequest;

             }

             let parameter = getRequest()

             $.ajax({

                 url: 'http://server.zhongqu.net.cn/api/user/payment/v1',

                 type: "post",

                 headers: {

                     'Content-Type': 'application/json;charset=utf8',

                     'x-access-token': parameter.token

                 },

                 dataType: "json",

                 data: JSON.stringify({

                     'goodId': parameter.goodId,

                     'fee': parameter.fee,

                     'amount': parameter.amount,

                     'totalFee': parameter.totalFee

                 }),

                 success: function(data) {

                     let temp = document.createElement("form");

                     temp.action = 'https://openapi.alipay.com/gateway.do?charset=utf-8'

                     temp.method = "post";

                     temp.style.display = "none";

                     let params = data.data;

                     let strs = params.split('&');

                     for (let v of strs) {

                         let arr = v.split('=');

                         var opt = document.createElement("input");

                         opt.name = arr[0];

                         opt.value = decodeURIComponent(arr[1]);

                         temp.appendChild(opt);

                     }

                     document.body.appendChild(temp);

                     temp.submit();

                 }

             });

         </script>

     </body>

 </html>

js网页拉起支付宝支付的更多相关文章

  1. iOS支付宝支付集成

    概述 iOS支付宝支付集成 详细 代码下载:http://www.demodashi.com/demo/10729.html 支付宝和微信都是业界的老大哥,相信大家都有所觉得文档.SDK都是各种坑吧( ...

  2. iOS不用官方SDK实现微信和支付宝支付XHPayKit

    作者:朱晓辉Allen 链接:https://juejin.im/post/5a90dd3a6fb9a0634912b755 前言 前段时间由于项目需求,移除了项目中的微信支付SDK和支付宝支付SDK ...

  3. C#支付宝支付接口H5版（手机网页支付）

    接口官方文档 https://docs.open.alipay.com/203/107090/ 首先在Nuget 安装 Alipay /// <summary>         /// 支 ...

  4. iOS - AliPay 支付宝支付

    1.支付宝支付申请 支付宝支付官方签约集成指引 支付宝APP支付官方集成指引 蚂蚁金服开放平台 1.1 支付宝 APP 支付申请步骤 APP 支付:APP 支付是商户通过在移动端应用 APP 中集成开 ...

  5. $Django 支付宝支付,微信服务号推送消息 (测试需要把应用程序部署到服务器上)

    一 支付宝支付 大概 支付宝支付 正式环境:需要用营业执照去申请商户号,appid 测试环境:沙箱环境:https://openhome.alipay.com/platform/appDaily.ht ...

  6. 微信公众号中的支付宝支付与微信支付 && 支付宝支付问题（微信bug）

    一般,在微信公众号中的商城都是需要支持微信支付和支付宝支付的,当然,较大的公司对于鹅厂和阿里的站队就不说了,所以这里简单记录一下支付宝支付和微信支付的主要流程.说是简单介绍,这是因为确实不难,因为前端 ...

  7. H5中的微信支付、支付宝支付

    微信支付的申请: 公众号支付.扫码支付等在微信公众平台.移动端的申请在微信开放平台 公众号支付流程:申请微信公众号(服务号并完成微信认证)——申请微信支付商户号(申请微信支付,资料审核通过以后,请前往 ...

  8. 基于python-django框架的支付宝支付案例

    目录 @ 一. 开发前的准备 1. 必须了解的知识 SDK:软件开发工具包,可以为开发者提供快速开发的工具 沙箱环境:也就是测试环境 支付宝支付金额的精度:小数点后两位(面试) 支付宝用的什么加密方式 ...

  9. 【React Native】react-native之集成支付宝支付、微信支付

    一.在使用支付宝支付.微信支付之前导入桥接好的头文件 github地址:https://github.com/xujianfu/react-native-pay 二.集成支付宝支付流程 RN支付宝需要 ...

随机推荐

  1. JavaSE复习~基本语法规则

    java程序的基本结构 java程序的文件后缀为 .java 一个java文件中可以写许多内容,但有且只能有一个 public 修饰的 class 类(class)是Java程序中所有源代码的基本组成 ...

  2. ubuntu 修改和配置ip

    因为主机里面有好多个虚拟机,但是ip就一个,最近开了一个win的虚拟机,真好玩是不?所以就暂时把ubunut的ip给改了,要不冲突,哎呀,不说多了,上图, 1.修改配置文件blacklist.conf ...

  3. 201771010135杨蓉庆《面向对象程序设计（java）》第四周学习总结

    学习目标 1.掌握类与对象的基础概念,理解类与对象的关系: 2.掌握对象与对象变量的关系: 3.掌握预定义类的基本使用方法,熟悉Math类.String类.math类.Scanner类.LocalDa ...

  4. spring boot中配置文件中变量的引用

    配置文件中 变量的自身引用 ${名称} java文件中引用:非静态变量 之间在变量上面注释@Value("${名称}")  静态变量 在set方法上注释@Value("$ ...

  5. XCOJ 1249: 全自动奖学金计算系统

    1249: 全自动奖学金计算系统 时间限制: 1 Sec  内存限制: 64 MB提交: 305  解决: 54 标签提交统计讨论版 题目描述 宣城校区从今年开始,在原有奖学金制度上,设立专项奖学金. ...

  6. socket中文奇数个出现乱码的解决办法

    用MyEclipse试了一下JAVA获取系统正在运行进程代码,结果Console输出的时候中文部分输出为乱码,在网上找了很多办法,都没有解决问题.后来发现一个方法,解决了问题,特此分享. 下面成功解决 ...

  7. 【原】Django问题总结

    一:python manage.py makemigrations No changes detected 在修改了models.py后,有些用户会喜欢用python manage.py makemi ...

  8. 【洛谷P3500】TES-Intelligence Test

    前言 先是这位神仙写了这道题 \(O(n\log n)\) 的做法.然后去他的博客上恰了一波. 然后发现这道题有 \(O(n)\) 的做法的.其实也不难. 题目 题目链接:https://www.lu ...

  9. 疫情对国内5G发展的影响

    导读 2020年春节期间,“新型冠状病毒”引发了自SARS之后又一次全国性疫情,而世卫组织也将之列为国际关注的突发公共卫生事件,随后多国发布了针对中国的旅行警告和入境限制,从当前情况来看,疫情对中国各 ...

  10. 【C++初学者自学笔记三】哑元函数、缺省参数、内联函数（模块二，PS：需要用到重载函数）

    一,哑元函数:一个函数的参数只有类型没有名字的则这个参数称之为哑元.类似于void fun(int); 功能:1保持向前的兼容性,比方说我们需要做成一个成品,然后成品是会不断的更新第一代第二代,当我们 ...