# boolcms-module-webview

**Repository Path**: cuishiy/boolcms-module-webview

## Basic Information

- **Project Name**: boolcms-module-webview
- **Description**: 微信小程序/字节跳动小程序内嵌H5支付。
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: https://boolcms.cn
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2022-08-28
- **Last Updated**: 2022-08-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 准备工作

- 1 VSCODE / WebStorm / HBuilderX 等IDE或者编辑器
- 2 小程序开发者工具

# 环境配置
## VSCODE / WebStorm

### 安装环境
```
npm install --registry="https://registry.npm.taobao.org"
```

### 环境变量
设置 `.env.*` 内的环境变量
```
// API
VUE_APP_BASE_API = 'https://api.boolc.cn'
// 移动端要访问的首页地址 直接复制后台对应区域/商户地址即可
VUE_APP_TAKEOUT_H5_HOST = 'https://app.boolc.cn'

// 小程序APPID
VUE_APP_OF_WX_APP_ID = ''
// 加密后的小程序APPSECRET
VUE_APP_OF_WX_APP_SECRET = ''
// 是否为子商户小程序
VUE_APP_IS_SUB_APP = 1
// 小程序授权码，请查看后台设置
VUE_APP_MP_WX_APP_ID = ''
// 字节/抖音小程序授权码，请查看后台设置
VUE_APP_MP_TT_APP_ID = ''
// 支付宝小程序授权码，请查看后台设置
VUE_APP_MP_ALI_APP_ID = ''
```

### 支付参数配置
根据 `pages/order/pay` 内的说明进行支付参数配置

### 编译小程序代码
```
npm run build:mp-weixin
```

## HBuilderX
通过编辑器导入 src 文件夹

### 环境变量
设置 `vue.config.js` 内的环境变量
```
// API
process.env.VUE_APP_BASE_API = 'https://api.boolc.cn'
// 移动端要访问的首页地址 直接复制后台对应区域/商户地址即可
process.env.VUE_APP_TAKEOUT_H5_HOST = 'https://app.boolc.cn'
// 小程序APPID
process.env.VUE_APP_OF_WX_APP_ID = ''
// 加密后的小程序APPSECRET
process.env.VUE_APP_OF_WX_APP_SECRET = ''
// 是否为子商户小程序
process.env.VUE_APP_IS_SUB_APP = 1
// 小程序授权码，请查看后台设置
process.env.VUE_APP_MP_WX_APP_ID = ''
// 字节/抖音小程序授权码，请查看后台设置
process.env.VUE_APP_MP_TT_APP_ID = ''
// 支付宝小程序授权码，请查看后台设置
process.env.VUE_APP_MP_ALI_APP_ID = ''
```

### 支付参数配置
根据 `pages/order/pay` 内的说明进行支付参数配置


# 上传代码
使用小程序开发者工具打开编译后的代码上传代码即可。