czg_team/merchant_h5_pay
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化请求配置

Browse Source
This commit is contained in:
gyq
2026-01-29 17:41:38 +08:00
parent 5586573ff1
commit 696a39da99
9 changed files with 1955 additions and 347 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
api/http.js
View File

@@ -15,7 +15,8 @@ import {
} from '@/commons/utils/encryptUtil.js' } from '@/commons/utils/encryptUtil.js'
import infoBox from "@/commons/utils/infoBox.js" import infoBox from "@/commons/utils/infoBox.js"
// let baseUrl = '' // let baseUrl = ''
let baseUrl = 'https://cashier-client.sxczgkj.cn/cashier-client' let baseUrl = 'https://cashier.sxczgkj.com'
// let baseUrl = '/api'
// 多少 ms 以内， 不提示loading // 多少 ms 以内， 不提示loading
const loadingShowTime = 200 const loadingShowTime = 200

45
api/index.js
View File

@@ -1,5 +1,5 @@
import http from './http.js' import http from './http.js'
const request=http.request const request = http.request
/** /**
@@ -7,11 +7,11 @@ const request=http.request
* @returns * @returns
*/ */
export function createOrder(data) { export function createOrder(data) {
return request({ return request({
url: `/pay/createOrder`, url: `/order/pay/shopPayApi/js2Pay`,
method: 'post', method: 'post',
data data
}) })
} }
/** /**
@@ -19,11 +19,12 @@ export function createOrder(data) {
* @returns * @returns
*/ */
export function getOpenId(params) { export function getOpenId(params) {
return request({ console.log('获取支付宝userId 或 微信openIdparams', params);
url: `/pay/openId`, return request({
method: 'get', url: `/account/user/openId`,
params method: 'get',
}) params
})
} }
/** /**
@@ -31,11 +32,11 @@ export function getOpenId(params) {
* @returns * @returns
*/ */
export function orderorderInfo(params) { export function orderorderInfo(params) {
return request({ return request({
url: `/pay/noToken/queryOrderInfo`, url: `/pay/noToken/queryOrderInfo`,
method: 'get', method: 'get',
params params
}) })
} }
/** /**
@@ -43,9 +44,9 @@ export function orderorderInfo(params) {
* @param {Object} data * @param {Object} data
*/ */
export function cancelOrderPay(data) { export function cancelOrderPay(data) {
return request({ return request({
url: `/notify/cancel`, url: `/notify/cancel`,
method: 'post', method: 'post',
data data
}) })
} }

19
main.js
View File

@@ -1,4 +1,7 @@
import App from './App' import App from './App'
import vConsloe from 'vconsole'
new vConsloe()
// #ifndef VUE3 // #ifndef VUE3
import Vue from 'vue' import Vue from 'vue'
@@ -8,17 +11,19 @@ import './uni.promisify.adaptor'
Vue.config.productionTip = false Vue.config.productionTip = false
App.mpType = 'app' App.mpType = 'app'
const app = new Vue({ const app = new Vue({
...App ...App
}) })
app.$mount(); //为了兼容小程序及app端必须这样写才有效果 app.$mount(); //为了兼容小程序及app端必须这样写才有效果
// #endif // #endif
// #ifdef VUE3 // #ifdef VUE3
import { createSSRApp } from 'vue' import {
createSSRApp
} from 'vue'
export function createApp() { export function createApp() {
const app = createSSRApp(App) const app = createSSRApp(App)
return { return {
app app
} }
} }
// #endif // #endif

2
manifest.json
View File

