# 捷微小程序商城发布 ## 一、捷微小程序商城快速对接H5活动之家微商城 ### 1\. 小程序项目代码下载 ~~~ 源码下载地址:https://gitee.com/jeecg/weixin-app-shop ~~~ ### 2\. 小程序项目配置 #### (1)配置H5活动之家微商城id ~~~ 登录H5活动之家(http://www.h5huodong.com)找到需要对接的微商城,没有微商城可以创建一个微商城,进入菜单【商城类】-【小程序商城】-【商城管理】创建自己的商城。 ~~~ ![](https://img.kancloud.cn/ac/0c/ac0cb23048a5c907d26538cdb03ff20e_1895x839.png) #### (2)商城创建后进入商城后台管理,获取商城id ![](https://img.kancloud.cn/b5/82/b582662e9b4bce377d6344cbcd92c874_1914x867.png) #### (3) 商城id配置到小程序项目中/dist/utils/wxRequest.js文件中 ![](https://img.kancloud.cn/33/e2/33e27d6640d9cbd62a5cb9acf2e59358_1556x757.png) #### (4) 配置API安全密钥到小程序项目中/dist/utils/wxRequest.js文件中 ![](https://img.kancloud.cn/99/61/9961b28412cc87d093f2b3518a65ddcc_1355x702.png) ~~~ API安全密钥获取地址【安全设置】-【API安全管理】 ~~~ ![](https://img.kancloud.cn/24/82/2482e0a666c065e7c35f8860e89a959a_1908x564.png) ![](https://img.kancloud.cn/17/15/1715ededbc6ebb6c822e586a5fc1f33f_1899x468.png) ### 3、商城小程序配置(平台默认公众号不需要设置) ~~~ 进入商城后台管理,【商城管理】-【小程序配置】 ~~~ ![](https://img.kancloud.cn/6e/1d/6e1d9956897ac4c66286ea47a82050fa_1899x594.png) ![](https://img.kancloud.cn/07/f3/07f3506f0c5502929bec4ebef172708e_1915x489.png) ~~~ 小程序id:AppID(小程序ID) 例如:wxd930ea5d5a258f4f 小程序密钥:AppSecret(小程序密钥) 例如:ibuaiVcKdpRxkhJA ~~~ ### 4、商城小程序支付配置(平台默认公众号不需要设置) ~~~ 进入商城后台管理,【支付中心】-【小程序支付配置】 ~~~ ![](https://img.kancloud.cn/42/40/424070f519c073ddfca726b79e876eac_1916x772.png) ~~~ 配置支付信息: ~~~ ![](https://img.kancloud.cn/30/38/3038e5b41010effb0d45bbad0faec244_1900x557.png) ~~~ 商户号:支付商户商户号 例如:10000100 支付密钥:商户平台设置的密钥key 例如:192006250b4c09247ec02edce69f6a2d 证书: 微信支付接口中,涉及资金回滚的接口会使用到商户证书,包括退款、撤销接口。 商家在申请微信支付成功后,收到的相应邮件后,可以按照指引下载API证书, 也可以按照以下路径下载:微信商户平台(pay.weixin.qq.com)-->账户设置-->API安全-->证书下载  (见下图) 上传pkcs12格式(apiclient_cert.p12)证书即可 配置完成后,订单支付退款功能即可使用。 备注:证书不上传不能退款操作,但是可以进行订单支付,其他的配置信息必须得正确。 ~~~ ### 5\. 发布小程序 ~~~ 小程序发布,需要通过微信开发者工具上传项目,上传者需扫码微信开发者工具, 该登录微信号必须是当前小程序的开发者。 1、发布前准备 授权开发者权限 小程序后台管理员授权微信用户为开发者 【用户身份-成员管理】添加成员 ~~~ ![](https://img.kancloud.cn/a7/ae/a7aeb47ac2398ffeef412d32d1470d9a_1427x846.png) ~~~ 服务器域名配置: 小程序后台,进入【设置-开发设置】,服务器域名设置app.h5huodong.com 改配置授权H5活动之家提供服务支持。 ~~~ ![](https://img.kancloud.cn/48/1d/481df50a3237e9c5d37e970ea9c7d9cd_1369x555.png) ~~~ 2、下载微信开发者工具 下载地址: https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html 下载后安装开发者工具 ~~~ ~~~ 3、开发者工具导入项目 扫码登录,选择小程序项目开发者模式。 ~~~ ![](https://img.kancloud.cn/cd/43/cd438740987da60ae30e9c841d62a6ca_420x594.png) ![](https://img.kancloud.cn/3c/86/3c8688550807fc976a7037b079cea10f_419x593.png) ~~~ 选择小程序代码工程目录(即选择下载的解压的小程序代码dist目录),填写小程序appid,填写一个项目名称,点击确定。 开发使用说明(重要) 1、使用微信开发者工具-->添加项目,项目目录请选择dist目录。 2、微信开发者工具-->项目-->关闭ES6转ES5。 重要:漏掉此项会运行报错。 3、微信开发者工具-->项目-->关闭上传代码时样式自动补全。 重要:某些情况下漏掉此项也会运行报错。 4、微信开发者工具-->项目-->关闭代码压缩上传。 重要:开启后,会导致真机computed, props.sync 等等属性失效。 ~~~ ![](https://img.kancloud.cn/d0/b3/d0b378ff8d9f3f83f1c15ae55d02c9bc_515x594.png) ~~~ 进入开发页面后,点击编译,然后点击上传,上传小程序到服务器。 上传是填写版本号,项目备注。 版本号命名规则 例如:1.0.1 项目备注,备注项目名称,发布更新的功能 填写后点击上传,即可上传到服务器,可在小程序管理后台看到 ~~~ ![](https://img.kancloud.cn/69/56/6956d283115460e7293f298d6a0a4123_1903x1029.png) ~~~ 小程序管理后台【开发管理】,可以看到上传的开发版本 ~~~ ![](https://img.kancloud.cn/34/24/342439c9f3fa69b8e6850378bbceb33a_1407x332.png) ~~~ 开发版本可以设置为体验版本,具有体验权限的人可以扫码访问,进行测试验证,测试商城数据等没有问题即可提交审核,发布上线。 备注:提交审核后,需等待微信官方审核,审核通过后才可发布上线 ~~~ 小程序对接完毕!!!