227 lines
7.4 KiB
JavaScript
227 lines
7.4 KiB
JavaScript
/**
|
||
* H5工具
|
||
*/
|
||
|
||
// 线上调试
|
||
export const debug = async (tip = true) => {
|
||
const erudaList = [
|
||
'https://unpkg.com/eruda',
|
||
'https://cdn.jsdelivr.net/npm/eruda',
|
||
'/eruda.js',
|
||
]
|
||
let idx = 0
|
||
while (erudaList[idx]) {
|
||
try {
|
||
await loadScript(erudaList[idx])
|
||
eruda.init()
|
||
if (tip) alert('debug ready')
|
||
return Promise.resolve('加载成功')
|
||
} catch (e) {
|
||
idx++
|
||
}
|
||
}
|
||
return Promise.reject('加载失败')
|
||
}
|
||
|
||
// 获取查询参数
|
||
export const getQueryParams = (url) => {
|
||
url = url || window?.location?.href
|
||
const queryString = String(url).split('?').at(-1);
|
||
if (!queryString) {
|
||
return {};
|
||
}
|
||
|
||
return queryString.split('&').reduce((params, param) => {
|
||
const [key, value] = param.split('=');
|
||
if (key && value) params[key] = decodeURIComponent(value);
|
||
return params;
|
||
}, {});
|
||
}
|
||
|
||
// 判断浏览器
|
||
export const judgeBrowser = () => {
|
||
const userAgent = navigator.userAgent.toLowerCase();
|
||
if (userAgent.includes('micromessenger')) return 'wx'
|
||
if (userAgent.includes('alipay')) return 'ali'
|
||
return 'unknown'
|
||
}
|
||
|
||
// 加载 js script
|
||
export const loadScript = (src) => {
|
||
return new Promise((resolve, reject) => {
|
||
const script = document.createElement('script');
|
||
script.src = src;
|
||
script.onload = () => resolve(script);
|
||
script.onerror = (error) => reject(error);
|
||
document.head.appendChild(script);
|
||
});
|
||
}
|
||
|
||
|
||
|
||
/**
|
||
* 微信公众号相关
|
||
*/
|
||
|
||
// 微信公众号授权获取 code
|
||
export const getWxAuthCode = (appId, state = '', scope = 'snsapi_base') => {
|
||
/**
|
||
* 以snsapi_base为scope发起的网页授权，是用来获取进入页面的用户的openid的，
|
||
* 并且是静默授权并自动跳转到回调页的。用户感知的就是直接进入了回调页（往往是业务页面）
|
||
* 以snsapi_userinfo为scope发起的网页授权，是用来获取用户的基本信息的。但这种授权需要用户手动同意，
|
||
* 并且由于用户同意过，所以无须关注，就可在授权后获取该用户的基本信息。
|
||
*/
|
||
const redirect_uri = encodeURIComponent(window.location.href);
|
||
const authUrl = `http://open.weixin.qq.com/connect/oauth2/authorize
|
||
?appid=${appId}
|
||
&redirect_uri=${redirect_uri}
|
||
&response_type=code
|
||
&scope=${scope}
|
||
&state=${state}#wechat_redirect`;
|
||
window.location.href = authUrl
|
||
}
|
||
|
||
export const wxConfig = (params) => {
|
||
/**
|
||
* config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，
|
||
* config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，
|
||
* 则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，
|
||
* 则可以直接调用，不需要放在ready函数中。
|
||
*/
|
||
jWeixin.config({
|
||
debug: false,
|
||
appId: params.appId,
|
||
timestamp: params.timestamp,
|
||
nonceStr: params.noncestr,
|
||
signature: params.signature,
|
||
jsApiList: [
|
||
"updateTimelineShareData",
|
||
"updateAppMessageShareData",
|
||
"chooseWXPay",
|
||
]
|
||
});
|
||
}
|
||
|
||
// 微信公众号支付
|
||
export const wxPay = (params) => {
|
||
console.log('wxPay', params);
|
||
wxConfig(params)
|
||
return new Promise((resolve, reject) => {
|
||
jWeixin.ready(function() {
|
||
jWeixin.chooseWXPay({
|
||
timestamp: params.timeStamp,
|
||
nonceStr: params.nonceStr,
|
||
package: params.package,
|
||
signType: params.signType,
|
||
paySign: params.paySign,
|
||
success: function(res) {
|
||
console.log('支付成功:', res);
|
||
resolve(res)
|
||
},
|
||
cancel: function(res) {
|
||
console.log('用户取消支付:', res);
|
||
reject(res)
|
||
},
|
||
fail: function(err) {
|
||
console.error('支付失败:', err);
|
||
reject(err)
|
||
}
|
||
});
|
||
});
|
||
wx.error(function(res) {
|
||
reject(res)
|
||
})
|
||
})
|
||
};
|
||
|
||
// 微信公众号设置分享信息
|
||
export const wxShare = (params) => {
|
||
console.log('wxShare', params);
|
||
//配置校验成功后执行
|
||
jWeixin.ready(function() {
|
||
if (!params.link) {
|
||
let url = window.location.href;
|
||
let index = url.indexOf("?");
|
||
if (index != -1) {
|
||
if (url.indexOf("#") != -1 && url.indexOf("#") > index) {
|
||
url = url.substring(0, index) + url.substring(url.indexOf("#"));
|
||
} else {
|
||
url = url.substr(0, index);
|
||
}
|
||
}
|
||
params.link = url;
|
||
}
|
||
// 自定义“分享给朋友”及“分享到QQ”按钮的分享内容
|
||
jWeixin.updateAppMessageShareData({
|
||
title: params.title, // 分享标题
|
||
desc: params.desc, // 分享描述
|
||
link: params.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
|
||
imgUrl: params.imgUrl, // 分享图标
|
||
success: function() {
|
||
console.log('updateAppMessageShareData success');
|
||
},
|
||
fail: err => {
|
||
console.log('updateAppMessageShareData fail', err);
|
||
}
|
||
});
|
||
|
||
// 自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容
|
||
jWeixin.updateTimelineShareData({
|
||
title: params.title, // 分享标题
|
||
link: params.link, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
|
||
imgUrl: params.imgUrl, // 分享图标
|
||
success: function() {
|
||
console.log('updateTimelineShareData success');
|
||
},
|
||
fail: err => {
|
||
console.log('updateTimelineShareData fail', err);
|
||
}
|
||
});
|
||
console.log('wxShare', params);
|
||
});
|
||
}
|
||
|
||
/**
|
||
* 支付宝相关
|
||
*/
|
||
|
||
// 支付宝生活号授权获取 code
|
||
export const getAliAuthCode = (appId, scope = 'auth_base') => {
|
||
/**
|
||
* auth_base(静默授权)：静默授权，用户无需点击确认授权，默认返回 auth_code，该授权码不支持获取用户信息。
|
||
* auth_user(主动授权)：首次授权需要用户手动点击同意，用户同意后，返回 auth_code；
|
||
* 商家需要考虑用户拒绝授权的情况并进行相应容错。如果授权关系依旧存在，下次进入页面时也会静默授权。
|
||
*/
|
||
return new Promise((resolve, reject) => {
|
||
ap.getAuthCode({
|
||
appId,
|
||
scopes: [scope],
|
||
}, function(res) {
|
||
if (res.error) {
|
||
reject(res)
|
||
} else {
|
||
resolve(res)
|
||
}
|
||
});
|
||
})
|
||
}
|
||
|
||
// 支付宝生活号支付
|
||
export const aliPay = (tradeNO) => {
|
||
return new Promise((resolve, reject) => {
|
||
console.log('aliPay', tradeNO);
|
||
ap.tradePay({
|
||
tradeNO,
|
||
success: res => {
|
||
if (res.resultCode === '9000') {
|
||
resolve(res)
|
||
} else {
|
||
reject(res)
|
||
}
|
||
},
|
||
fail: err => {
|
||
reject(err)
|
||
},
|
||
});
|
||
})
|
||
} |