当前位置: 首页 > 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)});
}

    

相关文章:

uniapp h5支付宝支付

第1种&#xff0c;创建个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技术:目标检测的高效解决方案

第一章&#xff1a;计算机视觉中图像的基础认知 第二章&#xff1a;计算机视觉&#xff1a;卷积神经网络(CNN)基本概念(一) 第三章&#xff1a;计算机视觉&#xff1a;卷积神经网络(CNN)基本概念(二) 第四章&#xff1a;搭建一个经典的LeNet5神经网络(附代码) 第五章&#xff1…...

vmware虚拟机安装使用教程【视频】

vmware虚拟机安装使用教程【视频】 VMware是一款强大的桌面级虚拟化软件&#xff0c;它允许用户在单个计算机上同时运行多个操作系统&#xff0c;每个操作系统都被称为一个虚拟机&#xff08;VM&#xff09;。这种技术不仅方便了软件测试、系统开发&#xff0c;还便于资源管理&…...

2025系统架构师(一考就过):案例之三:架构风格总结

软件架构风格是描述某一特定应用领域中系统组织方式的惯用模式&#xff0c;按照软件架构风格&#xff0c;物联网系统属于&#xff08; &#xff09;软件架构风格。 A:层次型 B:事件系统 C:数据线 D:C2 答案&#xff1a;A 解析&#xff1a; 物联网分为多个层次&#xff0…...

渗透测试实验

1、seacmsv9注入管理员密码 获取管理员账号&#xff08;name&#xff09; 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社群共識聯盟秉承誠信、公平、共贏的核心原則,致力於為全球社群夥伴打造一個更加開放、透明與高效的合作生態,推動區塊鏈產業的健康發展。 創新平台,助力…...

京东-零售-数据研发面经【附答案】

近期&#xff0c;有参加春招的同学和我交流了他的面试历程&#xff0c;我针对这些内容进行了细致的总结与梳理&#xff0c;并在此分享出来&#xff0c;希望能助力大家学习与借鉴。 1.八股文 1&#xff09;HashMap的底层原理是什么【见V6.0面试笔记 Java基础部分第19题】 2&am…...

python中的JSON数据格式

文章目录 什么是json主要功能Python数据和Json数据的相互转化 什么是json JSON是一种轻量级的数据交互格式。可以按照JSON指定的格式去组织和封装数据。JSON本质上是一个带有特定格式的字符串。 主要功能 json就是一种在各个编程语言中流通的数据格式&#xff0c;负责不同编…...

ubuntu+aarch64+dbeaver安装【亲测,避坑】

一&#xff1a;访问 Oracle JDK&#xff0c;下载jdk-11.0.26_linux-aarch64_bin.tar.gz 二&#xff1a;解压 tar -xvzf jdk-11.0.20_linux-x64_bin.tar.gz三&#xff1a;将解压后的 JDK 文件夹移动到 /usr/lib/jvm 目录 sudo mv jdk-11.0.26 /usr/lib/jvm/四&#xff1a;进入…...

Java 大视界 -- 基于 Java 的大数据机器学习模型压缩与部署优化(99)

&#x1f496;亲爱的朋友们&#xff0c;热烈欢迎来到 青云交的博客&#xff01;能与诸位在此相逢&#xff0c;我倍感荣幸。在这飞速更迭的时代&#xff0c;我们都渴望一方心灵净土&#xff0c;而 我的博客 正是这样温暖的所在。这里为你呈上趣味与实用兼具的知识&#xff0c;也…...

vscode中使用PlatformIO创建工程加载慢

最近使用vscodeplatformIO开发esp32s3&#xff0c;第一次创建工程时加载速度很慢&#xff0c;查询资料解决问题&#xff0c;特此记录。 1.新建环境变量pyhton 此电脑-属性-高级系统设置中&#xff08;直接搜索高级系统设置也行&#xff09;&#xff0c;添加系统变量&#xff…...

微信小程序数据绑定与事件处理:打造动态交互体验

在上一篇中&#xff0c;我们学习了如何搭建微信小程序的开发环境并创建了一个简单的“Hello World”页面。然而&#xff0c;一个真正的小程序不仅仅是静态内容的展示&#xff0c;它需要与用户进行动态交互。本文将深入探讨微信小程序中的数据绑定和事件处理机制&#xff0c;通过…...

力扣 下一个排列

交换位置&#xff0c;双指针&#xff0c;排序。 题目 下一个排列即在组成的排列中的下一个大的数&#xff0c;然后当这个排列为降序时即这个排列最大&#xff0c;因为大的数在前面&#xff0c;降序排列的下一个数即升序。所以&#xff0c;要是想找到当前排列的下一个排列&…...

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();功能&#xff1a; 函数用于改变当前进程的工作目录。 参数&#xff1a;路径&#xff08;Path&#xff09;&#xff1a;这是一个字符串参数&#xff0c;表示要切换到的目标目录的路径。 返回值&#xff1a; 成功&#xff1a;在成功改变当前工作目…...

在线VS离线TTS(语音合成芯片)有哪些优势-AIOT智能语音产品方案

离线 TTS 存在语音质量欠佳、音色选择有限、语言支持单一更新困难、占用资源多、适应性差、难以个性化定制等痛点 01更新维护困难 由于是离线模式&#xff0c;难以及时获取最新的语音数据和算法更新&#xff0c;无法得到持续改进。 02占用本地资源 需要在设备本地存储较大的…...

结构型模式 - 代理模式 (Proxy Pattern)

