uniApp生成的h5页面禁止浏览器上缩放页面（支持安卓，ios）

项目场景：

uniapp h5内嵌原生app ios样式问题：
1.双击和双指滑动，内嵌的h5页面均会被放大缩小
2.修改ios底部的安全距离的背景色，默认是白色

问题描述

1.双击和双指滑动，内嵌的h5页面均会被放大缩小
2.解决ios底部的安全距离和修改背景色，默认是白色

解决方案：

安卓只需要在h5.template.html中加入以下代码即可

<meta name="viewport"
			content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

IOS 问题一：

// 禁用双指放大
  document.addEventListener('touchstart',function (event) {
      if(event.touches.length>1){
          event.preventDefault();
      }
  });
  // 禁用双击放大
  let lastTouchEnd=0;
  document.addEventListener('touchend',function (event) {
      const now=(new Date()).getTime();
      if(now-lastTouchEnd<=300){
          event.preventDefault();
      }
      lastTouchEnd=now;
  },false);
  document.addEventListener('gesturestart', function (event) {
      event.preventDefault();
  });

（注意：虽然以上代码解决了缩放，但是其实还有一种隐藏情况，就是在滚动过程中进行双指滑动页面还是可以放大的）

IOS 问题二：
先去pages.json页面，在app-plus里面添加

"app-plus":{
	"background": "#CCCCCC", //背景色
	"safearea" : {
		//安全区域配置，仅iOS平台生效  
		"bottom" : {
			// 底部安全区域配置  
			"offset" : "none" // 底部安全区域偏移，"none"表示不空出安全区域，"auto"自动计算空出安全区域，默认值为"none"  
		}
	}

然后回到vue页面，在最外面的view标签里面添加类名.safe-padding，css写法如下，至此问题二解决

 .safe-padding {
   padding-bottom: constant(safe-area-inset-bottom);
   padding-bottom: env(safe-area-inset-bottom);
   box-sizing: content-box;
 }