j
湖南贡霜物联网科技有限公司

咨询热线

15974154234
当前位置: 首页 > 网络技术百科 > 小程序百科

Html5手机端网址封装成微信小程序的教程

时间:2021-09-17 17:52:50人气: 作者: admin

教程步骤:

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


一、登录微信公众平台,注册一个小程序,不懂自行百度,获取AppID(小程序ID)


Html5手机端网址封装成微信小程序的教程(图1)


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

Html5手机端网址封装成微信小程序的教程(图2)



三、修改app.json配置


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

window项的navigationBarTitleText填写小程序名称

Html5手机端网址封装成微信小程序的教程(图3)


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


<web-view src="https://m.18ka.net"></web-view>

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


五、测试

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

Html5手机端网址封装成微信小程序的教程(图4)



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


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


Html5手机端网址封装成微信小程序的教程(图5)


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

<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>


标签:
加载中~

最新文章

  • Html5手机端网址封装成微信小程序的教程

    Html5手机端网址封装成微信小程序的教程

    教程步骤:前提要求:H5网站域名必须开启https,比如 https://m.18ka.net/,是https开头,而不是http一、登录微信公众平台,注册一个小程序,不懂自行百度,获取AppID(小程序ID)二、微信开发者工具中创建小程序,填写前面 (815)人阅读 时间:2021-09-17
  • 微信小程序链接转成普通链接的方法

    微信小程序链接转成普通链接的方法

    微信开放了小程序 URL Scheme 能力,在小程序管理后台就可以生成;微信小程序链接转成普通链接呢 ?我们需要做 2 步:1、在小程序后台生成 URL Scheme ,2、把 URL Scheme 变成普通连接,就可以直接使用了一、生成小程序 U (0)人阅读 时间:2021-09-03
  • H5链接快跳转微信小程序方法详解

    H5链接快跳转微信小程序方法详解

    根据微信官方文档显示,微信已经开放小程序 URL Scheme 功能,也就是说可以在任意 APP 或 浏览器、短信等场景一键打开微信小程序,一般称为微信快跳链接;官方技术原理:通过服务端接口或在小程序管理后台「工具」-「生成 URL Scheme」入 (0)人阅读 时间:2021-09-03
  • 什么工具能实现微信公众号自动回复小程序链接

    什么工具能实现微信公众号自动回复小程序链接

    为了满足微信公众号自动回复小程序链接的需求,第三方平台微号帮提供了粉丝对话定时推送功能实现,可以实现公众号自动回复小程序链接,粉丝向公众号发消息后自动触发回复,如果担心公众号粉丝多次触发自动回复消息,可以设置触发频率和免打扰时段,避免打扰粉丝;通过功 (3)人阅读 时间:2021-09-03
  • iOS虚拟支付的限制下,如何优化小程序用户体验

    iOS虚拟支付的限制下,如何优化小程序用户体验

    2018年5月,微信官方发布了《关于小程序含有未开放内容(虚拟支付)的整改通知》,公告中表示:基于微信小程序平台运营规范,除小游戏类目的安卓内购功能,小程序暂不支持虚拟支付。请开发者们对当前小程序内含有虚拟支付的内容或服务进行排查并整改。如在5月8日 (1)人阅读 时间:2021-09-03
  • Uniapp小程序通过分包加载轻松解决超过2M限制,还能提高打开速度

    Uniapp小程序通过分包加载轻松解决超过2M限制,还能提高打开速度

    微信小程序限制了代码包单包不能超过2M,总包大小不能超过20M,我们在开发系统的时候,如果没有注意这点,当项目越来越复杂的时候,就会发现编译的时候报错,或者编译的时候一直通不过微信开发者工具,速度非常慢,甚至有时候会直接导致开发者工具崩溃。对此,微信 (0)人阅读 时间:2021-09-03
  • 华为手机安装一个小程序,就可以绕过谷歌的技术限制

    华为手机安装一个小程序,就可以绕过谷歌的技术限制

    自从谷歌对华为的GMS技术禁令生效之后,华为海外新出售的手机在原厂设置下,不能再使用谷歌的邮箱、Youtube、支付、谷歌云以及导航等服务。因此华为手机在海外市场的业务受到了很大的影响,对此花旗银行还悲观的预判华为手机的海外市场将会出大问题,认为没有 (0)人阅读 时间:2021-09-03
  • 企业微信动态二维码小程序开门解决方案

    企业微信动态二维码小程序开门解决方案

    1.系统简述微信二维码开门系统,通过手机微信小程序扫码开门及访客二维码分享,取代传统的门禁卡片和机械钥匙们,通过将手机号码作为卡号下载到门禁控制器中,在手机微信小程序二维码门禁系统中用手机号进行注册生成动态二维码扫码开门,同时可实现按年、月、日、时、 (0)人阅读 时间:2021-08-31

本类推荐

热门话题

Copyright © 2020-2021 湖南贡霜物联网科技有线公司 版权所有湘ICP备20010774号
电 话:15974154234    手 机:15974154234   传 真:15974154234    E-mail:547150960@qq.com
地 址:长沙市开福区捞刀河街道街道彭家巷龙塘小区A1栋2单元404
湘ICP备20010774号

扫一扫关注微信公众帐号

免费咨询 投诉建议