简介这是一套面向小微商户、个体店主及前端开发者的新款三合一收款码生成工具源码旨在解决支付宝、微信、QQ钱包多平台收款需展示多个二维码的运营痛点实现单码聚合、快速部署与品牌化定制。资源共44个文件包含10个核心JS脚本含qrcode生成、表单验证、UI交互逻辑、6个PNG/JPG模板图、2个CSS样式表负责响应式布局与主题渲染、20余张预设视觉素材及字体图标资源整体压缩包大小为13.46MB结构清晰、模块解耦便于二次开发与本地调试。已有1456人学习下载适用于无服务器环境的轻量级落地场景。用户可直接运行index.html通过前端JavaScript实时合成三平台收款码支持多模板切换、本地生成不上传敏感信息并附带AmazeUI组件库与Layer弹窗等成熟前端依赖开箱即用且隐私安全。 这个源码项目我关注挺久了也实际部署过好几次。“新款支付宝微信QQ三合一收款码在线生成源码内置多款模板”听起来像是一个带后台的建站程序但本质上它做的是聚合收款页把支付宝、微信、QQ三个平台的收款码收拢到同一个页面用户扫一个码系统识别出用户用的是哪个App然后展示对应的收款二维码。对于摆摊、跑腿、外包、独立开发者这类个人收款场景这个方案比官方聚合码门槛低比挂三张二维码图片体面也比手动切换收款码省事很多。这篇文章我打算从原理、部署、模板扩展、踩坑记录几个角度完整拆解一遍适合手里有PHP虚拟主机或者服务器、想快速搭一个三合一收款页的站长也适合想自己二次开发、做一套个性化模板的开发者。你可以把它当成一份操作笔记也可以当成一个源码解析来看照着做基本就能跑起来。1. 整体设计思路与方案拆解1.1 这个项目到底解决了什么问题先聊一下“三合一收款码”存在的意义。你去楼下便利店买东西柜台前可能贴着一张纸上面并排放着支付宝、微信、QQ三个收款码。顾客付款时是方便了但商家自己收银台很乱贴纸也显得不专业。更重要的是如果商家想把收款链接发到微信群里或者印在一张传单上总不能把三个二维码都印上去吧。于是就有了“三合一收款页”这种玩法商家只上传一张二维码顾客扫码后打开一个网页网页根据当前扫码环境自动展示对应的收款码。举个例子顾客用微信扫一扫页面打开后直接显示微信收款码长按或者再次识别就能付款用支付宝扫就显示支付宝收款码。这样一个链接、一张二维码就解决了所有平台的收款入口问题。标题里还有“在线生成源码”这个关键词它解决的是另一个问题不是所有人都懂技术。普通用户拿到这套源码部署后通过网页表单填写昵称、上传三张收款码图片、选择模板系统就能自动生成一个专属收款页和对应的二维码不用手动改代码。整套流程和以前那些“在线生成个人主页”“在线生成婚礼邀请函”的思路很像只是业务场景换成了收款。1.2 为什么用PHP开发而不是其他技术栈很多人看到“源码”两个字会下意识觉得应该用Python、Java这些主流后端语言。但真的做过网站源码分享的人会告诉你PHP在这个场景里几乎是唯一最优解。原因不复杂部署门槛低。国内绝大多数虚拟主机、宝塔面板、云服务器PHP都是开箱即用不需要额外配置环境变量、依赖包上传文件就能跑。有人在网上搜“免费python源码大全”“php源码”这类需求时也会发现Python项目虽然多但个人站长真正去部署Python应用的很少光是虚拟环境、Gunicorn、Nginx反代那套流程就能劝退一大半人。而PHP源码只要放到网站目录有正确的入口文件基本就能访问。再加上这个项目本身逻辑不复杂无非是接收表单、保存图片、读模板、替换变量、输出HTML和二维码PHP自带GD库和文件操作函数就能搞定没必要为了“技术先进”引入一堆复杂依赖。另外这套源码通常还内置了二维码生成功能。PHP生态里有成熟的phpqrcode库单文件引用即可使用不需要额外安装扩展只要开了GD库这正好契合“在线生成”的核心卖点。用户在页面上填完信息后端把收款页地址生成二维码图片整个过程完全不依赖第三方接口没网络请求超时、没接口限额自托管非常稳。1.3 内置多模板的核心设计思路“内置多款模板”是这个源码在UI层面的亮点。一开始我以为模板只是几套不同颜色的CSS皮肤后来看了目录结构才发现每套模板不只是颜色变化连页面布局、卡片风格、按钮样式都不一样。有的模板是居中大卡片风格适合发朋友圈有的是底部悬浮按钮风格适合手机端快速操作还有的是仿原生App风格打开后有很强的“这不是网页”的错觉。模板系统的设计思路和CMS的模板替换机制类似把页面中需要动态变化的内容抽象成占位符比如收款昵称、收款金额、收款码图片地址、页面标题等模板文件里写死布局和样式后端在渲染时把占位符替换成实际数据。这样做的好处是新增一套模板只需要写HTML和CSS不用改PHP逻辑。这个设计对使用者来说也是最友好的生成收款页时下拉框里选一套模板提交后页面就按照所选模板来渲染。如果默认模板看腻了或者风格和店铺不搭换一套就行完全不需要动代码。对于想做二次开发的人来说这个模板机制也很容易扩展后面我会专门讲怎么开发一套自己的模板。2. 三合一收款页的核心原理UA识别与收款码展示2.1 扫码之后怎么知道是用哪个App扫的这是整个三合一收款页最核心的技术点也是很多第一次接触这个源码的人最好奇的地方页面怎么知道用户是用微信扫的还是支付宝扫的答案是通过HTTP请求头里的User-Agent简称UA。当用户在微信里扫二维码打开的其实是微信内置浏览器这个浏览器的UA字符串里会带上“MicroMessenger”字样支付宝内置浏览器的UA里有“AlipayClient”QQ内置浏览器则通常带“QQ/”或者“MQQBrowser”字样。后端PHP可以通过$_SERVER[HTTP_USER_AGENT]拿到这段字符串然后用strpos做关键词匹配判断是哪个扫码环境。核心判断代码大致长这样$ua isset($_SERVER[HTTP_USER_AGENT]) ? $_SERVER[HTTP_USER_AGENT] : ; if (strpos($ua, AlipayClient) ! false) { $channel alipay; // 支付宝 } elseif (strpos($ua, MicroMessenger) ! false) { $channel wechat; // 微信 } elseif (strpos($ua, MQQBrowser) ! false || strpos($ua, QQ/) ! false) { $channel qq; // QQ } else { $channel unknown; // 其他浏览器兜底处理 }拿到$channel之后页面模板就根据这个值来输出对应的收款码图片地址。如果是支付宝渠道就显示支付宝收款码微信渠道就显示微信收款码QQ渠道就显示QQ收款码。整套逻辑看起来简单但实际开发中有几个细节要注意。第一支付宝的UA并不是所有情况下都带“AlipayClient”。如果用户把二维码图片保存下来再用支付宝App内的“扫一扫”去识别相册图片打开的页面UA仍然是支付宝内置浏览器带AlipayClient这种情况没问题。但如果用户是在PC端用支付宝扫码支付页面里的二维码然后跳转到普通浏览器打开你的收款页那UA就不带了这时无法自动识别。所以模板里最好做一个兜底自动识别失败时把三个平台的收款码按钮都展示出来让用户手动选择。第二QQ的UA特征比较杂。手机QQ内置浏览器的UA通常包含“QQ/”加版本号而QQ浏览器App的UA则包含“MQQBrowser”。为了兼容判断条件里两个都得写上。但要注意“QQ/”这个特征太宽泛某些应用的WebView也可能包含它所以判断顺序上最好把MQQBrowser放在QQ/前面避免误判。2.2 从用户上传到二维码生成的完整链路三合一收款码的完整生成链路可以分成前端和后端两条线来看。前端用户的视角很简单打开后台填写昵称、上传三张收款码、选择模板、点击生成系统返回一个收款页链接和一张二维码图片。但这个过程中间发生了很多事。先说数据存储简易版源码通常不用MySQL而是把配置和数据写成JSON文件每个生成的收款页生成一个唯一ID用这个ID做文件名存到data目录下。比如生成ID是ab12cd34那么数据文件就是data/ab12cd34.json。数据文件里面存了这些字段{ id: ab12cd34, nickname: 老王杂货铺, title: 扫码付款, amount: , alipay: /uploads/ab12cd34_alipay.png, wechat: /uploads/ab12cd34_wechat.png, qq: /uploads/ab12cd34_qq.png, template: default, create_time: 1710000000 }然后是收款页的访问逻辑。收款页的URL通常会设计成/pay/{id}.html或者/pay.php?idab12cd34这种形式。用户扫码访问这个URLPHP根据ID读取对应的JSON数据再读取模板文件把昵称、收款码图片地址等变量替换进模板最后输出HTML。输出之前PHP会做一次UA判断把判断结果也传给模板模板里就能决定默认展示哪一张收款码。最后是二维码生成。收款页URL确定之后源码会用phpqrcode把完整URL编码成二维码图片输出给用户下载。这里有一点要特别注意二维码图片编码的不能是收款链接的“临时预览地址”而是最终对外访问的URL。很多人在本地调试时生成的二维码扫出来是127.0.0.1或者localhost手机当然打不开这就是因为生成二维码时用的链接地址写错了。2.3 识别失败时的兜底方案UA识别虽然方便但它不是100%可靠的因为用户不一定总是从这三个App里扫码。最典型的情况是用户用系统相机扫码打开的是系统浏览器UA里既没有AlipayClient也没有MicroMessenger。用户用淘宝、抖音等App内置浏览器扫码UA特征千奇百怪可能被误判。用户把收款页链接转发到PC端浏览器打开后没有手机扫码环境自动识别自然失效。所以成熟的源码都会在模板里加一个“手动选择支付方式”的功能。自动识别成功时页面默认展示对应平台的收款码同时下面保留三个小按钮允许用户手动切换自动识别失败时页面不做默认判断而是把三个按钮做成大按钮让用户自己点。还有一种更稳妥的做法在收款页URL后面加一个type参数比如/pay/ab12cd34.html?typealipay这个参数可以强制指定展示哪个平台的收款码。这样无论是测试还是用户手动切换都能通过URL参数来控制而完全依赖UA识别。我的经验是自动识别加手动兜底两种方式结合实际使用中的投诉率会降到最低。3. 实操过程部署源码并在线生成三合一收款码3.1 环境准备PHP版本、扩展与伪静态部署这套源码前先把环境准备好。我测试过的版本要求PHP 7.2以上推荐PHP 7.4或者8.0。没有硬性依赖MySQL所以不需要建数据库这对很多新手来说友好不少。必装的PHP扩展有这几个GD库生成二维码和图片压缩用、fileinfo上传图片类型校验用、curl如果二维码生成走第三方接口才需要用本地库的话可以不开。如果你用的是宝塔面板可以通过“软件商店”“PHP版本”“设置”“安装扩展”里直接安装fileinfo和GD库。装完记得重启PHP服务。服务器方面Nginx和Apache都可以但需要配置伪静态规则目的是让用户访问/pay/ab12cd34.html这种URL时能正确路由到入口文件或者至少能让普通带?参数的访问方式正常工作。如果你不想折腾伪静态也有办法所有链接都使用带参数的访问方式比如/index.php?cpayidab12cd34这样不需要任何Rewrite规则也能跑只是URL不够好看。在线生成二维码时二维码里存的就是这种带参数的URL不影响功能。两者选其一我建议能配伪静态就配上因为分享出去的链接更干净。3.2 源码目录结构与运行逻辑下面这个目录结构是我部署过程中整理出来的不同的源码版本可能略有差异但大方向是一致的/ ├── index.php // 入口负责路由和控制器分发 ├── install/ │ └── index.php // 在线安装向导首次访问时初始化配置 ├── config.php // 全局配置网站URL、上传目录、默认模板等 ├── data/ // 生成记录存放目录JSON文件 ├── uploads/ // 上传的收款码图片目录 ├── templates/ │ ├── default/ │ │ ├── index.html // 模板文件带占位符 │ │ ├── style.css │ │ └── preview.png // 模板缩略图 │ └── card/ │ ├── index.html │ └── style.css ├── api/ │ └── generate.php // 在线生成接口接收表单提交 ├── pay/ │ └── index.php // 收款页渲染接口读取数据并输出HTML └── qrcode.php // 二维码生成接口整个运行逻辑其实是个轻量MVC结构。用户访问install/index.php完成初始化配置后config.php里会写入站点URL等参数。之后用户进后台表单页提交收款信息表单提交到api/generate.php这个接口保存上传图片、生成JSON记录、返回收款页链接。用户拿到链接后分享出去其他用户访问收款页pay/index.php读取JSON数据、拼接模板、输出HTML。整个链路没有数据库非常简单粗暴但足够稳定。3.3 在线生成收款页的操作流程部署完成之后实际生成一个收款页的操作流程是这样的。第一步先准备好三张收款码图片。注意这里说的收款码不是去下载一张网上找的随机二维码而是你自己在支付宝、微信、QQ里申请的“收款码”图片通常可以在各App的“收付款”页面里保存到手机相册。图片格式建议PNG背景透明或纯色尺寸不要小于300x300否则生成的收款页上图片放大后会很糊。第二步进入后台生成页面填写收款昵称、收款说明比如“老王杂货铺”“请扫码付款”这种。金额字段可以留空也可以填一个固定金额。这里踩坑最多如果你填了金额前端页面上会展示“100.00”但顾客实际扫码付款时能不能直接按100元付取决于你上传的微信收款码图片本身是不是固定金额的收款码。如果是普通收款码顾客打开后还是可以自己输入金额的页面上的金额只是展示给别人看的参考不会生成一个100元的固定二维码。如果你想让顾客扫码后直接付100元需要单独在微信、支付宝里生成对应金额的收款二维码然后上传那张图而不是通过这套源码填金额字段来实现。第三步上传三张收款码图片选择模板点击生成。系统返回一个收款页链接和一张二维码图片你可以把二维码下载下来印成台卡或发到群里。顾客扫码自动识别环境展示对应平台的收款码。3.4 二次开发关键接口参数说明如果你要改源码或者把这套收款码功能嵌入到自己的系统里有两个人接口需要吃透。第一个是api/generate.php它接收POST请求常用字段有nickname、title、amount、template以及三个文件字段alipay_file、wechat_file、qq_file。接口成功后返回JSON里面包含pay_url和qrcode_url两个字段。第二个是qrcode.php它通过GET参数text接收要编码的内容返回二维码图片。假设你想让用户提交后自动把收款页链接保存到自己的业务系统可以这样调用生成接口$postData [ nickname 测试店铺, title 扫码付款, amount , template default, alipay_file new CURLFile(/tmp/alipay.png), // wechat_file、qq_file 同理 ];qrcode.php的调用则更简单一般是把返回的URL当图片地址直接用img src/qrcode.php?texthttps://yourdomain.com/pay/ab12cd34.html width300 height300 /二维码生成时有个细节值得关注phpqrcode库输出的默认容错级别是L但如果你生成的二维码里要放一个比较长的URL建议把容错级别提高到M因为容错级别越高图片上可以容忍的遮挡和破损就越多。有一些源码会把这个参数写死成QR_ECLEVEL_M个人建议不要改成L也别改成HM是兼顾扫码速度和稳定性的最佳选择。4. 内置模板系统的实现与自定义扩展4.1 模板文件结构与占位符替换机制看模板系统里最核心的一个思想HTML模板负责页面长什么样PHP变量负责往哪里填内容。每套模板独立一个目录里面主要是一个index.html文件可能是纯HTML也可能引入自己的CSS和JS。模板里凡是需要动态变化的位置都用大括号包起来的占位符标记。拿默认模板举例里面的内容结构大概是div classpay-card div classshop-name{nickname}/div div classpay-title{title}/div {if amount}div classpay-amount{amount}/div{/if} div classpay-code img src{alipay_code} classcode-image {if channel ! alipay}hidden{/if} / img src{wechat_code} classcode-image {if channel ! wechat}hidden{/if} / img src{qq_code} classcode-image {if channel ! qq}hidden{/if} / /div div classchannel-tabs button>$image imagecreatefromstring(file_get_contents($_FILES[alipay_file][tmp_name])); $width imagesx($image); $targetWidth 750; if ($width $targetWidth) { $ratio $targetWidth / $width; $newWidth $targetWidth; $newHeight intval(imagesy($image) * $ratio); $newImage imagecreatetruecolor($newWidth, $newHeight); imagecopyresampled($newImage, $image, 0, 0, 0, 0, $newWidth, $newHeight, $width, imagesy($image)); imagepng($newImage, $savePath, 8); }注意PNG格式的无损压缩质量参数设成8就可以了不要再高。压缩时有个坑如果源图片是WebP格式imagecreatefromstring不一定能识别报错时会直接白屏。上传前先通过getimagesize检查文件类型不支持webp的PHP版本就提示用户转成PNG或JPG。5.3 域名被拦截或页面被限制访问这类收款页最怕的一件事就是域名被微信或QQ拦截。一旦被拦用户扫码打开会提示“已停止访问该网页”收款流程直接中断。触发拦截的原因很复杂可能是页面内容含敏感词也可能是域名被多人举报还可能是因为页面里有跳转行为被风控识别成恶意营销。从技术层面能做的事比较有限。第一页面内容尽量干净不要放引导分享、诱导关注之类的文案就老老实实展示收款码。第二尽量用一个稳定的域名或子域名来部署收款页。频繁更换域名不仅用户不信任第三方平台的风控也会敏感。第三如果业务量很大建议接入H5支付或Native支付等正规支付渠道而不是长期依赖个人收款码跳转页。不过那就是另外一套系统了不在这个源码的讨论范围里。5.4 问题排查速查表我整理了一张排查表很多问题按着这个表从上往下查基本都能定位原因现象可能原因处理方法二维码扫出来打不开生成二维码时链接用了localhost把config.php里站点URL改成正式域名并在服务器端重新生成页面能打开但只显示一个平台的码UA识别失败或判断顺序有误检查UA匹配顺序优先匹配AlipayClient再MicroMessenger最后MQQBrowser收款码图片显示模糊原图尺寸太小或被压缩过度上传图片不低于500x500压缩目标宽度设为750px上传图片后报错目录没有写权限给uploads和data目录设置755或777权限模板切换后页面样式错乱模板CSS里用了绝对路径改成相对路径或确保域名配置正确生成二维码提示错误PHP GD库未启用在PHP配置里安装GD扩展收款页内容被篡改使用了不安全的生成接口检查api/generate.php是否校验了Token或登录态这套源码的坑大部分集中在环境配置和UA识别上真正涉及业务逻辑的并不多。源码本身不复杂安装过程也不会超过十分钟但如果你理解了底层原理后面无论是换模板、加功能还是排查问题都会顺手很多。最后再分享一个小经验三合一收款码页面我实际测下来自动识别成功率大概在85%左右剩下15%的用户来自各种奇奇怪怪的浏览器。与其纠结怎么提高识别率不如把兜底按钮设计得好看一点。按钮明显、切换流畅、收款码展示清晰要比强行追求“完全自动识别”更实在。收款页面做得再花哨也不如让用户快点付完款重要。本文还有配套的精品资源点击获取 支付宝微信QQ三合一收款码在线生成源码原理与部署
简介这是一套面向小微商户、个体店主及前端开发者的新款三合一收款码生成工具源码旨在解决支付宝、微信、QQ钱包多平台收款需展示多个二维码的运营痛点实现单码聚合、快速部署与品牌化定制。资源共44个文件包含10个核心JS脚本含qrcode生成、表单验证、UI交互逻辑、6个PNG/JPG模板图、2个CSS样式表负责响应式布局与主题渲染、20余张预设视觉素材及字体图标资源整体压缩包大小为13.46MB结构清晰、模块解耦便于二次开发与本地调试。已有1456人学习下载适用于无服务器环境的轻量级落地场景。用户可直接运行index.html通过前端JavaScript实时合成三平台收款码支持多模板切换、本地生成不上传敏感信息并附带AmazeUI组件库与Layer弹窗等成熟前端依赖开箱即用且隐私安全。 这个源码项目我关注挺久了也实际部署过好几次。“新款支付宝微信QQ三合一收款码在线生成源码内置多款模板”听起来像是一个带后台的建站程序但本质上它做的是聚合收款页把支付宝、微信、QQ三个平台的收款码收拢到同一个页面用户扫一个码系统识别出用户用的是哪个App然后展示对应的收款二维码。对于摆摊、跑腿、外包、独立开发者这类个人收款场景这个方案比官方聚合码门槛低比挂三张二维码图片体面也比手动切换收款码省事很多。这篇文章我打算从原理、部署、模板扩展、踩坑记录几个角度完整拆解一遍适合手里有PHP虚拟主机或者服务器、想快速搭一个三合一收款页的站长也适合想自己二次开发、做一套个性化模板的开发者。你可以把它当成一份操作笔记也可以当成一个源码解析来看照着做基本就能跑起来。1. 整体设计思路与方案拆解1.1 这个项目到底解决了什么问题先聊一下“三合一收款码”存在的意义。你去楼下便利店买东西柜台前可能贴着一张纸上面并排放着支付宝、微信、QQ三个收款码。顾客付款时是方便了但商家自己收银台很乱贴纸也显得不专业。更重要的是如果商家想把收款链接发到微信群里或者印在一张传单上总不能把三个二维码都印上去吧。于是就有了“三合一收款页”这种玩法商家只上传一张二维码顾客扫码后打开一个网页网页根据当前扫码环境自动展示对应的收款码。举个例子顾客用微信扫一扫页面打开后直接显示微信收款码长按或者再次识别就能付款用支付宝扫就显示支付宝收款码。这样一个链接、一张二维码就解决了所有平台的收款入口问题。标题里还有“在线生成源码”这个关键词它解决的是另一个问题不是所有人都懂技术。普通用户拿到这套源码部署后通过网页表单填写昵称、上传三张收款码图片、选择模板系统就能自动生成一个专属收款页和对应的二维码不用手动改代码。整套流程和以前那些“在线生成个人主页”“在线生成婚礼邀请函”的思路很像只是业务场景换成了收款。1.2 为什么用PHP开发而不是其他技术栈很多人看到“源码”两个字会下意识觉得应该用Python、Java这些主流后端语言。但真的做过网站源码分享的人会告诉你PHP在这个场景里几乎是唯一最优解。原因不复杂部署门槛低。国内绝大多数虚拟主机、宝塔面板、云服务器PHP都是开箱即用不需要额外配置环境变量、依赖包上传文件就能跑。有人在网上搜“免费python源码大全”“php源码”这类需求时也会发现Python项目虽然多但个人站长真正去部署Python应用的很少光是虚拟环境、Gunicorn、Nginx反代那套流程就能劝退一大半人。而PHP源码只要放到网站目录有正确的入口文件基本就能访问。再加上这个项目本身逻辑不复杂无非是接收表单、保存图片、读模板、替换变量、输出HTML和二维码PHP自带GD库和文件操作函数就能搞定没必要为了“技术先进”引入一堆复杂依赖。另外这套源码通常还内置了二维码生成功能。PHP生态里有成熟的phpqrcode库单文件引用即可使用不需要额外安装扩展只要开了GD库这正好契合“在线生成”的核心卖点。用户在页面上填完信息后端把收款页地址生成二维码图片整个过程完全不依赖第三方接口没网络请求超时、没接口限额自托管非常稳。1.3 内置多模板的核心设计思路“内置多款模板”是这个源码在UI层面的亮点。一开始我以为模板只是几套不同颜色的CSS皮肤后来看了目录结构才发现每套模板不只是颜色变化连页面布局、卡片风格、按钮样式都不一样。有的模板是居中大卡片风格适合发朋友圈有的是底部悬浮按钮风格适合手机端快速操作还有的是仿原生App风格打开后有很强的“这不是网页”的错觉。模板系统的设计思路和CMS的模板替换机制类似把页面中需要动态变化的内容抽象成占位符比如收款昵称、收款金额、收款码图片地址、页面标题等模板文件里写死布局和样式后端在渲染时把占位符替换成实际数据。这样做的好处是新增一套模板只需要写HTML和CSS不用改PHP逻辑。这个设计对使用者来说也是最友好的生成收款页时下拉框里选一套模板提交后页面就按照所选模板来渲染。如果默认模板看腻了或者风格和店铺不搭换一套就行完全不需要动代码。对于想做二次开发的人来说这个模板机制也很容易扩展后面我会专门讲怎么开发一套自己的模板。2. 三合一收款页的核心原理UA识别与收款码展示2.1 扫码之后怎么知道是用哪个App扫的这是整个三合一收款页最核心的技术点也是很多第一次接触这个源码的人最好奇的地方页面怎么知道用户是用微信扫的还是支付宝扫的答案是通过HTTP请求头里的User-Agent简称UA。当用户在微信里扫二维码打开的其实是微信内置浏览器这个浏览器的UA字符串里会带上“MicroMessenger”字样支付宝内置浏览器的UA里有“AlipayClient”QQ内置浏览器则通常带“QQ/”或者“MQQBrowser”字样。后端PHP可以通过$_SERVER[HTTP_USER_AGENT]拿到这段字符串然后用strpos做关键词匹配判断是哪个扫码环境。核心判断代码大致长这样$ua isset($_SERVER[HTTP_USER_AGENT]) ? $_SERVER[HTTP_USER_AGENT] : ; if (strpos($ua, AlipayClient) ! false) { $channel alipay; // 支付宝 } elseif (strpos($ua, MicroMessenger) ! false) { $channel wechat; // 微信 } elseif (strpos($ua, MQQBrowser) ! false || strpos($ua, QQ/) ! false) { $channel qq; // QQ } else { $channel unknown; // 其他浏览器兜底处理 }拿到$channel之后页面模板就根据这个值来输出对应的收款码图片地址。如果是支付宝渠道就显示支付宝收款码微信渠道就显示微信收款码QQ渠道就显示QQ收款码。整套逻辑看起来简单但实际开发中有几个细节要注意。第一支付宝的UA并不是所有情况下都带“AlipayClient”。如果用户把二维码图片保存下来再用支付宝App内的“扫一扫”去识别相册图片打开的页面UA仍然是支付宝内置浏览器带AlipayClient这种情况没问题。但如果用户是在PC端用支付宝扫码支付页面里的二维码然后跳转到普通浏览器打开你的收款页那UA就不带了这时无法自动识别。所以模板里最好做一个兜底自动识别失败时把三个平台的收款码按钮都展示出来让用户手动选择。第二QQ的UA特征比较杂。手机QQ内置浏览器的UA通常包含“QQ/”加版本号而QQ浏览器App的UA则包含“MQQBrowser”。为了兼容判断条件里两个都得写上。但要注意“QQ/”这个特征太宽泛某些应用的WebView也可能包含它所以判断顺序上最好把MQQBrowser放在QQ/前面避免误判。2.2 从用户上传到二维码生成的完整链路三合一收款码的完整生成链路可以分成前端和后端两条线来看。前端用户的视角很简单打开后台填写昵称、上传三张收款码、选择模板、点击生成系统返回一个收款页链接和一张二维码图片。但这个过程中间发生了很多事。先说数据存储简易版源码通常不用MySQL而是把配置和数据写成JSON文件每个生成的收款页生成一个唯一ID用这个ID做文件名存到data目录下。比如生成ID是ab12cd34那么数据文件就是data/ab12cd34.json。数据文件里面存了这些字段{ id: ab12cd34, nickname: 老王杂货铺, title: 扫码付款, amount: , alipay: /uploads/ab12cd34_alipay.png, wechat: /uploads/ab12cd34_wechat.png, qq: /uploads/ab12cd34_qq.png, template: default, create_time: 1710000000 }然后是收款页的访问逻辑。收款页的URL通常会设计成/pay/{id}.html或者/pay.php?idab12cd34这种形式。用户扫码访问这个URLPHP根据ID读取对应的JSON数据再读取模板文件把昵称、收款码图片地址等变量替换进模板最后输出HTML。输出之前PHP会做一次UA判断把判断结果也传给模板模板里就能决定默认展示哪一张收款码。最后是二维码生成。收款页URL确定之后源码会用phpqrcode把完整URL编码成二维码图片输出给用户下载。这里有一点要特别注意二维码图片编码的不能是收款链接的“临时预览地址”而是最终对外访问的URL。很多人在本地调试时生成的二维码扫出来是127.0.0.1或者localhost手机当然打不开这就是因为生成二维码时用的链接地址写错了。2.3 识别失败时的兜底方案UA识别虽然方便但它不是100%可靠的因为用户不一定总是从这三个App里扫码。最典型的情况是用户用系统相机扫码打开的是系统浏览器UA里既没有AlipayClient也没有MicroMessenger。用户用淘宝、抖音等App内置浏览器扫码UA特征千奇百怪可能被误判。用户把收款页链接转发到PC端浏览器打开后没有手机扫码环境自动识别自然失效。所以成熟的源码都会在模板里加一个“手动选择支付方式”的功能。自动识别成功时页面默认展示对应平台的收款码同时下面保留三个小按钮允许用户手动切换自动识别失败时页面不做默认判断而是把三个按钮做成大按钮让用户自己点。还有一种更稳妥的做法在收款页URL后面加一个type参数比如/pay/ab12cd34.html?typealipay这个参数可以强制指定展示哪个平台的收款码。这样无论是测试还是用户手动切换都能通过URL参数来控制而完全依赖UA识别。我的经验是自动识别加手动兜底两种方式结合实际使用中的投诉率会降到最低。3. 实操过程部署源码并在线生成三合一收款码3.1 环境准备PHP版本、扩展与伪静态部署这套源码前先把环境准备好。我测试过的版本要求PHP 7.2以上推荐PHP 7.4或者8.0。没有硬性依赖MySQL所以不需要建数据库这对很多新手来说友好不少。必装的PHP扩展有这几个GD库生成二维码和图片压缩用、fileinfo上传图片类型校验用、curl如果二维码生成走第三方接口才需要用本地库的话可以不开。如果你用的是宝塔面板可以通过“软件商店”“PHP版本”“设置”“安装扩展”里直接安装fileinfo和GD库。装完记得重启PHP服务。服务器方面Nginx和Apache都可以但需要配置伪静态规则目的是让用户访问/pay/ab12cd34.html这种URL时能正确路由到入口文件或者至少能让普通带?参数的访问方式正常工作。如果你不想折腾伪静态也有办法所有链接都使用带参数的访问方式比如/index.php?cpayidab12cd34这样不需要任何Rewrite规则也能跑只是URL不够好看。在线生成二维码时二维码里存的就是这种带参数的URL不影响功能。两者选其一我建议能配伪静态就配上因为分享出去的链接更干净。3.2 源码目录结构与运行逻辑下面这个目录结构是我部署过程中整理出来的不同的源码版本可能略有差异但大方向是一致的/ ├── index.php // 入口负责路由和控制器分发 ├── install/ │ └── index.php // 在线安装向导首次访问时初始化配置 ├── config.php // 全局配置网站URL、上传目录、默认模板等 ├── data/ // 生成记录存放目录JSON文件 ├── uploads/ // 上传的收款码图片目录 ├── templates/ │ ├── default/ │ │ ├── index.html // 模板文件带占位符 │ │ ├── style.css │ │ └── preview.png // 模板缩略图 │ └── card/ │ ├── index.html │ └── style.css ├── api/ │ └── generate.php // 在线生成接口接收表单提交 ├── pay/ │ └── index.php // 收款页渲染接口读取数据并输出HTML └── qrcode.php // 二维码生成接口整个运行逻辑其实是个轻量MVC结构。用户访问install/index.php完成初始化配置后config.php里会写入站点URL等参数。之后用户进后台表单页提交收款信息表单提交到api/generate.php这个接口保存上传图片、生成JSON记录、返回收款页链接。用户拿到链接后分享出去其他用户访问收款页pay/index.php读取JSON数据、拼接模板、输出HTML。整个链路没有数据库非常简单粗暴但足够稳定。3.3 在线生成收款页的操作流程部署完成之后实际生成一个收款页的操作流程是这样的。第一步先准备好三张收款码图片。注意这里说的收款码不是去下载一张网上找的随机二维码而是你自己在支付宝、微信、QQ里申请的“收款码”图片通常可以在各App的“收付款”页面里保存到手机相册。图片格式建议PNG背景透明或纯色尺寸不要小于300x300否则生成的收款页上图片放大后会很糊。第二步进入后台生成页面填写收款昵称、收款说明比如“老王杂货铺”“请扫码付款”这种。金额字段可以留空也可以填一个固定金额。这里踩坑最多如果你填了金额前端页面上会展示“100.00”但顾客实际扫码付款时能不能直接按100元付取决于你上传的微信收款码图片本身是不是固定金额的收款码。如果是普通收款码顾客打开后还是可以自己输入金额的页面上的金额只是展示给别人看的参考不会生成一个100元的固定二维码。如果你想让顾客扫码后直接付100元需要单独在微信、支付宝里生成对应金额的收款二维码然后上传那张图而不是通过这套源码填金额字段来实现。第三步上传三张收款码图片选择模板点击生成。系统返回一个收款页链接和一张二维码图片你可以把二维码下载下来印成台卡或发到群里。顾客扫码自动识别环境展示对应平台的收款码。3.4 二次开发关键接口参数说明如果你要改源码或者把这套收款码功能嵌入到自己的系统里有两个人接口需要吃透。第一个是api/generate.php它接收POST请求常用字段有nickname、title、amount、template以及三个文件字段alipay_file、wechat_file、qq_file。接口成功后返回JSON里面包含pay_url和qrcode_url两个字段。第二个是qrcode.php它通过GET参数text接收要编码的内容返回二维码图片。假设你想让用户提交后自动把收款页链接保存到自己的业务系统可以这样调用生成接口$postData [ nickname 测试店铺, title 扫码付款, amount , template default, alipay_file new CURLFile(/tmp/alipay.png), // wechat_file、qq_file 同理 ];qrcode.php的调用则更简单一般是把返回的URL当图片地址直接用img src/qrcode.php?texthttps://yourdomain.com/pay/ab12cd34.html width300 height300 /二维码生成时有个细节值得关注phpqrcode库输出的默认容错级别是L但如果你生成的二维码里要放一个比较长的URL建议把容错级别提高到M因为容错级别越高图片上可以容忍的遮挡和破损就越多。有一些源码会把这个参数写死成QR_ECLEVEL_M个人建议不要改成L也别改成HM是兼顾扫码速度和稳定性的最佳选择。4. 内置模板系统的实现与自定义扩展4.1 模板文件结构与占位符替换机制看模板系统里最核心的一个思想HTML模板负责页面长什么样PHP变量负责往哪里填内容。每套模板独立一个目录里面主要是一个index.html文件可能是纯HTML也可能引入自己的CSS和JS。模板里凡是需要动态变化的位置都用大括号包起来的占位符标记。拿默认模板举例里面的内容结构大概是div classpay-card div classshop-name{nickname}/div div classpay-title{title}/div {if amount}div classpay-amount{amount}/div{/if} div classpay-code img src{alipay_code} classcode-image {if channel ! alipay}hidden{/if} / img src{wechat_code} classcode-image {if channel ! wechat}hidden{/if} / img src{qq_code} classcode-image {if channel ! qq}hidden{/if} / /div div classchannel-tabs button>$image imagecreatefromstring(file_get_contents($_FILES[alipay_file][tmp_name])); $width imagesx($image); $targetWidth 750; if ($width $targetWidth) { $ratio $targetWidth / $width; $newWidth $targetWidth; $newHeight intval(imagesy($image) * $ratio); $newImage imagecreatetruecolor($newWidth, $newHeight); imagecopyresampled($newImage, $image, 0, 0, 0, 0, $newWidth, $newHeight, $width, imagesy($image)); imagepng($newImage, $savePath, 8); }注意PNG格式的无损压缩质量参数设成8就可以了不要再高。压缩时有个坑如果源图片是WebP格式imagecreatefromstring不一定能识别报错时会直接白屏。上传前先通过getimagesize检查文件类型不支持webp的PHP版本就提示用户转成PNG或JPG。5.3 域名被拦截或页面被限制访问这类收款页最怕的一件事就是域名被微信或QQ拦截。一旦被拦用户扫码打开会提示“已停止访问该网页”收款流程直接中断。触发拦截的原因很复杂可能是页面内容含敏感词也可能是域名被多人举报还可能是因为页面里有跳转行为被风控识别成恶意营销。从技术层面能做的事比较有限。第一页面内容尽量干净不要放引导分享、诱导关注之类的文案就老老实实展示收款码。第二尽量用一个稳定的域名或子域名来部署收款页。频繁更换域名不仅用户不信任第三方平台的风控也会敏感。第三如果业务量很大建议接入H5支付或Native支付等正规支付渠道而不是长期依赖个人收款码跳转页。不过那就是另外一套系统了不在这个源码的讨论范围里。5.4 问题排查速查表我整理了一张排查表很多问题按着这个表从上往下查基本都能定位原因现象可能原因处理方法二维码扫出来打不开生成二维码时链接用了localhost把config.php里站点URL改成正式域名并在服务器端重新生成页面能打开但只显示一个平台的码UA识别失败或判断顺序有误检查UA匹配顺序优先匹配AlipayClient再MicroMessenger最后MQQBrowser收款码图片显示模糊原图尺寸太小或被压缩过度上传图片不低于500x500压缩目标宽度设为750px上传图片后报错目录没有写权限给uploads和data目录设置755或777权限模板切换后页面样式错乱模板CSS里用了绝对路径改成相对路径或确保域名配置正确生成二维码提示错误PHP GD库未启用在PHP配置里安装GD扩展收款页内容被篡改使用了不安全的生成接口检查api/generate.php是否校验了Token或登录态这套源码的坑大部分集中在环境配置和UA识别上真正涉及业务逻辑的并不多。源码本身不复杂安装过程也不会超过十分钟但如果你理解了底层原理后面无论是换模板、加功能还是排查问题都会顺手很多。最后再分享一个小经验三合一收款码页面我实际测下来自动识别成功率大概在85%左右剩下15%的用户来自各种奇奇怪怪的浏览器。与其纠结怎么提高识别率不如把兜底按钮设计得好看一点。按钮明显、切换流畅、收款码展示清晰要比强行追求“完全自动识别”更实在。收款页面做得再花哨也不如让用户快点付完款重要。本文还有配套的精品资源点击获取