搜索
鲸奇世界,弘创无限
与我们取得联系
请拨打电话或者扫描下方微信二维码联系我们。
24小时电话
188-2547-1709
微信 王经理
建站、SEO业务
微信 王经理
小程序、系统定制业务

鲸奇世界,弘创无限

如何将pbootcms系统搭建的手机网页封装成微信小程序并审核上架

鲸弘科技
2025-09-08
1 次

准备工作

1、登陆微信公众平台,申请微信小程序(这个不懂请百度)

2、搭建好pbootcms网站,需要支持https,例如:https://www.vi23.com/,可以使用自适应模板,或者单独的手机模板

3、安装微信开发者工具,https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

操作步骤

第一步:登陆微信小程序官方平台,获取你的appid信息

image.png

第二步:打开微信开发者工具,创建小程序

image.png

将第一步获取到的appid填写进去,

第三步:修改app.json配置

1.  打开app.json文件,pages项只保留 "pages/index/index" 这一行即可

2. window项的navigationBarTitleText填写小程序名称

image.png

第四步:打开/pages/index/index.wxml文件,将里面的代码全部删除,添加下面这一行代码

<web-view src="https://www.vi23.com/"></web-view>

注意代码中的https://www.vi23.com换成你自己的网站域名。

第五步:测试小程序

1. 见下图,勾选不校验合法域名、web-view(业务域名)、TLS版本以及HTTPS证书

1679056488151862.png

2. 小程序正式上线后,需要在微信小程序管理中心中,把pbootcms网站域名添加为业务域名。

操作路径:登录微信公众平台 → 开发管理 → 开发设置  → 业务域名:

image.png

到此,pbootcms网站就封装到了微信小程序中。

进阶技巧

微信审核还是比较宽松的,如果有遇到不支持、或者不宜、不想要在微信小程序中显示的内容的,可以通过JS来隐藏dom元素来实现屏蔽效果。

这里给一段演示代码,有需要的朋友可以学习一下

<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script><script>    var ua = navigator.userAgent.toLowerCase();    if(ua.match(/MicroMessenger/i)=="micromessenger") {        //ios的ua中无miniProgram,但都有MicroMessenger(表示是微信浏览器)        wx.miniProgram.getEnv((res)=>{           if (res.miniprogram) {               alert("在小程序里");           } else {               alert("不在小程序里");           }        })    }else{        alert('不在微信里');    }</script>


  • 稳定
    多年经验,服务稳定
  • 贴心
    全国7*24小时客服热线
  • 专业
    产品经理在线技术支持
  • 快速
    快速评估,快速执行
  • 承诺
    有目共睹,我们选声誉
复制成功

微信号:kaxiO_o

添加微信好友,免费获取方案及报价

我知道了
联系
扫码添加技术微信
1V1在线技术支持
联系电话
188-2547-1709建站、seo业务
电话若占线或未接到、就加下微信
联系邮箱
frank@vi23.com企业邮箱