preface

I happened to be in charge of the payment aspects involved in the Hybird APP project recently, including android wechat Pay, Alipay Payment, ios payment and H5 page payment, so TODAY I would like to share with you the way I have realized and part of the source code.

ios

Payments in ios are mainly made by cashing in related virtual coins through things like appStore top-up. Here, we only need to judge whether the virtual currency is enough to pay when we pay. If we can buy it, we will directly call the payment interface, and then jump to the success page. If not, call the API provided by the APP side and jump to the purchase page. (Our purchase page is written natively. So don’t worry about it.)

The android

1. Alipay: Directly use the form form.

// let div = document.createElement("div"); if (res.data.form) { div.innerHTML = res.data.form; document.body.appendChild(div); $nextTick(() => {document.forms[0].submit(); }); this.sendPaying = false; } else {// jump page};Copy the code

WeChat pay 2: use in android WeChat payment need to be the main point, is when we call WeChat pay after the completion of the can’t pay successful jump straight to the page, because in the android get WeChat payment interface will be a delay, so we have to jump to a page, by returning the order number of judging manually click confirm payment to complete payment success.

Window.location.replace (res.data.payurl + "&redirect_url=" + encodeURIComponent(window.location.origin + 'redirect'));Copy the code

h5

1. Wechat payment: Wechat payment requires wechat authorized login (the specific login process code will not be introduced)

/ / use WeChat pay inside WeChat onBridgeReady (data) {let id = this. PayData. OrderIds. Join (", "); id = "wx_" + id; let _this = this; id = encodeURIComponent(id); WeixinJSBridge. Invoke ("getBrandWCPayRequest", {appId: data.params.appId, // Public id, timeStamp: Data.params. timeStamp, // timeStamp, number of seconds since 1970 nonceStr: data.params.nonceStr, // random string package: data.params.package, signType: Data.params. signType, // wechat signature: paySign: Function (res) {if (res.err_msg == "get_brand_wcpay_request: OK ") {// redirect); } else if (res.err_msg == "get_brand_wcpay_request:cancel") {_this.$message.error(" Payment cancelled "); } else {_this.$message.error(" payment failed "); }}); }, this.onBridgeReady(res.data);Copy the code

2. Payment outside wechat: For payment outside wechat, please register WeixinJSBridge first

if (typeof WeixinJSBridge == "undefined") { if (document.addEventListener) { document.addEventListener( "WeixinJSBridgeReady", this.onBridgeReady, false ); } else if (document.attachEvent) { document.attachEvent("WeixinJSBridgeReady", this.onBridgeReady); document.attachEvent("onWeixinJSBridgeReady", this.onBridgeReady); }}Copy the code

The last

The above is all the payment methods and codes, using wechat and Alipay payment is required to configure the white list can be paid, if there is something unclear or wrong welcome to come to exchange…