当前位置: 首页 > news >正文

uniapp h5支付宝支付

 第1种,创建个div插入到body中

const div = document.createElement('div');
div.innerHTML = 后端返回的form表单字符串;
document.body.appendChild(div);
document.forms[0].submit();
div.remove();

第2种

<template>
<view v-html="formAliPay"></view>
</template><script>
this.formAliPay = 后端返回的form表单字符串;
this.$nextTick(() => {document.forms['punchout_form'].submit(); //punchout_form是支付宝表单的name
});
</script>

发现一个问题。在公众号中打开支付页,跳转到支付宝支付直接显示出url地址,而通过聊天中发的链接在微信中打开是跳到中转页面。可以参考下支付宝给的解决方案小程序文档 - 支付宝文档中心,中间加个跳转页面而不使用官方默认的跳转。

* 官方例子中有个参数bizcontent,名称有误,应该是biz_content

将支付宝demo中的ap.js和pay.htm复制到项目中,在b.pay()中改下路径。

如果在vue中使用import导入需要改下ap.js

//ap_vue.js
export function alipay() {var b = {};var a = {};var c = "abc123";a.PADCHAR = "=";a.ALPHA = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";a.makeDOMException = function() {var f, d;try {return new DOMException(DOMException.INVALID_CHARACTER_ERR)} catch (d) {var c = new Error("DOM Exception 5");c.code = c.number = 5;c.name = c.description = "INVALID_CHARACTER_ERR";c.toString = function() {return "Error: " + c.name + ": " + c.message};return c}};a.getbyte64 = function(e, d) {var c = a.ALPHA.indexOf(e.charAt(d));if (c === -1) {throw a.makeDOMException()}return c};a.decode = function(f) {f = "" + f;var j = a.getbyte64;var h, e, g;var d = f.length;if (d === 0) {return f}if (d % 4 !== 0) {throw a.makeDOMException()}h = 0;if (f.charAt(d - 1) === a.PADCHAR) {h = 1;if (f.charAt(d - 2) === a.PADCHAR) {h = 2}d -= 4}var c = [];for (e = 0; e < d; e += 4) {g = (j(f, e) << 18) | (j(f, e + 1) << 12) | (j(f, e + 2) << 6) | j(f, e + 3);c.push(String.fromCharCode(g >> 16, (g >> 8) & 255, g & 255))}switch (h) {case 1:g = (j(f, e) << 18) | (j(f, e + 1) << 12) | (j(f, e + 2) << 6);c.push(String.fromCharCode(g >> 16, (g >> 8) & 255));break;case 2:g = (j(f, e) << 18) | (j(f, e + 1) << 12);c.push(String.fromCharCode(g >> 16));break}return c.join("")};a.getbyte = function(e, d) {var c = e.charCodeAt(d);if (c > 255) {throw a.makeDOMException()}return c};a.encode = function(f) {if (arguments.length !== 1) {throw new SyntaxError("Not enough arguments")}var g = a.PADCHAR;var h = a.ALPHA;var k = a.getbyte;var e, j;var c = [];f = "" + f;var d = f.length - f.length % 3;if (f.length === 0) {return f}for (e = 0; e < d; e += 3) {j = (k(f, e) << 16) | (k(f, e + 1) << 8) | k(f, e + 2);c.push(h.charAt(j >> 18));c.push(h.charAt((j >> 12) & 63));c.push(h.charAt((j >> 6) & 63));c.push(h.charAt(j & 63))}switch (f.length - d) {case 1:j = k(f, e) << 16;c.push(h.charAt(j >> 18) + h.charAt((j >> 12) & 63) + g + g);break;case 2:j = (k(f, e) << 16) | (k(f, e + 1) << 8);c.push(h.charAt(j >> 18) + h.charAt((j >> 12) & 63) + h.charAt((j >> 6) & 63) + g);break}return c.join("")};b.pay = function(d) {var c = encodeURIComponent(a.encode(d));location.href = "./static/pay.htm?goto=" + c};b.decode = function(c) {return a.decode(decodeURIComponent(c));}return b;
}
import {alipay} from '@/static/ap_vue.js';if(判断在微信浏览器中){this.$nextTick(() => {var gotoUrl = document.getElementsByName('punchout_form')[0].getAttribute('action') + '&biz_content=' + encodeURIComponent(document.getElementsByName('biz_content')[0].value);alipay().pay(gotoUrl)});
}

    

http://www.lryc.cn/news/543051.html

相关文章:

  • 探索YOLO技术:目标检测的高效解决方案
  • vmware虚拟机安装使用教程【视频】
  • 2025系统架构师(一考就过):案例之三:架构风格总结
  • 渗透测试实验
  • CCA社群共識聯盟正式上線
  • 京东-零售-数据研发面经【附答案】
  • python中的JSON数据格式
  • ubuntu+aarch64+dbeaver安装【亲测,避坑】
  • Java 大视界 -- 基于 Java 的大数据机器学习模型压缩与部署优化(99)
  • vscode中使用PlatformIO创建工程加载慢
  • 微信小程序数据绑定与事件处理:打造动态交互体验
  • 力扣 下一个排列
  • JavaWeb 学习笔记
  • Linux7-线程
  • 在线VS离线TTS(语音合成芯片)有哪些优势-AIOT智能语音产品方案
  • 结构型模式 - 代理模式 (Proxy Pattern)
  • el-select滚动获取下拉数据;el-select滚动加载
  • HTTP GET 请求示例
  • 简单理解Oracle中的latch
  • ubuntu新系统使用指南
  • sage-huga改进SITAN
  • DeepSeek开源周Day1:FlashMLA引爆AI推理性能革命!
  • Git add --- error: Filename too long
  • Python入门12:面向对象的三大特征与高级特性详解
  • 动态链接器(九):.init和.init_array
  • Elasticsearch:使用经过训练的 ML 模型理解稀疏向量嵌入
  • 安宝特方案 | 电力行业的“智能之眼”,AR重新定义高效运维!
  • 【落羽的落羽 数据结构篇】树、二叉树
  • [回顾]从原型链视角解读Vue底层实现Vue VueCompoent VM VC关系
  • springcloud nacos 整合seata解决分布式事务