H5 网站支付宝支付(前端部分)包含微信浏览器中的处理方法。

手机网站唤起支付宝支付:

H5 网站实现支付宝支付是一个很常见的需求;

实现方式主要是在后台配置和预支付,

前端需要做的就是唤起 支付宝App 然后就可以输入密码支付。

这个其实难度很低, 主要就是在后台返回的签名加上支付宝给的 基本访问前缀 拼接 URL 然后通过方法 window.location.href 方法打开拼接后的 URL 即可唤起支付宝支付。

微信浏览器打开网站使用支付宝支付:

这个比较坑爹,微信浏览器会当掉 支付宝的 URL 链接,只能去浏览器中打开就可

1.一般直接通过 window.location.href 打开拼接成的 URL 后直接在页面打开输出很长一串字符让用户复制去浏览器中打开这个体验很差。

2.比较合适的做法是在页面输出字符串的这个页面不主动打开 URL, 而是提醒用户去手机浏览器中打开此页面,在页面上显示一个按钮,

然后这个按钮绑定一个方法来执行打开 URL 的动作,即可完成完成绕过微信浏览器到 支付宝App支付。

原文地址:https://www.cnblogs.com/zhourongcode/p/10193312.html

时间: 2024-11-03 22:49:56

H5 网站支付宝支付(前端部分)包含微信浏览器中的处理方法。的相关文章

微信浏览器中调用支付宝支付

众所周知,在微信浏览器中是无法唤起支付宝的,会提示请在浏览器中打开,如果非要在微信浏览器中调起支付宝的话,只能是跳出微信浏览器,关于这一点,在支付宝官网给出了一个例子.但是,话说回去,后来我仔细想想,其实真的没有必要非要在微信浏览器中调起支付宝支付(当时真是一根筋啊啊啊...) 支付宝手机网站支付的官方文档: https://doc.open.alipay.com/docs/doc.htm?treeId=203&articleId=105288&docType=1 快速接入: https:

在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"

部分安卓手机微信浏览器中使用XMLHttpRequest 2上传图片显示字节数为0的解决办法

前端JS中使用XMLHttpRequest 2上传图片到服务器,PC端和大部分手机上都正常,但在少部分安卓手机上上传失败,服务器上查看图片,显示字节数为0.下面是上传图片的核心代码: HTML <input type="file" id="choose" capture="camera" accept="image/*"> JavaScript var filechooser = document.getEleme

[JavaScript] js判断是否在微信浏览器中打开

用JS来判断了,经过查找资料终于实现了效果, function is_weixn(){     var ua = navigator.userAgent.toLowerCase();     if(ua.match(/MicroMessenger/i)=="micromessenger") {         return true;     } else {         return false;     } } 通过测试完全通过,无论是android 还是iphone,ipad

微信浏览器中弹窗高度适配

在微信浏览器中,分享弹窗高度适配,原理就是使弹窗高度由内容撑开,主要应用于分享内容为一张很长的图片时,当图片过长,在小屏手机上显示不完全时,等比缩小一定尺寸使其能完全显示,大屏手机则按照原图尺寸显示. 效果图如下: 实现过程如下: 1. html结构 <section v-show="isShare" class="canvas_share"> <div class="share_wrap"> <div id=&qu

关于安卓手机在微信浏览器中无法调起相机的原因

最近功在做公司的一个项目,遇到安卓手机在微信浏览器中更换头像无法调起相机的问题,特来此记录一下. 1.微信没有相机权限,开启就行了. 2.〈input type=“file” accept=“image/*”/〉.图库和相机都能调起. 3.部分冷门手机因系统原因不开放调起相机的权限,无法解决. 原文地址:https://www.cnblogs.com/EassieLee/p/10625427.html

js判断是否是在微信浏览器中打开

// js判断是否是在微信浏览器中打开 function is_weixn(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/MicroMessenger/i)=="micromessenger") { return true; } else { return false; } } console.log(is_weixn()); 原文地址:https://www.cnblogs.com/Knowledge-is-i

微信浏览器中禁止app下载链接的两种处理方法

通过扫描二维码下载APP已成为一个非常方便的方式,微信也成为扫描二维码重要的工具,但是扫描后微信浏览器会对APK和appStore的链接进行屏蔽,导致用户无法正常下载. 提供解决方案:1.使用腾讯应用宝:2.提示用户使用浏览器打开;3.外跳工具 参考了前端开发博客的一篇文章以及进行了改动.采用方案:弹出一个遮罩提示用户在新的浏览器窗口打开.原文链接:http://caibaojian.com/weixin-tip.html 再也不用管微信如何的更新,直接判断微信的ua,然后弹出一个遮罩提示用户在

微信浏览器中页面刷新

判断浏览器类型 微信浏览器无法使用window.location.reload()刷新页面