01.03 商城移动端开发环境部署

JooLun 于 2026-10-21 14:40:14 +08:00 修改了此页面

### 商城用户移动端（joolun-plus-uniapp）支持编译成微信小程序、H5、ios和安卓App的，以下是各端的编译说明，其它端需自己做兼容

小程序端和APP端的服务器接口地址是在joolun-plus-uniapp/config/env.js配置basePath
H5端的服务器接口地址是在joolun-plus-uniapp/vue.config.js中的url，此配置只对本地开发环境起作用，h5端服务器环境的转发代理直接是在nginx中配置的（具体请查看生产环境部署教程）

npm install --registry=https://registry.npmmirror.com

05.05-小程序与公众号接入（第三方平台），用第二种方式
修改joolun-plus-uniapp/vue.config.js中的url；可以是后台（joolun-plus-ui）访问地址，也可以直接是网关服务joolun-gateway的访问地址（默认：ip:9999），本地环境直接填http://localhost:9999
运行项目，注意运行后一定要将url手动加上参数?tenant_id=1才能正常访问不报错

这里需要注意，运行成功后因为没有租户ID所以会报错，需要手动加上参数?tenant_id=1，直接在外部浏览器访问http://localhost:8085/?tenant_id=1，如果能加载出数据就说明项目已经跑起来了
公众号h5开发需要在微信开发者工具中才能进行，并且需要域名才能完成授权，所以我们本地需要用户内网穿软件（方式有多种自己百度解决，我们使用的是frp）
假设我们已经内穿实现了demo1-mall.joolun.com指向我们本地localhost:8085，这样外网可以通过demo1-mall.joolun.com访问到我们本地的localhost:8085
微信公众平台配置授权域名（左边栏目-设置-公众号设置），将访问域名配到JS接口安全域名、网页授权域名中

后台获取页面的公众号h5访问地址，此地址即为公众号自定义菜单的页面访问地址，请务必在后台复制，因为不能的公众号和不同接入方式参数都是不同的，地址域名在joolun-plus-ui/src/config/env.js文件中配置domainName

公众号H5端运行成功后普通浏览器H5端就自然可以访问了
普通浏览器H5端和公众号H5端区别就在于url参数的不同，普通浏览器H5端参数中只需带上tenant_id即可，直接在外部浏览器访问http://localhost:8085/?tenant_id=1

手机连接电脑，手机打开usb调试
修改joolun-plus-uniapp/config/env.js中的basePath和appUpdateUrl；basePath可以是后台（joolun-plus-ui）访问地址，也可以直接是网关服务（默认：ip:9999）的访问地址，这里要用手机能访问到的局域网IP地址，并保证手机和电脑在同一局域网，localhost手机是访问不到的；appUpdateUrl只能是后台（joolun-plus-ui）访问地址，因为json文件直接放在后台（joolun-plus-ui）
修改joolun-plus-uniapp/config/env.js中的tenantId，一个租户一个app，默认租户1
修改joolun-plus-uniapp/config/env.js中的h5HostUrl，h5HostUrl是app中分享链接的前段地址，即H5端的访问域名。在app中分享到微信的其实就是对应的H5端地址
修改joolun-plus-uniapp/config/env.js中的privacyPolicyUrl、protocolUrl，在各个平台上架APP应用时必须要有隐私协议
编译到手机

在实际开放过程中，前后端可能会由不同的人开发，所以后台服务（joolun-plus）可能不在本地，而是运行在其他同事电脑上。所以需要改下接口访问地址
后端页面：修改joolun-plus-ui/vue.config.js中的url；直接是网关服务（默认：ip:9999）的访问地址
小程序端：修改joolun-plus-uniapp/config/env.js中的basePath；可以是后台（joolun-plus-ui）访问地址，也可以直接是网关服务（默认：ip:9999）的访问地址
H5端：修改joolun-plus-uniapp/vue.config.js中的url；可以是后台（joolun-plus-ui）访问地址，也可以直接是网关服务（默认：ip:9999）的访问地址