uniapp实现微信小程序支付(前端)详细代码

uni.request({
    url:"请求路径",
    method:"方法",
    data:{
        后端需要的数据
    }，
    success(payRes){
        //payRes这里主要有几个参数后面会调取uni的支付接口需要使用，下面会介绍每个数据
        //这个请求结束后就是前端最重要的步骤了，需要拉起支付密码框来完成支付
        
        uni.requestPayment({
		    "provider": "wxpay",//支付方式  
			"timeStamp":payRes.data.timeStamp,//时间戳
			"nonceStr":payRes.data.nonceStr,//随机字符串
			"package":payRes.data.package,//接口返回的prepay_id
			"signType":payRes.data.signType,//签名算法，需要与后台下单时一致
			"paySign":payRes.data.paySign,签名
			success: function (resSuccess) {
				//触发该success时已经是输入密码支付成功后触发，可做一些页面跳转和成功提示						
             },
									
			fail: function (err) {
                //支付失败时出发，比如取消支付、余额不足等
			}
		});
        
    }
})

<script>
//这里两种引入方式 一种是node的require，还有一种就是常用的import的方式引入 效果都一样
const jweixin = require("jweixin ")

export default {
    data(){
        return {

        }        
    },

    methods:{

        uni.request({
            url:"请求路径",
            method:"方法",
            data:{
                后端需要的数据
            }，
            success(payRes)=>{

                 payMent(){

                //首先要对jweixin进行初始化配置
                jweixin.config({
                    debug:false,//是否开启调度模式，开启测试支付时会有弹窗
                    appId: payRes.data.appId, // 公众号的唯一标识
					timestamp: payRes.data.timeStamp, // 生成签名的时间戳
					nonceStr: payRes.data.nonceStr, // 生成签名的随机串
					signature: payRes.data.signType, //签名
					jsApiList: ['chooseWXPay'] // 必填
                })

                jweixin.chooseWXPay({
	                timestamp: payRes.data.timeStamp, // 支付签名时间戳
					nonceStr: payRes.data.nonceStr, // 支付签名随机串，不长于 32 位
					package: payRes.data.package, // 统一支付接口返回的prepay_id参数值
					signType: payRes.data.signType, // 签名方式
					paySign: payRes.data.paySign, // 支付签名
                    success(res){
                        //成功
                    },
                    fail(res){
                        //失败
                    }
                })
             }
        
            }
        })
    }
}
</scrpit>

//跳转页面
<script>
export default{
    methods:{
        goPage(){
            uni.navihateTo({
                url:`/page/webView/webView?url=${encodeURIComponent（"访问地址"）)}`
            })
        }
    }        
}
</script>
//web-view
<template>
    <web-view :src="url"></web-view>
</template>
<script>
export default{
    data(){
        return {
            url:""
        }
    }
    onLoad(option){
        this.url =decodeURIComponen(option.url)
    }
}
</script>