uni-app的支付与打包上传

最新推荐文章于 2024-08-12 22:18:27 发布

人生不求满

最新推荐文章于 2024-08-12 22:18:27 发布

阅读量197

点赞数

分类专栏： uni-app 文章标签： uni-app

本文链接：https://blog.csdn.net/m0_72967249/article/details/128141606

版权

本文详细介绍了uni-app的支付流程，包括准备工作、微信支付的实现、小程序支付的步骤，以及uni-app项目的HTML打包上传、微信小程序打包上传和App打包上传到应用商店的过程，涉及配置、代码示例及注意事项。

摘要由CSDN通过智能技术生成

支付

准备工作

支付厂商：获取id
- 微信：微信支付平台
  https://pay.weixin.qq.com/
打包时候
- 在manifest.json文件里配置
  - app模块配置
  - payment支付

app的支付步骤

01 获取支付厂商：uni.getProvider()
```
uni.getProvider({service: "payment"})
```
02 用户发起支付：
```
requestPayment(item,index){}
```
03 获取订单信息：
```
getOrderInfo(item.id)
```

04 发起支付api

uni.requestPayment({
   provider:item.id, //提供商
   orderInfo: orderInfo, //订单信息
})

App支付完整代码

template

<template>
	<view>
		<view class="title">支付</view>
	
		<view>
			支付金额：<input :value="price" maxlength="4" @input="priceChange" placeholder="请求输入支付金额" />
			<view>
				<!-- app支付 -->
				<!-- #ifdef APP-PLUS -->
			 
				<button size="mini" type="primary" v-for="(item,index) in providerList" :key="item.id" :loading="item.loading"  @click="requestPayment(item,index)">{
    {item.name}}支付</button>
				
			 
				<!-- #endif -->
				</view>
				
		</view>
	</view>
</template>

script

<script>
	export default {
		data() {
			return {
				price:1,
				providerList: [], //支付厂商，微信，或者支付
				openid:'' ,//用户id
				loading:false,//小程序微信支付
			}
		},
		onLoad(){
			var that  = this;
			// 获取支付厂商
			uni.getProvider({
				service: "payment",
				success: (e) => {
					console.log(JSON.stringify(e))
					var pr