uniapp h5支付宝支付后端返回Form表单,前端如何处理

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档

文章目录


前言

uniapp h5 支付宝支付,后端返回一串form表单,前端如何拿到支付串并且调用支付


1.调取接口拿到后端返回的form表单

表单案例:

1.拿到form表单可以存储表单到本地

复制代码
uni.setStorageSync('Form', res.data) //form表单

2.跳转页面将form表单渲染成页面(直接无脑复制,注意--获取本地的form表单)

复制代码
<template>
  <view>
	<div class="body">
		
	</div>
	<!-- <rich-text :nodes="formUrl"></rich-text> -->
  </view>
</template>

<script>
export default {
  data() {
    return {
      formUrl: '' // 用于展示form表单的URL
    };
  },
  onLoad() {
	const Form = uni.getStorageSync('Form');   //获取你本地存储的form表单渲染成页面
	this.formUrl = Form
	 //将接口返回的Form表单显示到页面
	 document.querySelector('body').innerHTML = this.formUrl; // body对应上面的class	 
	 this.$nextTick(() => {
	         			
	           			console.log(document.forms,"form"); //跳转之前,可以先打印看看forms,确保后台数据和forms正确,否则,可能会出现一些奇奇怪怪的问题 ╮(╯▽╰)╭
	           			document.forms['0'].submit();  //重点--这个才是跳转页面的核心,获取第一个表单并提交
	         		});
  },
  methods:{
  }
};
</script>

<style scoped>

</style>

完美解决

参考博客:

UNI-APP解析支付宝返回FORM表单,唤起支付宝界面 https://www.freesion.com/article/6241970398/

Vue完美解决支付宝返回的form表单问题,这可能是最有效的解决办法了 https://blog.zixutech.cn/archives/324

vue项目中后端返回的支付宝form表单,怎么实现支付跳转? https://blog.csdn.net/qq_45934004/article/details/126156546

Vue自动提交form表单后,自动跳转第三方页面 https://www.jianshu.com/p/e2323b4e2cf9

开发笔记之uniapp 支付宝支付返回form表单解决方案 http://blog.haiya360.com/archives/766.html

vue 支付宝返回url 新窗口打开 https://blog.csdn.net/wax9092/article/details/86631151

H5处理支付宝接口返回form https://www.jianshu.com/p/8c5375671495

vue项目中后端返回的支付宝form表单,怎么实现支付跳转? https://blog.csdn.net/qq_45934004/article/details/126156546

Vue完美解决支付宝返回的form表单问题,这可能是最有效的解决办法了 https://blog.zixutech.cn/archives/324

相关推荐
糕冷小美n6 小时前
elementuivue2表格不覆盖整个表格添加固定属性
前端·javascript·elementui
小哥不太逍遥6 小时前
Technical Report 2024
java·服务器·前端
沐墨染6 小时前
黑词分析与可疑对话挖掘组件的设计与实现
前端·elementui·数据挖掘·数据分析·vue·visual studio code
anOnion6 小时前
构建无障碍组件之Disclosure Pattern
前端·html·交互设计
threerocks6 小时前
前端将死,Agent 永生
前端·人工智能·ai编程
问道飞鱼7 小时前
【前端知识】Vite用法从入门到实战
前端·vite·项目构建
爱上妖精的尾巴7 小时前
8-10 WPS JSA 正则表达式:贪婪匹配
服务器·前端·javascript·正则表达式·wps·jsa
Aliex_git9 小时前
浏览器 API 兼容性解决方案
前端·笔记·学习
独泪了无痕9 小时前
useStorage:本地数据持久化利器
前端·vue.js
程序员林北北9 小时前
【前端进阶之旅】JavaScript 一些常用的简写技巧
开发语言·前端·javascript