体育彩票31选7 www.tyv1.com.cn 体育彩票31选7 > 上网技巧 > 电脑小技巧 > 微信小程序内嵌H5页面

微信小程序内嵌H5页面

时间:2018-06-14 15:06 作者:QQ地带 我要评论

<web-view>概况
 
使用 <web-view> 标签能在小程序中打开外部网页,但是要打开的网页的域名必须跟小程序的业务域名(业务域名可以在小程序的后台管理界面添加)一致,否则在真机上是打不开的。如果开发工具上勾选了‘不校验域名’,在开发的时候还是能打开的,但也没用,线上是打不开的。
 
不管有没有内容,<web-view> 会占满整个屏幕。
 
<web-view> 内嵌H5,更新代码发布上线可以绕过审核。
 
<web-view>的限制
 
使用限制:对个人类型和海外类型的小程序暂不支持
指向域名的限制:域名必须为 https 协议且经过ICP备案
域名修改限制:一个小程序最多可添加20个域名,一年可修改50次
基础库限制:基础库 1.6.4 以上版本支持这组件
注:配置域名时,需要从配置后台下载校验文件放在域名根目录下,验证通过后才能配置成功。
 
实例:
 
1. index.wxml
 
[html] view plain copy
<button bindtap='goBaidu'>点击跳转</button>  
2. index.js
 
[javascript] view plain copy
    goBaidu () {  
        wx.navigateTo({  
            url: '../outer/outer'  
        })  
    },  
3. outer.wxml
 
[html] view plain copy
<web-view src="https://www.baidu.com/"></web-view>  
4. app.json
 
[javascript] view plain copy
"pages":[    
    "pages/index/index",   
    "pages/outer/outer"    
],   
报错:
 
开发的时候有时会遇到如下提示:
 
 
 
原因是内嵌的H5页面也是要通过微信授权才能开发的,像开发小程序一样把自己添加到H5页面的开发者里面去就好了。
 
小程序和内嵌页面的联系
 
小程序提供了H5网页中使用的JSSDK文件,如下引用:
 
[javascript] view plain copy
<!-- html -->  
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"></script>  
   
// javascript  
wx.miniProgram.navigateTo({url: '/path/to/page'})  
引入SDK后可以调用小程序JSSDK提供的API,虽然不如小程序原生API丰富,但也有获取设备网络状态、地理位置、微信扫一扫、摇一摇、长按识别、拍照等接口。
 
截止目前为止,小程序基本不能获取网页的数据,只有在用户分享的时候,可以从返回的参数中获取 <web-view> 组件当前显示的页面路径。

标签: 微信
顶一下
(0)
0%
踩一下
(0)
0%

Google提供的广告

335| 125| 723| 285| 750| 115| 690| 741| 125| 448|