开启掘金成长之旅！这是我参与「掘金日新计划 · 2 月更文挑战」的第 14 天，点击查看活动详情

全局变量的设置

公共文件

设置一个公共文件，例如common.js ,然后在入口文件引入进来。然后在之后使用的页面都引入这个文件，而这个文件则是一个变量的公共文件的存在。

Vue.prototype

我们可以把全局变量添加到原型上。

globalData 全局属性

在app.vue中设置全局变量

		onLaunch: function() {
			
			console.log('定义全局变量')
			getApp().globalData.configCustom={
				api:"https://web.guoyinweilai.com/gywl/api.php",
				baseImgUrl:"http://web.guoyinweilai.com/gywl/"
			};
			
		}

uni-app中视频的坑

简要

在使用uni-app自带的video标签时，有一些视频在uni-app中不能够播放，但是单独写h5页面是就可以播放。

所以我尝试一下videojs的使用，这个好像是h5直播都是可以用的依赖组件。

video.js的使用

但是并没有解决我的问题，video主要是处理直播的。

代码如下：

			initVideoplay(){
				
					let video = document.createElement('video');
					video.id = 'video';
				
					video.style = 'width: 100%; height: 100%;'
					video.controls = true
					video.setAttribute('playsinline', true) //IOS微信浏览器支持小窗内播放
					video.setAttribute('webkit-playsinline', true) //这个bai属性是ios 10中设置可以让视频在小du窗内播放，也就是不是全屏播放的video标签的一个属性
					video.setAttribute('x5-video-player-type', 'h5') //安卓 声明启用同层H5播放器 可以在video上面加东西
					let source = document.createElement('source')
					// source.src = 'http://1253228538.vod2.myqcloud.com/c1b0a541vodbj1253228538/6d207b82387702303352290304/ZqzOWXtnCfsA.mp4';  //设定的流地址
					source.src="http://video.guoyinweilai.com/ce885ba66e95466399905cfbead70ebe/e8060b566f4e4d8bb9341eb5d30c0aa7-a5b7d8911cc7d347a9c9dd7e9b1d521b.mp4";
				  if (source.src.indexOf('.mp4') !== -1) {
					  
					//mp4类型
					source.type = 'video/mp4'
				  } else if (source.src.indexOf('.m3u8') !== -1) {
					  
					//hls类型
					source.type = 'application/x-mpegURL'
				  } else if (source.src.indexOf('.flv') !== -1) {
					  
					//flv类型
					source.type = 'video/flv'
				  } else {
					  
					//rtmp类型
					source.type = 'rtmp/hls'
				}
			
				//将播放源添加到video的子级
				video.appendChild(source);
				//挂载到视频容器中
				this.$refs.videoplay.$el.appendChild(video);
				this.videoPlayer=videojs("video",{
					autoplay:true
				},function(){
					
				  this.on('play', function () {
					//开始播放
					console.log('开始播放')
					that.isPlaying = true
				  })
					
				});
        
			}