H5被app调用实践

H5被app调用实践

tabTitle导航不使用app的，使用h5自己返回按钮

• 问题
• 安卓手机下，从第一页跳转到第二页，第二页的路由back()调用不成功
• 原因
• 第一页没有计入history中
• 解决方案
• 在页面加载完毕后
• if (window.history.length == 0) { window.history.pushState({}, '', "首页路由"); }

h5给app发消息

• Navigator可以是其他名字，又app定
• Navigator.postMessage('需要传递的参数')

首次从app进入H5（app调用h5方法）

• 问题
• 安卓手机调用h5挂载在window下的方法会调用3遍，苹果手机不会
• 原因
• 不清楚app在哪个生命周期能调用成功h5window下的方法
• 解决方案
• 全局添加一个计数器（以从app获取token为例）

•  <script>
   	data () {
   		return {
   			count: 0, // 计数器
   		}
   	},
   	created() {
   	let _this = this
   	window.setToken = function(token) {
   		if (_this.count == 0) {
   			if (token) {
   				_this.count++
   				// 此处再调用想要执行的
   				localStorage.setItem('token', token);
   			} else {
   				return false
   			}
   		}
   	}
   },
   </script>