ios设备safari浏览器,地址栏会遮挡视图

ios设备safari浏览器,因为在移动端,点击头部区域的边缘处,地址栏会自动显示,导致视图被遮挡,请问有什么好一点的解决方案吗?
我监听window的resize事件,判断地址栏落下后,执行以下代码:
var canvasEl = document.querySelector(’#GameCanvas’)
canvasEl.style.height = window.innerHeight + ‘px’ // 确保canvas始终在可视范围
这样的确达到了想要的效果,但是,所有的按钮的触点全部错位,实际需要点击的位置与全屏时的位置一致,有人知道这是什么原因造成的吗?

求了解的大神解答一下,感谢

最后通过此方法解决了
https://blog.csdn.net/u013654125/article/details/79034208

询问一下楼主,在这个方法中,我直接采用他的代码实作,在google、safari以及vivo内建浏览器上并没有正常执行,google会一直闪屏,而safari上则是滑动完后全屏,但是并没有跑出我的H5专案,vivo则是连滑动符号都没有出现

给楼主跪了

上面的方法确实不能百分百保证每次都可以全屏,比如从后台返回应用,有时会出现滑动不能全屏的现象,不过绝大部分都是可行的,我实现的总体思路就是,在支持全屏api的浏览器里面就调用全屏api实现全屏,不支持时就提示滑动,再不行就添加取消按钮,关闭遮罩

好像使用这个方案还是会点击错位呢