现在小程序的功能越来越强大,可以将网页嵌套到小程序了,这对开发者来说是很值得高兴的一件事情,下面具体说下操作步骤
1.配置业务域名
- 首先设置权限,要在小程序中访问外部的网页,需要先设置允许访问的业务网站的域名,登录小程序平台管理后台页面,进入“设置”->开发设置
- 下载校验文件,将文件放到域名的根目录下,比如:www.wxaaa.com,然后将要访问的域名,添加到设置,进行保存
2.使用web-view
组件引入页面
<web-view src="https://www.wxaaa.com/index.html" />
注:小程序的这个<web-view>
总是自动铺满整个页面,每个页面只能有一个<web-view>
,它会覆盖其它的组件。而<iframe>
可以嵌套入到页面的任意部分
以上为小程序嵌套网页,那如果网页中又想跳转到小程序页面该怎么办呢?
可以引入微信的一个jssdk,使用它提供的方法来实现。<web-view>
网页中可使用JSSDK 1.3.2提供的接口返回小程序页面。 支持的接口有:
wx.miniProgram.navigateTo
参数与小程序接口一致 1.6.4wx.miniProgram.navigateBack
参数与小程序接口一致 1.6.4wx.miniProgram.switchTab
参数与小程序接口一致 1.6.5wx.miniProgram.reLaunch
参数与小程序接口一致 1.6.5wx.miniProgram.redirectTo
参数与小程序接口一致 1.6.5wx.miniProgram.postMessage
向小程序发送消息 1.7.1wx.miniProgram.getEnv
获取当前环境 1.7.1
具体做法:
<!-- html代码中引入JS SDK -->
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"></script>
<script>
// 跳转到小程序的一个页面
wx.miniProgram.navigateTo({url: '/pages/login/'})
</script>
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。