小程序嵌套h5页面_微信小程序内嵌h5页面

本文介绍了如何在微信小程序中使用标签嵌套H5页面,强调了需要配置相同的业务域名,并指出内嵌H5可以绕过代码审核。同时,文章提到了一些限制,如个人和海外类型小程序不支持,以及H5页面必须使用HTTPS。此外,还给出了调整内嵌页面样式以避免全屏覆盖的方法,并提供了页面间的交互示例。
摘要由CSDN通过智能技术生成

概况

使用 标签能在小程序中打开外部网页,但是要打开的网页的域名必须跟小程序的业务域名(业务域名可以在小程序的后台管理界面添加)一致,否则在真机上是打不开的。如果开发工具上勾选了‘不校验域名’,在开发的时候还是能打开的,但也没用,线上是打不开的。

不管有没有内容, 会占满整个屏幕。

内嵌H5,更新代码发布上线可以绕过审核。

的限制

使用限制:对个人类型和海外类型的小程序暂不支持

指向域名的限制:域名必须为 https 协议且经过ICP备案

域名修改限制:一个小程序最多可添加20个域名,一年可修改50次

基础库限制:基础库 1.6.4 以上版本支持这组件

注:配置域名时,需要从配置后台下载校验文件放在域名根目录下,验证通过后才能配置成功。

实例:

1. index.wxml

错:

开发的时候有时会遇到如下提示:

原因是内嵌的H5页面也是要通过微信授权才能开发的,像开发小程序一样把自己添加到H5页面的开发者里面去就好了。

小程序和内嵌页面的联系

小程序提供了H5网页中使用的JSSDK文件,如下引用:

// javascript

wx.miniProgram.navigateTo({url: '/path/to/page'})

引入SDK后可以调用小程序JSSDK提供的API,虽然不如小程序原生API丰富,但也有获取设备网络状态、地理位置、微信扫一扫、摇一摇、长按识别、拍照等接口。

截止目前为止,小程序基本不能获取网页的数据,只有在用户分享的时候,可以从返回的参数中获取 组件当前显示的页面路径。

注意事项:

1:如果h5页面有请求必须是https请求;

2:如果不是内嵌h5域名不是和当前小程序一样需要在小程序后台配置业务域名;

3:内嵌的h5页面占满了整个屏幕覆盖了原有组件;(通过一下方式可以解决但是在开发者工具上没有效果在真机 上可以显示显示)

1:link.wxml

客服

客服

2:link.wxss

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值