@@ -64,7 +64,7 @@
"proxy" : { "proxy" : {
"/api" : { "/api" : {
// 需要被代理的后台地址 // 需要被代理的后台地址
"target" : "https://cashier-client.sxczgkj.cn/cashier-client", "target" : "https://cashier.sxczgkj.com",
"changeOrigin" : true, "changeOrigin" : true,
"secure" : false, "secure" : false,
"pathRewrite" : { "pathRewrite" : {

3
package.json
View File

@@ -6,5 +6,8 @@
"jweixin-module": "^1.6.0", "jweixin-module": "^1.6.0",
"uni-simple-router": "^2.0.8-beta.4", "uni-simple-router": "^2.0.8-beta.4",
"vue-router": "^4.4.5" "vue-router": "^4.4.5"
},
"devDependencies": {
"vconsole": "^3.15.1"
} }
} }

649
pages/index/index.vue
View File

@@ -2,388 +2,409 @@
<view class="content"> <view class="content">
<view class="info"> <view class="info">
<image class="shopImage" :src="shopImage"></image> <image class="shopImage" :src="shopImage"></image>
<view class="shopName">{{shopName}}</view> <view class="shopName">{{ shopName }}</view>
</view> </view>
<view class="input"> <view class="input">
<view class="payAmount">￥<input :disabled="disabled" @input="formatAmount" class="amount" v-model="payAmount" type="digit"></view> <view class="payAmount">
<input class="remark" v-model="remark" type="text" placeholder="添加付款备注(最多10个字)"> ￥
<input :disabled="disabled" @input="formatAmount" class="amount" v-model="payAmount" type="digit" />
</view>
<input class="remark" v-model="remark" type="text" placeholder="添加付款备注(最多10个字)" />
</view> </view>
<view class="btn" @click="createOrder">立即付款</view> <view class="btn" @click="createOrder">立即付款</view>
</view> </view>
</template> </template>
<script> <script>
import { getOpenId, createOrder, cancelOrderPay } from '@/api/index.js';
import { getOpenId , createOrder , cancelOrderPay } from '@/api/index.js' export default {
export default { data() {
data() { return {
return { payAmount: '',
payAmount: "", openId: null,
openId: null, // openId: '2088112837517234',
shopImage: null, shopImage: null,
shopName: null, shopName: null,
shopId: null, shopId: null,
orderId: null, orderId: null,
remark: "", remark: '',
payType: "", payType: '',
disabled: false, disabled: false
};
},
onLoad() {},
onShow() {
this.shopId = this.getUrlParam('shopId');
this.orderId = this.getUrlParam('orderId');
if (this.getUrlParam('payAmount')) {
this.payAmount = this.getUrlParam('payAmount');
this.disabled = true;
}
document.body.addEventListener(
'touchmove',
function (e) {
e.preventDefault(); //阻止默认的处理方式(阻止下拉滑动的效果)
},
{ passive: false }
); //passive 参数不能省略，用来兼容ios和android
this.login();
},
mounted() {},
methods: {
formatAmount(event) {
// 必须在nextTick中
this.$nextTick(() => {
this.payAmount = event.target.value.match(/^\d*(\.?\d{0,2})/g)[0];
});
// e.detail.value = (e.detail.value.match(/^\d*(.?\d{0,2})/g)[0]) || ""
// this.$nextTick(() => {
// this.payAmount = e.detail.value
// })
},
/**
* 判断是否为微信环境
*/
isWechat() {
var ua = navigator.userAgent.toLowerCase();
var isWXWork = ua.match(/wxwork/i) == 'wxwork';
var isWeixin = !isWXWork && ua.match(/MicroMessenger/i) == 'micromessenger';
return isWeixin;
},
/**
* 判断是否为支付宝环境
*/
isAlipay() {
let userAgent = navigator.userAgent;
return /AlipayClient/.test(userAgent);
},
/**
* 获取微信/支付宝code
*/
login() {
// 获取微信code
if (this.isWechat()) {
let _code = this.getUrlParam('code');
uni.setStorageSync('code', _code);
if (_code == null || _code === '') {
// 传当前页面的URL（微信授权完之后返回到的页面）和 登录方式
this.getWXCode(window.location.href, 'snsapi_userinfo');
} else {
this.payType = 'WECHAT';
// this.getOpenId(_code,"wx212769170d2c6b2a"); //微信 WECHAT； 支付宝 ALIPAY；
this.getOpenId(uni.getStorageSync('code'), 'wx212769170d2c6b2a'); //微信 WECHAT； 支付宝 ALIPAY；
}
} }
},
onLoad() { // 获取支付宝code
}, if (this.isAlipay()) {
onShow () { let _code = this.getUrlParam('auth_code');
this.shopId = this.getUrlParam("shopId"); console.log('获取支付宝code', _code);
this.orderId = this.getUrlParam("orderId"); if (_code == null || _code === '') {
if ( this.getUrlParam("payAmount") ) { // 传当前页面的URL（支付宝授权完之后返回到的页面）和 登录方式
this.payAmount = this.getUrlParam("payAmount"); this.getAlipayCode(window.location.href, 'auth_user');
this.disabled = true; } else {
this.payType = 'ALIPAY';
this.getOpenId(_code, '2021004174605036'); //微信 WECHAT； 支付宝 ALIPAY；
}
} }
// this.getOpenId('1321312123123', '2021004174605036');
document.body.addEventListener('touchmove', function (e) {
e.preventDefault(); //阻止默认的处理方式(阻止下拉滑动的效果)
}, {passive: false}); //passive 参数不能省略，用来兼容ios和android
this.login()
}, },
mounted() { /**
* 获取微信/支付宝openid
* @param {Object} code
* @param {Object} payType
*/
getOpenId(code, appId) {
let params = {
code: code,
// payType: this.payType, //微信 WECHAT； 支付宝 ALIPAY；
// appId: appId, //微信 WECHAT； 支付宝 ALIPAY；
source: this.payType == 'WECHAT' ? 'wechat' : 'alipay',
shopId: this.getUrlParam('shopId') //微信 WECHAT； 支付宝 ALIPAY；
};
getOpenId(params).then((res) => {
if (res.code == 0) {
this.openId = res.data.openId;
this.shopImage = res.data.shopImage;
this.shopName = res.data.shopName;
// this.createOrder(res.data,payType);
} else {
uni.showToast({
title: res.msg,
icon: 'none'
});
}
});
}, },
methods: {
/**
formatAmount(event) { * 获取code并登录
// 必须在nextTick中 */
this.$nextTick(() => { getWXCode: async (url, snsapi) => {
this.payAmount = event.target.value.match(/^\d*(\.?\d{0,2})/g)[0] let appid = 'wx212769170d2c6b2a'; //公众号的唯一标识
}) let secrete = '8492a7e8d55bbb1b57f5c8276ea1add0'; //
// let redirect_uri = "https://pcweb.sxczgkj.cn/cashier/pay"
// e.detail.value = (e.detail.value.match(/^\d*(.?\d{0,2})/g)[0]) || "" let redirect_uri = encodeURIComponent(url); //授权后重定向的回调链接地址
// this.$nextTick(() => { let time = +new Date(); //时间戳
// this.payAmount = e.detail.value
// }) window.location.href = `https://open.weixin.qq.com/connect/oauth2/authorize?
},
/**
* 判断是否为微信环境
*/
isWechat (){
var ua = navigator.userAgent.toLowerCase();
var isWXWork = ua.match(/wxwork/i) == 'wxwork';
var isWeixin = !isWXWork && ua.match(/MicroMessenger/i) == 'micromessenger';
return isWeixin;
},
/**
* 判断是否为支付宝环境
*/
isAlipay() {
let userAgent = navigator.userAgent;
return /AlipayClient/.test(userAgent);
},
/**
* 获取微信/支付宝code
*/
login () {
// 获取微信code
if ( this.isWechat() ) {
let _code = this.getUrlParam("code");
uni.setStorageSync("code",_code)
if (_code == null || _code === "") {
// 传当前页面的URL（微信授权完之后返回到的页面）和 登录方式
this.getWXCode(window.location.href, 'snsapi_userinfo');
} else {
this.payType = "WECHAT";
// this.getOpenId(_code,"wx212769170d2c6b2a"); //微信 WECHAT； 支付宝 ALIPAY；
this.getOpenId(uni.getStorageSync("code"),"wx212769170d2c6b2a"); //微信 WECHAT； 支付宝 ALIPAY；
}
}
// 获取支付宝code
if ( this.isAlipay() ) {
let _code = this.getUrlParam("auth_code");
if (_code == null || _code === "") {
// 传当前页面的URL（支付宝授权完之后返回到的页面）和 登录方式
this.getAlipayCode(window.location.href, 'auth_user');
} else {
this.payType = "ALIPAY";
this.getOpenId(_code,"2021004174605036"); //微信 WECHAT； 支付宝 ALIPAY；
}
}
},
/**
* 获取微信/支付宝openid
* @param {Object} code
* @param {Object} payType
*/
getOpenId (code,appId) {
let params = {
code : code,
payType : this.payType, //微信 WECHAT； 支付宝 ALIPAY；
appId : appId, //微信 WECHAT； 支付宝 ALIPAY；
shopId : this.getUrlParam("shopId"), //微信 WECHAT； 支付宝 ALIPAY；
}
getOpenId(params).then((res) => {
if ( res.code == 0 ) {
this.openId = res.data.openId;
this.shopImage = res.data.shopImage;
this.shopName = res.data.shopName;
// this.createOrder(res.data,payType);
} else {
uni.showToast({
title: res.msg,
icon: 'none'
})
}
})
},
/**
* 获取code并登录
*/
getWXCode: async (url, snsapi) => {
let appid = 'wx212769170d2c6b2a' //公众号的唯一标识
let secrete = '8492a7e8d55bbb1b57f5c8276ea1add0' //
// let redirect_uri = "https://pcweb.sxczgkj.cn/cashier/pay"
let redirect_uri = encodeURIComponent(url); //授权后重定向的回调链接地址
let time = +new Date(); //时间戳
window.location.href =
`https://open.weixin.qq.com/connect/oauth2/authorize?
appid=${appid}& appid=${appid}&
redirect_uri=${redirect_uri}& redirect_uri=${redirect_uri}&
response_type=code& response_type=code&
scope=${snsapi}& scope=${snsapi}&
state=1& state=1&
time=${time}#wechat_redirect`; time=${time}#wechat_redirect`;
},
},
/**
/** * 获取支付宝code
* 获取支付宝code * @param {Object} url
* @param {Object} url * @param {Object} snsapi
* @param {Object} snsapi */
*/ getAlipayCode(url, snsapi) {
getAlipayCode (url, snsapi) { let appid = '2021004174605036'; //公众号的唯一标识
let appid = '2021004174605036' //公众号的唯一标识 // let redirect_uri = "https://pcweb.sxczgkj.cn/cashier/pay"
// let redirect_uri = "https://pcweb.sxczgkj.cn/cashier/pay" let redirect_uri = encodeURIComponent(url); //授权后重定向的回调链接地址
let redirect_uri = encodeURIComponent(url); //授权后重定向的回调链接地址 window.location.href = `https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?
window.location.href =
`https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?
app_id=${appid}& app_id=${appid}&
redirect_uri=${redirect_uri}& redirect_uri=${redirect_uri}&
scope=${snsapi}& scope=${snsapi}&
state=1`; state=1`;
}, },
/** /**
* 创建订单 * 创建订单
*/ */
createOrder () { createOrder() {
if ( this.payAmount == "") { if (this.payAmount == '') {
uni.showToast({ uni.showToast({
title: '请输入支付金额', title: '请输入支付金额',
icon: 'none' icon: 'none'
}) });
return; return;
}
let params = {
openId: this.openId,
shopId: this.shopId,
payType: this.payType,
amount: this.payAmount,
checkOrderPay: {
orderAmount: this.payAmount,
orderId: this.getUrlParam('orderId'),
remark: this.remark
} }
};
let params = { // let params = {
userId : this.openId, // openId: '1212312312',
shopId : this.shopId, // shopId: this.shopId,
payType : this.payType, // payType: 'alipay',
payAmount : this.payAmount, // amount: this.payAmount,
remark: this.remark, // checkOrderPay: {
} // orderAmount: this.payAmount,
if ( this.orderId ) { // orderId: this.getUrlParam('orderId'),
params.orderId = this.orderId; // remark: this.remark
} // }
createOrder(params).then((res) => { // };
console.log('createOrder.params', params);
if (this.orderId) {
params.orderId = this.orderId;
}
createOrder(params)
.then((res) => {
console.log('createOrder.res', res);
// alert("创建订单=="+JSON.stringify(res)) // alert("创建订单=="+JSON.stringify(res))
if ( res.code == '100015' ) { if (res.code == '100015') {
this.orderId = res.data.orderInfo.id; this.orderId = res.data.orderInfo.id;
if ( this.isWechat() ) { if (this.isWechat()) {
this.wxH5Pay(res) this.wxH5Pay(res);
} }
if ( this.isAlipay() ) { if (this.isAlipay()) {
this.alipay(res) this.alipay(res);
} }
} else { } else {
uni.showToast({ uni.showToast({
title: res.msg, title: res.msg,
icon: 'none' icon: 'none'
}) });
} }
}) })
}, .catch((err) => {
console.log('createOrder.err', err);
/** });
* 微信支付 },
* @param {Object} res
*/ /**
wxH5Pay (res) { * 微信支付
WeixinJSBridge.invoke('getBrandWCPayRequest', { * @param {Object} res
*/
wxH5Pay(res) {
WeixinJSBridge.invoke(
'getBrandWCPayRequest',
{
debug: true, debug: true,
appId: res.data.payInfo.appId, appId: res.data.payInfo.appId,
timeStamp: res.data.payInfo.timeStamp, timeStamp: res.data.payInfo.timeStamp,
nonceStr: res.data.payInfo.nonceStr, nonceStr: res.data.payInfo.nonceStr,
package: res.data.payInfo.package, package: res.data.payInfo.package,
paySign: res.data.payInfo.paySign, paySign: res.data.payInfo.paySign,
signType: res.data.payInfo.signType, signType: res.data.payInfo.signType
}, function(res) { },
console.log(res) function (res) {
console.log(res);
if (res.err_msg === 'get_brand_wcpay_request:ok') { if (res.err_msg === 'get_brand_wcpay_request:ok') {
// 支付成功的处理逻辑 // 支付成功的处理逻辑
uni.showToast({ uni.showToast({
title: '微信支付成功', title: '微信支付成功',
icon: 'none' icon: 'none'
}) });
setTimeout(function (){ setTimeout(function () {
WeixinJSBridge.invoke('closeWindow'); WeixinJSBridge.invoke('closeWindow');
}, 500);
},500) } else if (res.err_msg == 'get_brand_wcpay_request:cancel') {
} else if (res.err_msg == "get_brand_wcpay_request:cancel") {
// 支付过程中取消支付 // 支付过程中取消支付
cancelOrderPay({ orderId: this.orderId, }) // cancelOrderPay({ orderId: this.orderId });
uni.showToast({ uni.showToast({
title: '取消支付', title: '取消支付',
icon: 'none' icon: 'none'
}) });
} else { } else {
cancelOrderPay({ orderId: this.orderId, }) // cancelOrderPay({ orderId: this.orderId });
uni.showToast({ uni.showToast({
title: '支付失败', title: '支付失败',
icon: 'none' icon: 'none'
}) });
} }
}); }
}, );
},
/**
* 支付宝支付 /**
* @param {Object} res * 支付宝支付
*/ * @param {Object} res
alipay (res) { */
alipay(res) {
// 判断是否存在支付宝的JSBridge // 判断是否存在支付宝的JSBridge
if (window.AlipayJSBridge) { if (window.AlipayJSBridge) {
// 调用支付宝客户端接口，执行支付操作 // 调用支付宝客户端接口，执行支付操作
AlipayJSBridge.call('tradePay', { AlipayJSBridge.call(
'tradePay',
{
tradeNO: res.data.payInfo.tradeNo tradeNO: res.data.payInfo.tradeNo
}, function(result) { },
function (result) {
if (result.resultCode === '9000') { if (result.resultCode === '9000') {
// 支付成功 // 支付成功
uni.showToast({ uni.showToast({
title: '支付成功', title: '支付成功',
icon: 'none' icon: 'none'
}) });
setTimeout(() => { setTimeout(() => {
window.AlipayJSBridge.call('closeWebview') window.AlipayJSBridge.call('closeWebview');
}, 500); }, 500);
} else { } else {
cancelOrderPay({ orderId: this.orderId, }) cancelOrderPay({ orderId: this.orderId });
// 支付失败 // 支付失败
uni.showToast({ uni.showToast({
title: '支付失败', title: '支付失败',
icon: 'none' icon: 'none'
}) });
} }
}); }
} else { );
// 如果支付宝的JSBridge尚未准备好，在文档中添加AlipayJSBridgeReady事件监听器 } else {
document.addEventListener('AlipayJSBridgeReady', () => { // 如果支付宝的JSBridge尚未准备好，在文档中添加AlipayJSBridgeReady事件监听器
// 准备就绪后再次调用支付函数，传入支付数据paymentData document.addEventListener('AlipayJSBridgeReady', () => {
this.alipay(paymentData); // 准备就绪后再次调用支付函数，传入支付数据paymentData
}); this.alipay(paymentData);
} });
}, }
},
/**
* 截取code
*/
getUrlParam: (name) => {
let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
let r = window.location.search.substr(1).match(reg);
if (r != null) {
return unescape(r[2]);
}
return null;
},
/**
* 截取code
*/
getUrlParam: (name) => {
let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
let r = window.location.search.substr(1).match(reg);
if (r != null) {
return unescape(r[2]);
}
return null;
} }
} }
};
</script> </script>
<style> <style>
.content {
display: flex;
.content { flex-direction: column;
display: flex; padding: 48rpx 28rpx;
flex-direction: column; box-sizing: border-box;
padding: 48rpx 28rpx; }
box-sizing: border-box; .info {
} display: flex;
.info{ align-items: center;
display: flex; }
align-items: center; .shopImage {
} width: 80rpx;
.shopImage{ height: 80rpx;
width: 80rpx; margin-right: 32rpx;
height: 80rpx; border-radius: 50%;
margin-right: 32rpx; }
border-radius: 50%; .shopName {
} font-weight: bold;
.shopName{ font-size: 32rpx;
font-weight: bold; color: #333333;
font-size: 32rpx; }
color: #333333; .input {
} display: flex;
.input{ flex-direction: column;
display: flex; padding: 0 16rpx;
flex-direction: column; box-sizing: border-box;
padding: 0 16rpx; }
box-sizing: border-box; .payAmount {
} border-bottom: 2rpx solid #e5e5e5;
.payAmount{ font-weight: bold;
border-bottom: 2rpx solid #E5E5E5; font-size: 36rpx;
font-weight: bold; color: #333333;
font-size: 36rpx; display: flex;
color: #333333; align-items: center;
display: flex; padding: 24rpx 0;
align-items: center; box-sizing: border-box;
padding: 24rpx 0; }
box-sizing: border-box; .amount {
} width: 100%;
.amount{ font-weight: 400;
width: 100%; font-size: 28rpx;
font-weight: 400; color: #333;
font-size: 28rpx; padding-left: 10rpx;
color: #333; box-sizing: border-box;
padding-left: 10rpx; }
box-sizing: border-box; .remark {
} width: 100%;
.remark{ margin-top: 28rpx;
width: 100%; font-weight: 400;
margin-top: 28rpx; font-size: 24rpx;
font-weight: 400; color: #999999;
font-size: 24rpx; }
color: #999999; .btn {
} width: 100%;
.btn{ height: 64rpx;
width: 100%; line-height: 64rpx;
height: 64rpx; text-align: center;
line-height: 64rpx; background-color: #f1cb66;
text-align: center; border-radius: 10rpx;
background-color: #F1CB66; color: #fff;
border-radius: 10rpx; font-size: 28rpx;
color: #fff; margin-top: 40rpx;
font-size: 28rpx; }
margin-top: 40rpx;
}
</style> </style>

1577
pnpm-lock.yaml generated Normal file
View File

File diff suppressed because it is too large Load Diff

2
vite.config.js
View File

@@ -10,7 +10,7 @@ export default defineConfig({
port:80 port:80
proxy: { proxy: {
'/api': { '/api': {
target: "https://cashier-client.sxczgkj.cn/cashier-client", target: "https://cashier.sxczgkj.com",
changeOrigin: true, changeOrigin: true,
rewrite: path => path.replace(/^\/api/, ''), rewrite: path => path.replace(/^\/api/, ''),
} }

2
vue.config.js
View File

@@ -31,7 +31,7 @@ module.exports = {
proxy: { proxy: {
"/api": { "/api": {
// 需要被代理的后台地址 // 需要被代理的后台地址
"target": "https://cashier-client.sxczgkj.cn/cashier-client", "target": "https://cashier-client.sxczgkj.cn",
"changeOrigin": true, "changeOrigin": true,
"secure": false, "secure": false,
"pathRewrite": { "pathRewrite": {