源码论坛公告:本站是一个交流学习建站资源的社区论坛,旨在交流学习源码脚本等资源技术,欢迎大家投稿发言! 【点击此处将锦尚放在桌面

源码论坛,商业源码下载,尽在锦尚中国商业源码论坛

 找回密码
 会员注册

QQ登录

只需一步,快速开始

查看: 2375|回复: 0

[小程序开发] 网站Html5手机端网址封装成微信小程序的教程

[复制链接]

3095

主题

3493

帖子

13万

金币

超级版主

Rank: 8Rank: 8

积分
266463
发表于 2023-8-27 14:59:05 | 显示全部楼层 |阅读模式

我想把我的网站封装成小程序其实很简单,但是有一点是微信支付是无法使用的,需要改微信支付的接口,如果你的网站用不到微信支付那么就可以直接封装了!

前提要求:H5网站域名必须开启https,比如 https://18pay.net/,是https开头,而不是http

一、登录微信公众平台,注册一个小程序,不懂自行百度(锦尚中国的vip会员可以免费申请小程序,需要的话联系咱们客服),在平台上获取AppID(小程序ID)

202308271436.jpg


二、微信开发者工具中创建小程序,填写前面注册小程序的AppID

20210324120017350.jpg


三、修改app.json配置

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

window项的navigationBarTitleText填写小程序名称

20210324120351819.jpg


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

  1. <web-view src="https://18pay.net/"></web-view>
复制代码


代码里的https://18pay.net/,就是你H5网站的网址域名

五、测试

1、点击详情 → 本地设置 → 勾选【不校验合法域名】来进行测试,如下图:

20210324121249625.jpg


2、小程序正式上线的话,需要在微信小程序管理中心中,把H5域名添加为业务域名,如下图:

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

9818322d01254e04aad7cea818075fa1.jpg


六、js判断当前html5网址是不是在微信小程序中运行的

这一段代码可以放在你的网站页面中,这样可以判断使用端后进一步触发动作,可以用来扩展很多的功能的!

  1. <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
  2. <script>
  3.     var ua = navigator.userAgent.toLowerCase();
  4.     if(ua.match(/MicroMessenger/i)=="micromessenger") {
  5.         //ios的ua中无miniProgram,但都有MicroMessenger(表示是微信浏览器)
  6.         wx.miniProgram.getEnv((res)=>{
  7.            if (res.miniprogram) {
  8.                alert("在小程序里");
  9.            } else {
  10.                alert("不在小程序里");
  11.            }
  12.         })
  13.     }else{
  14.         alert('不在微信里');
  15.     }
  16. </script>
复制代码


您需要登录后才可以回帖 登录 | 会员注册

本版积分规则

锦尚中国源码论坛

聚合标签|锦尚中国,为中国网站设计添动力 ( 鲁ICP备09033200号 ) |网站地图

GMT+8, 2024-4-14 04:09 , Processed in 0.038385 second(s), 20 queries .

带宽由 锦尚数据 提供 专业的数据中心

© 锦尚中国源码论坛 52jscn Inc. 非法入侵必将受到法律制裁 法律顾问:IT法律网 & 褚福省律师 锦尚爱心 版权申诉 版权与免责声明