结构型模式 - 代理模式 (Proxy Pattern) 代理模式是一种结构型设计模式&#xff0c;它允许通过代理对象来控制对另一个对象&#xff08;目标对象&#xff09;的访问。代理对象充当目标对象的接口&#xff0c;客户端通过代理对象间接访问目标对象。 分为两大类 静态代理&#…...

el-select滚动获取下拉数据;el-select滚动加载

el-select下拉获取数据 1.解决问题2.封装MyScrollSelect组件3.使用MyScrollSelect组件 1.解决问题 场景&#xff1a;下拉数据量过大&#xff0c;后端提供一个分页查询接口&#xff1b;需要每次滚动加载下一页的下拉数据 且单选的状态&#xff0c;需要支持回显&#xff0c;通过n…...

HTTP GET 请求示例

鸿蒙操作系统&#xff08;HarmonyOS&#xff09;是华为公司自主研发的面向全场景的分布式操作系统&#xff0c;旨在为用户提供一个安全、流畅且跨设备无缝连接的体验。它支持多种终端设备&#xff0c;如智能手机、平板电脑、智能电视、汽车等&#xff0c;并实现了模块化解耦&am…...

简单理解Oracle中的latch

可以用一个小卖部抢购的例子来理解 Oracle 数据库中的 Latch&#xff1a; 1、 什么是 Latch&#xff1f; 打个比方&#xff0c;假设数据库的某个内存区域&#xff08;比如缓存的数据块&#xff09;是小卖部货架上的最后一包辣条&#xff0c;Latch 就像是货架前的一个狭窄通道&a…...

RocketMQ延迟消息机制

两种延迟消息 RocketMQ中提供了两种延迟消息机制 指定固定的延迟级别 通过在Message中设定一个MessageDelayLevel参数&#xff0c;对应18个预设的延迟级别指定时间点的延迟级别 通过在Message中设定一个DeliverTimeMS指定一个Long类型表示的具体时间点。到了时间点后&#xf…...

全球首个30米分辨率湿地数据集(2000—2022)

数据简介 今天我们分享的数据是全球30米分辨率湿地数据集&#xff0c;包含8种湿地亚类&#xff0c;该数据以0.5X0.5的瓦片存储&#xff0c;我们整理了所有属于中国的瓦片名称与其对应省份&#xff0c;方便大家研究使用。 该数据集作为全球首个30米分辨率、覆盖2000–2022年时间…...

python爬虫:Newspaper3k 的详细使用(好用的新闻网站文章抓取和解析的Python库)

更多内容请见: 爬虫和逆向教程-专栏介绍和目录 文章目录 一、Newspaper3k 概述1.1 Newspaper3k 介绍1.2 主要功能1.3 典型应用场景1.4 安装二、基本用法2.2 提取单篇文章的内容2.2 处理多篇文档三、高级选项3.1 自定义配置3.2 分析文章情感四、实战案例4.1 构建新闻摘要聚合器…...

C++八股 —— 单例模式

文章目录 1. 基本概念2. 设计要点3. 实现方式4. 详解懒汉模式 1. 基本概念 线程安全&#xff08;Thread Safety&#xff09; 线程安全是指在多线程环境下&#xff0c;某个函数、类或代码片段能够被多个线程同时调用时&#xff0c;仍能保证数据的一致性和逻辑的正确性&#xf…...

【C++】纯虚函数类外可以写实现吗?

1. 答案 先说答案&#xff0c;可以。 2.代码测试 .h头文件 #include <iostream> #include <string>// 抽象基类 class AbstractBase { public:AbstractBase() default;virtual ~AbstractBase() default; // 默认析构函数public:virtual int PureVirtualFunct…...

轻量级Docker管理工具Docker Switchboard

简介 什么是 Docker Switchboard &#xff1f; Docker Switchboard 是一个轻量级的 Web 应用程序&#xff0c;用于管理 Docker 容器。它提供了一个干净、用户友好的界面来启动、停止和监控主机上运行的容器&#xff0c;使其成为本地开发、家庭实验室或小型服务器设置的理想选择…...

手动给中文分词和 直接用神经网络RNN做有什么区别

手动分词和基于神经网络&#xff08;如 RNN&#xff09;的自动分词在原理、实现方式和效果上有显著差异&#xff0c;以下是核心对比&#xff1a; 1. 实现原理对比 对比维度手动分词&#xff08;规则 / 词典驱动&#xff09;神经网络 RNN 分词&#xff08;数据驱动&#xff09…...

篇章一 论坛系统——前置知识

目录 1.软件开发 1.1 软件的生命周期 1.2 面向对象 1.3 CS、BS架构 1.CS架构​编辑 2.BS架构 1.4 软件需求 1.需求分类 2.需求获取 1.5 需求分析 1. 工作内容 1.6 面向对象分析 1.OOA的任务 2.统一建模语言UML 3. 用例模型 3.1 用例图的元素 3.2 建立用例模型 …...

Linux系统:进程间通信-匿名与命名管道

本节重点 匿名管道的概念与原理匿名管道的创建命名管道的概念与原理命名管道的创建两者的差异与联系命名管道实现EchoServer 一、管道 管道&#xff08;Pipe&#xff09;是一种进程间通信&#xff08;IPC, Inter-Process Communication&#xff09;机制&#xff0c;用于在不…...

AI书签管理工具开发全记录(十八):书签导入导出

文章目录 AI书签管理工具开发全记录&#xff08;十八&#xff09;&#xff1a;书签导入导出1.前言 &#x1f4dd;2.书签结构分析 &#x1f4d6;3.书签示例 &#x1f4d1;4.书签文件结构定义描述 &#x1f523;4.1. ​整体文档结构​​4.2. ​核心元素类型​​4.3. ​层级关系4.…...