兼容IOS-阻止视频全屏

src/mixins/screenshot.js

@@ -77,6 +77,7 @@ export default {
 			let pixelData = new Uint8Array(width * height * 4);
 			gl.readPixels(this.bottomLeftX*pix, this.bottomLeftY*pix, width, height, gl.RGBA, gl.UNSIGNED_BYTE, pixelData);
 			this.flip(pixelData, width, height, 4);//入参必须是整数 width height
+			// alert("getClipPicUrl1"+width)
 			//参考 Threejs WebGLRenderer.readRenderTargetPixels
 			// let drawCanvasCtx = this.canvas.getContext('2d');
 			// let canvas = document.createElement('canvas');
@@ -95,7 +96,7 @@ export default {
 			canvas.height = img.height;
 			canvas.width = img.width;
 			context.putImageData(img, 0, 0);
-			
+			// alert("getClipPicUrl2"+width)
 		    // let data = drawCanvasCtx.getImageData(100, 100, 200, 200);
 		    // canvas.width = 100;
 		    // canvas.height = 100;

src/pages/webgl_rxdz_clipImg/webgl_rxdz_clipImg.html

@@ -26,5 +26,7 @@
 	  :spaceObj="curSpaceObj" ></viewMask> -->
 	<!-- 生成截屏的画布对象 -->
 	<canvas id="canvas" type="2d" :style="{'height':'200px','top':'200px'}"></canvas>
-	<video id="myvideo" style="display: none;" loop muted autoplay webkit-playsinline="webkit-playsinline" playsinline="playsinline" :src="videoUrl"></video>
+	<video id="myvideo" style="display: none;" loop muted autoplay controls="false" 
+
+	:src="videoUrl"></video>
 </div>

src/pages/webgl_rxdz_clipImg/webgl_rxdz_clipImg.scss

@@ -66,14 +66,15 @@ page {
 	background: transparent;
 	z-index: 10;
 	pointer-events: none;
+	padding: 8px;
 	.box-empty{
 		// position: absolute;
-		width: calc(100% - 20px);
-		height: calc(100% - 20px);
-		margin-top: 6px;
-		margin-left: 6px;
+		width: 100%;
+		height: 100%;
+		// margin-top: 6px;
+		// margin-left: 6px;
 		border: 4px solid #fff;
-		box-sizing: content-box;
+		// box-sizing: content-box;
 		box-shadow: rgba(0,0,0,.8) 0px 0px 0px 2005px;
 	}
 	.boundary{

src/pages/webgl_rxdz_clipImg/webgl_rxdz_clipImg.vue

@@ -212,12 +212,20 @@
 				camera.lookAt(that.controlStarPosition.x, that.controlStarPosition.y, that.controlStarPosition.z);
 				starRender(); //启动渲染
 				// var guideMask = document.querySelector('#guide-mask');
-				document.addEventListener("touchstart",  ()=> {
-					// guideMask.classList.add('guide-mask-hide');
-					setTimeout(()=>{
-						videoHandle();
-					},200)
-				}, false);
+				
+				if(that.isIOS){
+					document.addEventListener("WeixinJSBridgeReady", function (){
+					    videoHandle();
+					}, false)
+				}else{
+					document.addEventListener("touchstart",  ()=> {
+						// guideMask.classList.add('guide-mask-hide');
+						setTimeout(()=>{
+							videoHandle();
+						},200)
+					}, false);
+				}
+				
 			}
 
 			function videoHandle() {
@@ -225,11 +233,22 @@
 					return false
 				}
 				// 创建视频元素
-				var video = document.createElement('video');
+				// var video = document.createElement('video');
+				var video = document.getElementById('myvideo');
 				video.src = that.videoUrl; // 视频文件的路径
 				video.setAttribute("crossOrigin", "Anonymous");
 				video.loop = true;
 				video.muted = true;
+				video.controls = true;
+				video.setAttribute('webkit-playsinline', true);
+				video.setAttribute('playsinline', true);
+				// video['custom-cache'] = false;
+				// video['x5-playsinline'] = '';
+				// video['webkit-playsinline'] = true;
+				// video['playsinline'] = true;
+				// video['x-webkit-airplay'] = '';
+				// // video['x5-video-player-fullscreen'] = false;
+				// video['x5-video-player-type'] = 'h5-page';
 				video.play();
 				
 				console.warn("***video***",video,video.width);
@@ -452,6 +471,7 @@
 				// 	showCancelButton: true
 				// });
 				// window.open(shottingImg, "_blank");
+				window.location.href = shottingImg
 			},
 			navbarBackClk() {
 
@@ -467,6 +487,7 @@
 				// this.clientY = 0;
 				this.startX = e.changedTouches[0].clientX;
 				this.startY = e.changedTouches[0].clientY;
+				e.preventDefault();
 			},
 			mytouchmove(e) {
 				let startX = this.startX; 	// 开始x坐标 
@@ -476,6 +497,7 @@
 				// this.clientX = touchMoveX - startX;
 				// this.clientY = touchMoveY - startY;
 				this.widthHandle(touchMoveX,1);
+				e.preventDefault();
 			},
 			mytouchend(e) {