H5调起IOS原生商店支付
参考文档:http://www.html5plus.org/doc/zh_cn/payment.html
申请内购项目摘自 https://www.jianshu.com/p/1e79bfbe46e2
<template>
<div id="app">
<h3 @click="pay(ids[0])"></h3>
</div>
</template> <script>
export default {
data() {
return {
iap: {},
ids: ["donation6","donation"],//应用内购项目,需要申请
}
},
created() {
document.addEventListener("plusready", function() {
//console.log("所有plus api都应该在此事件发生后调用,否则会出现plus is undefined。"
});
document.addEventListener("plusready",this.plusReady(),false);
},
methods: {
plusReady() {
let _this = this;
// 获取支付通道
plus.payment.getChannels(
function(channels) {
for (var i in channels) {
var channel = channels[i];
// 用于标识支付通道: "alipay" - 表示支付宝; "wxpay" - 表示微信支付; "appleiap" - 表示苹果应用内支付; "qhpay" - 表示360聚合支付(仅360手助流应用环境下支持)。
if (channel.id === "appleiap") {
_this.iap = channel;
_this.requestOrder();
}
}
},
function(e) {
console.log("获取支付通道失败:" + e.message);
}
);
},
requestOrder() {
let _this = this;
plus.nativeUI.showWaiting("检测支付环境...");
_this.iap.requestOrder(_this.ids,function(e) {
plus.nativeUI.closeWaiting();
console.log("requestOrder success: " + JSON.stringify(e));
},function(e) {
console.log("requestOrder failed: " + JSON.stringify(e));
plus.nativeUI.closeWaiting();
plus.nativeUI.confirm("错误信息:" + JSON.stringify(e),
function(e) {
if (e.index == 0) {
_this.requestOrder();
} else {
// back();
}
},
"重新请求支付",["确定", "取消"]
);
}
);
},
// 支付
pay(id) {
let _this = this;
plus.nativeUI.showWaiting("", {style: "black",background: "rgba(0,0,0,0)"});
plus.payment.request(_this.iap,{ productid: id },function(result) {
plus.nativeUI.closeWaiting();
_this.fetchPayStatus(result);
},
function(e) {
console.log("错误信息",e)
plus.nativeUI.closeWaiting();
plus.nativeUI.alert(
"错误信息:" + e.message,
null,
"支付失败:" + e.code
);
}
);
},
fetchPayStatus(result) {
// let ordercode = window.location.href.split("ordercode=")[1]; //收集支付需要专递的参数
// console.log("ordercode", ordercode);
axios({
method: "post",
url: "https://pay.52xxxxxdd.cn/PaiyxApxxxxxple/appxxxxxxcion",//换成自己请求支付的接口
headers: {
"Content-Type": "application/x-www-form-urlencoded",
Accept: "application/json, text/plain, */*"
},
data: `transactionId=${result.transactionIdentifier}&receipt=${result.transactionReceipt}`,//传递的参数
})
// .then(res => {
// if(res.data.code === 1){
// window.location.href = `${window.location.origin}/bzjp/detail.html?ordercode=${ordercode}`;
// }
// });
},
}
}
</script>
H5调起IOS原生商店支付的更多相关文章
- h5 调起ios数字键盘的坑,限制特殊字符输入方案
最近有个需求是利率只允许输入数字和小数点,用以下 <input type="number" pattern="[0-9]*"> 在ios会调起数字键 ...
- 混合app开发,h5页面调用ios原生APP的接口
混合APP开发中,前端开发H5页面,不免会把兼容性拉进来,在做页面的兼容性同事,会与原生app产生一些数据交互: 混合APP开发,安卓的兼容性倒是好说,安卓使用是chrome浏览器核心,已经很好兼容H ...
- Android H5调起原生微信或支付宝支付
Android H5调起原生微信或支付宝支付 WebView调用原生微信或支付宝回调:其原理就是在shouldOverrideUrlLoading(final WebView view, String ...
- 企业号微信支付 公众号支付 H5调起支付API示例代码 JSSDK C# .NET
先看效果 1.本文演示的是微信[企业号]的H5页面微信支付 2.本项目基于开源微信框架WeiXinMPSDK开发:https://github.com/JeffreySu/WeiXinMPSDK 感谢 ...
- Java微信公众平台开发之公众号支付(微信内H5调起支付)
官方文档点击查看准备工作:已通过微信认证的公众号,必须通过ICP备案域名(否则会报支付失败)借鉴了很多大神的文章,在此先谢过了 整个支付流程,看懂就很好写了 一.设置支付目录 在微信公众平台设置您的公 ...
- java版微信公众号支付(H5调微信内置API)
最近需要做微信公众号支付,网上找了大堆的代码,大多都只说了个原理,自己踩了太多坑,所有的坑,都会再下面的文章中标注,代码我也贴上最全的(叫我雷锋)!!! 第一步:配置支付授权目录 你需要有将你公司的微 ...
- vue 微信内H5调起支付
在微信内H5调起微信支付,主要依赖于一个微信的内置对象WeixinJSBridge,这个对象在其他浏览器中无效. 主要代码: import axios from 'axios'; export def ...
- iOS原生App与H5页面交互笔记
文/MikeZhangpy(简书作者)原文链接:http://www.jianshu.com/p/4ed3e5ed99c6著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 最近在做一个项 ...
- IOS开发--支付宝支付
前言:继上次<IOS开发--微信支付>以来,一直没有太多时间,更新总结详细支付这样的长篇大论,很抱歉.今天,推出支付宝支付的详细流程. 1.开始下载和查看支付宝支付的Demo. 我们直接进 ...
随机推荐
- [Beta]第三次 Scrum Meeting
[Beta]第三次 Scrum Meeting 写在前面 会议时间 会议时长 会议地点 2019/5/7 22:00 30min 大运村公寓6F寝室 附Github仓库:WEDO 例会照片 工作情况总 ...
- 【转】谈谈servlet、spring、struts
今年我一直在思考web开发里的前后端分离的问题,到了现在也颇有点心得了,随着这个问题的深入,再加以现在公司很多web项目的控制层的技术框架由struts2迁移到springMVC,我突然有了一个新的疑 ...
- 如何使用Salt Pillar
作者言 Salt的网站上有两篇关于Pillar的文档(一,二),其中一篇内容很少,我觉得写成一篇文章更合适.本文的逻辑结构没有参照官方文档,而是根据我自己对Pillar的理解组织内容,希望能够把这个概 ...
- ora-8176原因及解决方法
在oracle undo_retention范围内,且_undo_autotune=false的情况下,一个语句执行的时候仍然发生ora-8176,语句如下: INSERT INTO XXX SELE ...
- java捕获一个网站页面的全部图片
直接上代码: package com.jeecg.util; import java.io.BufferedReader; import java.io.FileNotFoundException; ...
- 《你必须知道的javascript(上)》- 2.this与对象原型
1 关于this 1.1 为什么使用this 随着你的使用模式越来越复杂,显式传递上下文对象会让代码变得越来越混乱,使用this则不会这样.当我们介绍对象和原型时,你就会明白函数可以自动引用合适的上下 ...
- mysql全文索引:fulltext
fulltext全文索引 要使用全文索引,不仅需要把某个字段的索引类型设置为fulltext,还需要修改mysql配置文件: [mysqld] ft_wordlist_charset #表示词典的字符 ...
- matlab学习笔记11_2高维数组操作 squeeze,ind2sub, sub2ind
一起来学matlab-matlab学习笔记11 11_2 高维数组处理和运算 squeeze, ind2sub, sub2ind 觉得有用的话,欢迎一起讨论相互学习~Follow Me squeeze ...
- Linux故障排查之CPU占用率过高
有时候我们可能会遇到CPU一直占用过高的情况.之前我的做法是,直接查找到相关的进程,然后杀死或重启即可.这个方法对于一般的应用问题还不大,但是要是是重要的环境的话,可万万使不得. 如果是重要的环境,那 ...
- LeetCode的一道题引申的python实现的对字符串进行分词,提取词频的方法
在LeetCode上刷一道题,题目如下: 3. 无重复字符的最长子串 给定一个字符串,请你找出其中不含有重复字符的?最长子串?的长度. 示例?1: 输入: "abcabcbb"输出 ...