uniapp APP 接入萤石云

unipp App端接入萤石云

采用webview方法,我之前看各路大佬说的把html文件放到static文件夹里面,正常运行html文件可以正常运行并播放监控画面,但是集成到app中发现监控页面不能够展示出来 ,后来解决办法是把html文件放到了服务器上,webview的链接是个线上链接。

代码如下

vue
<template>
	<view class="webview">
		<web-view :src="url" id="webcon"/>
	</view>
	url = "http://xxx.html?url=" + this.videoUrl
	// videoUrl是监控的链接,html是线上地址

</template>
html
<script type="text/javascript" src="http://static.yfpyx.com/bigdata_app/js/ezuikit.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<body>
  <video 
    id="myPlayer"
    autoplay
    src=""
    controls
    playsInline 
    webkit-playsinline
  >
  </video>
  <script>
	window.onload=()=>{
		// 截取url中传递过来的监控链接
		var str = decodeURIComponent(window.location.search.substr(5))
		// str = decodeURIComponent(str)
		setTimeout(() => {
			$('#myPlayer').attr("src", str);
			// 日志
			var player = new EZUIKit.EZUIPlayer('myPlayer');
			// 测试时打印log
			// player.on('log', log);
		}, 500)
		
		function log(str) {
			console.log(str)
			var div = document.createElement('DIV');
			
			div.innerHTML = (new Date()).Format('yyyy-MM-dd hh:mm:ss.S') + JSON.stringify(str);
			document.body.appendChild(div);
		}
	}

  </script>
</body>

你可能感兴趣的:(uniapp,javascript,webview,前端)