小程序web-view引入外部网页使用入坑

官方文档 https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html

web项目中引入jssdk

<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>

• 而后项目中可以直接使用wx.等api

注意：在开发者工具中会出现导航栏遮住网页内容的情况，在手机中没有问题

问题：直接引入web-view会出现小程序导航没有返回键

解决办法：跳转之前，新建一个空页面，从这个空白页面跳转到web-view页面

修改页面title

• 打开的域名没有在小程序管理后台设置业务域名（注意是业务域名，不是服务器域名）
• 打开的页面必须为https服务
• webview中的html的title会自动放到小程序的头部作为标题

<!--vue中-->
// 判断是否小程序环境，是则隐藏nav,修改title
let _this = this
wx.miniProgram.getEnv(function(res) {
  _this.envMiniprogram = !!res.miniprogram
  // 为小程序设置title
  _this.$route.meta.title = _this.$store.state.currentIMInfo.userProfile.nick
  _this.title = _this.$store.state.currentIMInfo.userProfile.nick
})