h5页面 支付宝支付

最新推荐文章于 2024-05-16 01:46:59 发布
最新推荐文章于 2024-05-16 01:46:59 发布
阅读量3.1k 收藏 1
点赞数 1

写的测试流程，比较乱，望勿吐槽

1、提交 支付基础数据

[html]  view plain  copy
  1. <form action="${ctx}/np/h5/restf/np-pay-confirm" method="post" id="payForm" target="_self">  
  2.    <input type="hidden" name="mergeId" id="mergeId" value="${merge_id }">  
  3.    <input type="hidden" name="shop.title" id="shopTitle" value="测试产品">  
  4.    <input type="hidden" name="totalPrice" id="totalPrice" value="${totalPrice }">  
  5.    <input type="hidden" name="totalNum" id="totalNum" value="${totalNum }">  
  6.    <input type="hidden" name="yhId" id="yhId" value="">  
  7. </form>  

2、处理提交的支付数据

[java]  view plain  copy
  1. @RequestMapping("np-pay-confirm")  
  2.     public String payConfirm(@ModelAttribute PersonOrder order,Model model) {  
  3.         请求参数//  
  4.           
  5.         //支付类型  
  6.         String payment_type = "1";  
  7.         //必填，不能修改  
  8.         //服务器异步通知页面路径  
  9.         String notify_url = "http://域名/new/restf/np-alipay-notify";  
  10.         //需http://格式的完整路径，不能加?id=123这类自定义参数  
  11.           
  12.         //页面跳转同步通知页面路径  
  13.         String return_url = "http://域名/h5/person-order-list?yhId="+order.getYhId();  
  14.         //需http://格式的完整路径，不能加?id=123这类自定义参数，不能写成http://localhost/  
  15.           
  16.         //商户订单号  
  17.         String out_trade_no = order.getMergeId();  
  18.         //商户网站订单系统中唯一订单号，必填  
  19.           
  20.         //订单名称  
  21.         String subject = order.getShop().getTitle();  
  22.         //必填  
  23.           
  24.         //付款金额  
  25.         String total_fee = order.getTotalPrice()+"";  
  26.         //必填  
  27.           
  28.         //商品展示地址  
  29.         String show_url = "http://域名/np/web/np-shop-get?yhId="+order.getYhId()+"&distance=KM&isShare=0&type=newpage";  
  30.         //必填，需以http://开头的完整路径，例如：http://www.商户网址.com/myorder.html  
  31.           
  32.         /*//订单描述 
  33.         String body = new String(request.getParameter("WIDbody").getBytes("ISO-8859-1"),"UTF-8"); 
  34.         //选填 
  35.          
  36.         //超时时间 
  37.         String it_b_pay = new String(request.getParameter("WIDit_b_pay").getBytes("ISO-8859-1"),"UTF-8"); 
  38.         //选填 
  39.          
  40.         //钱包token 
  41.         String extern_token = new String(request.getParameter("WIDextern_token").getBytes("ISO-8859-1"),"UTF-8"); 
  42.         //选填 
  43. */        
  44.           
  45.         //  
  46.           
  47.         //把请求参数打包成数组  
  48.         Map<String, String> sParaTemp = new HashMap<String, String>();  
  49.         sParaTemp.put("service", "alipay.wap.create.direct.pay.by.user");  
  50.         sParaTemp.put("partner", "***");  
  51.         sParaTemp.put("seller_id", "***");  
  52.         sParaTemp.put("_input_charset", AlipayConfig.input_charset);  
  53.         sParaTemp.put("payment_type", payment_type);  
  54.         sParaTemp.put("notify_url", notify_url);  
  55.         sParaTemp.put("return_url", return_url);  
  56.         sParaTemp.put("out_trade_no", out_trade_no);  
  57.         sParaTemp.put("subject", subject);  
  58.         sParaTemp.put("total_fee", total_fee);  
  59.         sParaTemp.put("show_url", show_url);  
  60.           
  61.         //建立请求  
  62.         String sHtmlText = AlipaySubmit.buildRequest(sParaTemp,"POST","确认");  
  63.         model.addAttribute("sHtmlText", sHtmlText);  
  64.         return "h5/person/alireturn";  
  65.     }  

3、调用支付组件

alireturn.jsp

