使用webview内嵌的H5项目怎么调起H5支付，包含在app环境下中调起微信支付

最近有一个需求是需要我们把我们的项目打包成H5项目，在甲方的小程序内和APP内试使用

调起微信支付踩了很多坑，在微信内置浏览器以及小程序的webView页面内使用H5支付会展示：请在外部浏览器打开，使用微信公众号也就是（jsapi）支付时，使用wx.chooseWXPay依然会调不起微信支付，才知道没有申请公众号，因此在有甲方能够配合的情况下，最简单的方法就是：
在小程序内放一个空白的支付页面，在小程序内的webview打开我们的小程序到支付流程时跳转小程序的空白支付页拉起支付，支付成功或失败时继续跳转回我们的待支付页面。
只需要在空白页面调用小程序的官方api的requestPayment方法就行，参数从我们的h5的页面调用下单接口返回的参数，跳转小程序空白支付页时带上就行。
在app中调起支付还是使用的是H5支付，需要在H5项目中判断是微信内置还是外部浏览器。

在H5项目的下单页面的点击支付方法中

// #ifdef H5
    let linkUrl = data.mwebUrl;    //下单接口返回的mwebUrl，后台处理了链接，将时间戳等一些参数拼接后返回
    //encodeURIComponent转译，避免某些字符传参被限制
    let redirectUrl = '&redirect_url=' +encodeURIComponent(打包后h5页面的下单页面的链接)
    // 首先判断是否是微信内置浏览器，然后再去判断机型android iOS
    var uExplorer = window.navigator.userAgent.toLowerCase()
    //微信内置环境
    if (/micromessenger/.test(uExplorer)) {
        wx.miniProgram.getEnv((res)=>{   
            if (res.miniprogram) {
                //在微信内，在小程序内。
                data.orderId = this.orderId;    //把H5页面的订单ID带着便于支付完成后返回当前H5订单页面查看支付详情
                 // 在小程序内打开此h5页面会返回小程序的参数
                let wxParam = JSON.stringify(data) 
                //跳转小程序的空白支付页面
                wx.miniProgram.navigateTo({url: "/pages/payment/payParams?param="+wxParam});
                return
            }else{
                //在微信内置浏览器，不在小程序里
                console.log("不支持当前调起的支付方式")
                return
            }
        })
    } else {
        const system = uni.getSystemInfoSync()
        //在ios的外部浏览器或者在ios的App中调起h5支付后重定向返回当前下单的h5页面
        if (system.platform == 'ios') {
            window.location.href = linkUrl+redirectUrl
        } else {
            //在android的外部浏览器或者在android的App中调起h5支付
            window.open(linkUrl+redirectUrl)
        }
    }
// #endif

放在小程序里的空白支付页面，直接调用小程序支付

<template>
    <view>
        <web-view :src="pageUrl" v-if="pageUrl">
        </web-view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                pageUrl:''
            }
        },
        onLoad(options){
            if(options.param){
                this.param = JSON.parse(options.param)
                this.pay(this.param)
            }
        },
        methods: {
            pay(data){
                var that = this;
                uni.requestPayment({
                    provider: 'wxpay',
                    timeStamp: data.timestamp,
                    nonceStr: data.noncestr,
                    package:  data.package,
                    signType: 'MD5',
                    paySign: data.sign,
                    success(res) {
                        uni.showToast({
                            title: '微信支付成功',
                        })
                        // 测试
                        that.pageUrl = H5下单页面的链接+订单号;
                    },
                    fail(res) {
                        uni.showToast({
                            title: '微信支付失败',
                            icon: 'none'
                        })
                        that.pageUrl = H5下单页面的链接+订单号;
                    },
                    complete(res) {
                        
                    }
                })
            }
        }
    }
</script>

这样实现的微信支付给用户的操作感受比较良好，即使在小程序内空白页调起支付也不会有不流畅的感觉，因为拉起支付后屏幕会出现一层黑色的图层，支付完成或失败后都返回的是之前的H5下单页面，想要重新支付那么就重新点击H5页面的支付按钮会重复以上流程。
用H5调起微信支付就这么完成了，可在APP（Android&iOS）中嵌套H5进行拉取H5支付，也可在小程序内跳转H5页面进行微信支付。