海神与明月 https://blog.satri.cn/ 全站:2.33 万字
技术

uniapp、tp5、迅虎支付三方的跨域问题

2024-05-23 字数:498

最近在完成毕设 夏创云,调试支付时发现一个跨域问题,问题描述和解决方案如下:

目前我主要需要一个移动端wap的支付。叫wap是为了和h5区分开。微信商户平台把wap支付称为公众号支付、微信内网页支付或者jsapi支付。

我在微信商户平台开通了小程序支付、jsapi支付,因为之前上线的小程序都有支付能力,以为jsapi也只是对接一下就行,结果不知道需要一个已认证服务号。不想给腾讯每年多交300块,就选择了迅虎公司的第三方支付。看了迅虎的demo,都是一些和cms集成的插件demo或者原生php的,我的后端使用thinkphp5,于是重构各个函数,封装类,在HbuilderX提供的内置浏览器环境中发现没得问题,于是局域网下真机中微信内调试,发现点击支付没反应。在edge的开发者工具中发现引起了跨域。

因为GPT的出现,已经很少独立思考了,第一时间不是追根溯源地按步骤按端调bug,而是不停地、一轮轮地问GPT。今天抛开GPT才想起主要的疑点:我的uniapp前端明明是在跟我自己的服务器通信(nginx、tp5均已配置CORS头部),为什么报错中会显示第三方服务商的api地址。按理说后端完全代理了服务,浏览器不应该发现第三方存在。

一行一行检查后端代码后才发现,当支付逻辑完成后,我返回的是一个重定向请求,用于通知客户端浏览器执行重定向,这里就会发生跨域,第三方服务商的域名不允许我这么做。

解决方案:

修改后端代码,把返回的重定向请求修改为目标url字符串,跳转的逻辑在uniapp的网络请求成功事件中写。

本文著作权归作者 [ 海神与明月 ]享有,未经作者书面授权,禁止以任何目的、任何形式转载,本声明具有法律效力,作者保留法律范围内的一切权利。