[html]  view plain  copy
  1. <html class="no-js">  
  2. <head>  
  3.     <meta charset="utf-8">  
  4.     <meta http-equiv="X-UA-Compatible" content="IE=edge">  
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">  
  6.     <meta name="apple-mobile-web-app-capable" content="yes">  
  7.     <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />  
  8.     <title>登录</title>  
  9.     <meta name="description" content="">  
  10.     <meta name="keywords" content="">  
  11. </head>  
  12. <body>  
  13.     ${sHtmlText}  
  14. </body>  
  15. </html>  
luyinlai
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信中调起支付宝支付
han_calligrapher的博客
11-23 2万+
微信中调用支付宝支付，首先我们知道微信是不能直接调用支付宝的，所以我们需要使用一个中间页提示用户在浏览器中打开，然后进行网页支付或打开app支付。以下为详细唤起支付宝的步骤、业务代码以及相关页面图。 如有问题欢迎评论留言，看到定回复哦^_^\(^o^)/~ 一、微信中唤起支付宝，有几个步骤： 1、中间页引导用户在浏览器中打开去唤起支付宝。 2、浏览器中打开支付宝或app中打开支付宝。 3...
h5 支付宝支付/微信支付
u014105739的博客
01-11 477
h5微信/支付宝支付
html5微信支付 页面效果
10-27
html5微信支付 页面效果
支付宝手机网站H5支付
salestina的博客
08-24 1万+
为方便商家在移动端网页应用中集成支付宝支付功能，支付宝提供了手机网站支付能力。 流程简介：商家在网页中调用支付宝提供的网页支付接口调起支付宝客户端内的支付模块，商家网页会跳转到支付宝中完成支付，支付完后跳回到商家网页内，最后展示支付结果。若无法唤起支付宝客户端，则在一定的时间后会自动进入网页支付流程。
vue 移动端H5微信支付和支付宝支付_vue支付宝手机网站支付中途退出处理
最新发布
2401_85013604的博客
05-16 340
4.在调起支付的页面监听从其他页面返回的事件，进行一些刷新业务逻辑的实现即可，至此微信外支付已经完成。5.【微信内支付】微信内支付比起微信外支付稍微复杂一点，但是也不难，（3步骤代码里面已经请求支付方式接口拿到了微信内支付所需要的参数）根据微信内置js对象 WeixinJSBridge，进行开发，至此微信浏览器内支付已经完成。
H5网页跳转支付宝进行支付
niulinbiao的博客
01-22 3257
支付链接可以是返回的二维码链接。
前端H5微信支付宝支付实现
crj18826694713的博客
08-30 2990
接下来就是重点操作了（其实非常简单），在跳转这个页面之后直接调用后端接口，将数据传给后端生成订单，并且还需要两个地址，一个是取消支付的回调地址（quitUrl），一个是支付完之后的回调地址（returnUrl），后端会根据这些信息生成一个form表单返回给你，我们只需要将这个表单渲染到这个空白页面，并进行提交表单的操作，就会跳转至支付宝的页面去进行支付操作，在取消或支付完成会跳转至之前传给后端规定好的地址，在那里去调后端接口查询支付结果或者重新支付等其他操作就行了。所以首先需要一个方法来判断浏览器的类型。
支付宝h5网页的支付
xiaoqiangbigbrother的博客
05-10 8732
公司的业务一直围绕着微信开发，突然领导接了一个项目开发支付宝生活号。当时是懵逼的赶紧去看支付宝h5页面开发文档，发现支付宝的文档确实比微信好多了不扯了。后端我不太清楚怎么配置，前端这块需要把后台返回过来的一段form表单进行自动提交。前端框架我采用的是vue，下面试我在vue中的使用截图...
Vue的H5页面唤起支付宝支付功能
10-17
目前项目中比较常用的第三方支付无非就是支付宝支付和微信支付。下面介绍一下Vue中H5页面如何使用支付宝支付。这篇文章主要介绍了Vue的H5页面唤起支付宝支付,需要的朋友可以参考下
SpringBoot集成H5微信支付宝支付
02-28
本文将详细讲解如何使用SpringBoot框架集成H5版的微信和支付宝支付功能，以实现安全、便捷的在线交易。 首先，我们需要理解SpringBoot。它是Spring框架的一个轻量级衍生品，简化了初始化和配置过程，使得开发者可以...
php 支付宝h5支付源码完整版
01-21
3. **获取支付二维码/链接**：支付宝返回一个支付二维码或者支付链接，前端H5页面可以展示这个二维码让用户扫描，或者点击链接直接跳转到支付宝支付页面。 4. **用户支付**：用户在支付宝客户端或网页中完成支付操作...
用php的方法在:H5页面唤起支付宝app支付
05-13
在H5页面上唤起支付宝App进行支付是现代电商网站和移动应用常见的功能之一。PHP作为后端语言，可以通过调用微信支付的API接口来实现这一流程。以下将详细讲解如何利用PHP实现H5页面唤起支付宝App支付的过程。 首先...
h5唤醒支付
weixin_43987651的博客
11-26 1465
1.支付宝唤醒支付功能 tradeNO=后台赶回的订单号 tradePay(tradeNO) { if (window.AlipayJSBridge) { window.AlipayJSBridge.call( “tradePay”, { tradeNO: tradeNO }, data => { if (“9000” == data.resultCode) { this.$router.p...
app内嵌h5支付功能，跳转支付宝&微信，vue组件
qq_38068508的博客
03-17 6270
app内前h5涉及到支付的功能，ios非实物商品实付需要使用ios原生支付方式，实物商品则可以三方支付，主要的实现思路为后端返回跳转支付宝或微信的支付scheme链接，前端进行跳转支付，同时需要实时查询用户的支付状态。整个过程中复杂的部分在于查询用户支付状态的体验方面，需要保证用户在支付成功、支付失败、跳转支付宝、微信回来或者没有跳转支付宝微信等未知的行为下的用户体验。为了防止用户在支付时间超过我们设置轮训时长情况，需要监听用户从支付app返回当前页面，来进行查询支付状态操作。
H5页面中调用微信和支付宝支付
weixin_44690156的博客
11-24 8770
最近在工作中，有个H5页面需要实现微信支付和支付宝支付的功能，现在已经完成，抽个时间写出来，分享给有需要的人。 第一步：先判断当前环境 判断用户所属环境，根据环境不同，执行不同的支付程序。 if (/MicroMessenger/.test(window.navigator.userAgent)) { // alert('微信'); } else if (/AlipayClient/.test(window.navigator.userAgent)) { //alert('支付宝');
移动端h5网页调用支付宝支付接口(项目)
admin12345671的博客
04-12 1365
移动端h5网页调用支付宝支付接口 小伙伴儿们自行查看：https://opendocs.alipay.com/open/203/105285 关于手机网页内支付宝支付，核心代码就是，后端会返回给你一个form，然后你拿着这个form去调用就行了。 这样就需要你准备两网页。一个是你写好的盛装后台返回的支付页面，一个是支付成功后，给return_url跳转的成功页面。 并且你可以通过获取网页url参数的方法去根据参数在这个回调页面里做些什么。 首先，我们先请求后端给我们的支付接口。 //点击支付业
vue实现H5支付（微信，支付宝）
热门推荐
努力奔跑的小不点
02-23 2万+
vue实现H5支付（微信，支付宝）
uniapp的H5端微信与支付宝支付（包括PC端与移动端）
F2691898750的博客
05-03 8498
大致流程为请求创建订单接口传递正确参数（例如openid、金额、开始结束时间等），此接口会返回一个图片，或网络图片，或base64图片，这个图片是一张二维码；前端拿到这个二维码渲染到屏幕上并开始启动定时器，每过一秒请求一次查询支付结果接口，查询是否支付成功；支付宝支付可能会给一个跳转链接，直接跳转进入，其中有一个二维码，扫码可完成支付，支付成功或中断的url地址都是在微信商户平台后台配置的；支付成功清除定时器，跳转结果页；以上为流程，那么代码逻辑是就可以跟随流程进行编写以便进行查看，具体流程和代码的逻辑为：
h5页面使用支付宝支付
05-13
要在h5页面上使用支付宝支付，可以通过调用支付宝API实现。具体步骤如下： 1. 在支付宝开放平台注册开发者账号，并创建应用获取应用的AppID和密钥。 2. 在h5页面上引入支付宝提供的JS文件，同时在页面上添加支付...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值