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)});
}


相关文章:
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"…...
探索YOLO技术:目标检测的高效解决方案
第一章:计算机视觉中图像的基础认知 第二章:计算机视觉:卷积神经网络(CNN)基本概念(一) 第三章:计算机视觉:卷积神经网络(CNN)基本概念(二) 第四章:搭建一个经典的LeNet5神经网络(附代码) 第五章࿱…...
vmware虚拟机安装使用教程【视频】
vmware虚拟机安装使用教程【视频】 VMware是一款强大的桌面级虚拟化软件,它允许用户在单个计算机上同时运行多个操作系统,每个操作系统都被称为一个虚拟机(VM)。这种技术不仅方便了软件测试、系统开发,还便于资源管理&…...
2025系统架构师(一考就过):案例之三:架构风格总结
软件架构风格是描述某一特定应用领域中系统组织方式的惯用模式,按照软件架构风格,物联网系统属于( )软件架构风格。 A:层次型 B:事件系统 C:数据线 D:C2 答案:A 解析: 物联网分为多个层次࿰…...
渗透测试实验
1、seacmsv9注入管理员密码 获取管理员账号(name) http://www.test2.com/comment/api/index.php?gid1&page2&rlist[]%27,%20extractvalue(1,%20concat_ws(0x20,%200x5c,(select%20(name)from%20sea_admin))),%27 2、获取管理员密码 http://www…...
CCA社群共識聯盟正式上線
2025年2月25日——BAF區塊鏈產業聯盟基金會旗下的CCA社群共識聯盟業務於今日正式全網啟動。作為區塊鏈行業的創新平台,CCA社群共識聯盟秉承誠信、公平、共贏的核心原則,致力於為全球社群夥伴打造一個更加開放、透明與高效的合作生態,推動區塊鏈產業的健康發展。 創新平台,助力…...
京东-零售-数据研发面经【附答案】
近期,有参加春招的同学和我交流了他的面试历程,我针对这些内容进行了细致的总结与梳理,并在此分享出来,希望能助力大家学习与借鉴。 1.八股文 1)HashMap的底层原理是什么【见V6.0面试笔记 Java基础部分第19题】 2&am…...
python中的JSON数据格式
文章目录 什么是json主要功能Python数据和Json数据的相互转化 什么是json JSON是一种轻量级的数据交互格式。可以按照JSON指定的格式去组织和封装数据。JSON本质上是一个带有特定格式的字符串。 主要功能 json就是一种在各个编程语言中流通的数据格式,负责不同编…...
ubuntu+aarch64+dbeaver安装【亲测,避坑】
一:访问 Oracle JDK,下载jdk-11.0.26_linux-aarch64_bin.tar.gz 二:解压 tar -xvzf jdk-11.0.20_linux-x64_bin.tar.gz三:将解压后的 JDK 文件夹移动到 /usr/lib/jvm 目录 sudo mv jdk-11.0.26 /usr/lib/jvm/四:进入…...
Java 大视界 -- 基于 Java 的大数据机器学习模型压缩与部署优化(99)
💖亲爱的朋友们,热烈欢迎来到 青云交的博客!能与诸位在此相逢,我倍感荣幸。在这飞速更迭的时代,我们都渴望一方心灵净土,而 我的博客 正是这样温暖的所在。这里为你呈上趣味与实用兼具的知识,也…...
vscode中使用PlatformIO创建工程加载慢
最近使用vscodeplatformIO开发esp32s3,第一次创建工程时加载速度很慢,查询资料解决问题,特此记录。 1.新建环境变量pyhton 此电脑-属性-高级系统设置中(直接搜索高级系统设置也行),添加系统变量ÿ…...
微信小程序数据绑定与事件处理:打造动态交互体验
在上一篇中,我们学习了如何搭建微信小程序的开发环境并创建了一个简单的“Hello World”页面。然而,一个真正的小程序不仅仅是静态内容的展示,它需要与用户进行动态交互。本文将深入探讨微信小程序中的数据绑定和事件处理机制,通过…...
力扣 下一个排列
交换位置,双指针,排序。 题目 下一个排列即在组成的排列中的下一个大的数,然后当这个排列为降序时即这个排列最大,因为大的数在前面,降序排列的下一个数即升序。所以,要是想找到当前排列的下一个排列&…...
JavaWeb 学习笔记
前端基础 HTML-CSS <!doctype html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport"content"widthdevice-width, user-scalableno, initial-scale1.0, maximum-scale1.0, minimum-scale1.0…...
Linux7-线程
一、前情回顾 chdir();功能: 函数用于改变当前进程的工作目录。 参数:路径(Path):这是一个字符串参数,表示要切换到的目标目录的路径。 返回值: 成功:在成功改变当前工作目…...
在线VS离线TTS(语音合成芯片)有哪些优势-AIOT智能语音产品方案
离线 TTS 存在语音质量欠佳、音色选择有限、语言支持单一更新困难、占用资源多、适应性差、难以个性化定制等痛点 01更新维护困难 由于是离线模式,难以及时获取最新的语音数据和算法更新,无法得到持续改进。 02占用本地资源 需要在设备本地存储较大的…...
结构型模式 - 代理模式 (Proxy Pattern)
结构型模式 - 代理模式 (Proxy Pattern) 代理模式是一种结构型设计模式,它允许通过代理对象来控制对另一个对象(目标对象)的访问。代理对象充当目标对象的接口,客户端通过代理对象间接访问目标对象。 分为两大类 静态代理&#…...
el-select滚动获取下拉数据;el-select滚动加载
el-select下拉获取数据 1.解决问题2.封装MyScrollSelect组件3.使用MyScrollSelect组件 1.解决问题 场景:下拉数据量过大,后端提供一个分页查询接口;需要每次滚动加载下一页的下拉数据 且单选的状态,需要支持回显,通过n…...
HTTP GET 请求示例
鸿蒙操作系统(HarmonyOS)是华为公司自主研发的面向全场景的分布式操作系统,旨在为用户提供一个安全、流畅且跨设备无缝连接的体验。它支持多种终端设备,如智能手机、平板电脑、智能电视、汽车等,并实现了模块化解耦&am…...
简单理解Oracle中的latch
可以用一个小卖部抢购的例子来理解 Oracle 数据库中的 Latch: 1、 什么是 Latch? 打个比方,假设数据库的某个内存区域(比如缓存的数据块)是小卖部货架上的最后一包辣条,Latch 就像是货架前的一个狭窄通道&a…...
遍历 Map 类型集合的方法汇总
1 方法一 先用方法 keySet() 获取集合中的所有键。再通过 gey(key) 方法用对应键获取值 import java.util.HashMap; import java.util.Set;public class Test {public static void main(String[] args) {HashMap hashMap new HashMap();hashMap.put("语文",99);has…...
基于uniapp+WebSocket实现聊天对话、消息监听、消息推送、聊天室等功能,多端兼容
基于 UniApp + WebSocket实现多端兼容的实时通讯系统,涵盖WebSocket连接建立、消息收发机制、多端兼容性配置、消息实时监听等功能,适配微信小程序、H5、Android、iOS等终端 目录 技术选型分析WebSocket协议优势UniApp跨平台特性WebSocket 基础实现连接管理消息收发连接…...
关于iview组件中使用 table , 绑定序号分页后序号从1开始的解决方案
问题描述:iview使用table 中type: "index",分页之后 ,索引还是从1开始,试过绑定后台返回数据的id, 这种方法可行,就是后台返回数据的每个页面id都不完全是按照从1开始的升序,因此百度了下,找到了…...
2025 后端自学UNIAPP【项目实战:旅游项目】6、我的收藏页面
代码框架视图 1、先添加一个获取收藏景点的列表请求 【在文件my_api.js文件中添加】 // 引入公共的请求封装 import http from ./my_http.js// 登录接口(适配服务端返回 Token) export const login async (code, avatar) > {const res await http…...
【单片机期末】单片机系统设计
主要内容:系统状态机,系统时基,系统需求分析,系统构建,系统状态流图 一、题目要求 二、绘制系统状态流图 题目:根据上述描述绘制系统状态流图,注明状态转移条件及方向。 三、利用定时器产生时…...
什么?连接服务器也能可视化显示界面?:基于X11 Forwarding + CentOS + MobaXterm实战指南
文章目录 什么是X11?环境准备实战步骤1️⃣ 服务器端配置(CentOS)2️⃣ 客户端配置(MobaXterm)3️⃣ 验证X11 Forwarding4️⃣ 运行自定义GUI程序(Python示例)5️⃣ 成功效果
1.获取 authorizationCode: 2.利用 authorizationCode 获取 accessToken:文档中心 3.获取手机:文档中心 4.获取昵称头像:文档中心 首先创建 request 若要获取手机号,scope必填 phone,permissions 必填 …...
RNN避坑指南:从数学推导到LSTM/GRU工业级部署实战流程
本文较长,建议点赞收藏,以免遗失。更多AI大模型应用开发学习视频及资料,尽在聚客AI学院。 本文全面剖析RNN核心原理,深入讲解梯度消失/爆炸问题,并通过LSTM/GRU结构实现解决方案,提供时间序列预测和文本生成…...
【Go语言基础【13】】函数、闭包、方法
文章目录 零、概述一、函数基础1、函数基础概念2、参数传递机制3、返回值特性3.1. 多返回值3.2. 命名返回值3.3. 错误处理 二、函数类型与高阶函数1. 函数类型定义2. 高阶函数(函数作为参数、返回值) 三、匿名函数与闭包1. 匿名函数(Lambda函…...
