背景
VLC Media Player 是一款可播放大多数格式，而无需安装编解码器包的媒体播放器。可以播放 MPEG-1、MPEG-2、MPEG-4、DivX、DVD/VCD、卫星数字电视频道、地面数字电视频道(digital terrestrial television channels)、在许多作业平台底下透过宽带 IPv4、IPv6 网络播放线上影片；此软件开发项目是由法国学生所发起的，参与者来自于世界各地，设计了多平台的支持，可以用于播放网络串流及本机多媒体档案之播放。
allWebPlugin中间件是一款为用户提供安全、可靠、便捷的浏览器插件服务的中间件产品，致力于将浏览器插件重新应用到所有浏览器。它不仅可以实现ActiveX控件在现代浏览器上使用，而且集成也非常方便。
alWebPlugin中间件核心优势
1、自创定位算法，实现插件与页面布局无缝衔接，极致用户体验。
2、自创插件接口调用方法，保持原汁原味的接口调用及事件响应方式，轻松实现OA系统升级改造。
3、支持同一页面或不同页面同时加载多个插件，适应各种复杂应用场景。
4、自主创新、安全可控，不受浏览器插件技术限制，支持更多浏览器（谷歌、火狐、Edge、360浏览器等）。
5、创新沙箱机制,隔离插件与浏览器运行环境，增强插件与浏览器稳定性和安全性。
6、攻克诸多技术难点，实现插件不修改、不注册也能使用，极大的降低插件开发量和维护量。
准备工作
1、下载allWebPlugin中间件产品，具体如下：
链接：百度网盘 请输入提取码
提取码：z3q0
运行效果
本demo演示一个页面同时加载4个VLC插件，每个插件单独一个进程，相互独立，互不干扰，CPU使用情况。
集成代码
<script language="javascript">
var g_allWebPlugin;
var hostCnt0 = null;
var hostCnt1 = null;
var hostCnt2 = null;
var hostCnt3 = null;
var vlcPlugin0 = null;
var vlcPlugin1 = null;
var vlcPlugin2 = null;
var vlcPlugin3 = null;
var httpclientObj = null;
var pluginUtilityObj = null;
var itemId; // 播放列表中播放节目的id
var vlcSound; // vlc音量大小（初始化默认为50）
var videoLength; // 视频总时长
var then_time; // 播放开始时间(播放开始的日期，看下面实现代码，它是毫秒哦)
var isPlaying = 0; // 是否播放状态 （0 未播放 1 播放）
function CreateContainer() {
var canvas0 = document.getElementById("myCavas0");
var canvas1 = document.getElementById("myCavas1");
var canvas2 = document.getElementById("myCavas2");
var canvas3 = document.getElementById("myCavas3");
var license = "MflueZj/CS2h1vJPNDhhNgbo6+5KbzbcjNrz8O0eGGHD8/PnispjWgloqv35+GKyUcLewymM4IS+DfDx4Z+MIAD2FzVdJYjmNM7gvQOO+O6QZTd+4iegO8RWRvZJyFKupQIREK9jq79AS4rfjjFbUG0746hLnnci6UE+8mxrQdIjLEyY6AS3rD7WwwEyKe4o4v+avhwxK422C2O62Sxbv+nAEaiZifY2sd0oJ59aqzWwv6o+vUpScc8GMsGl3m26I6ITbwFby45Le80A41w+ptQWVNb/L89Zha1O6AcsgIqt/WDoOuI9ohBA6V8PIdIiAAAA8AEAAQMCC1bjBJLzZ/6IZJHQysytHo+dyZZZeUCWl63o+sjppt6PUvBWIOYEOV1wz/hL596LZ/1uaf8E1q7umxnDUgky9l+gvdBc9lzkN046Y2ybGAm7nNyHL95X8yctUoDT8IJ7CueWozYag48axc97Fz0+DxrWuwy+v604ojrJFcWZj0IEUW1TVumLiZjA0c2ypR4ft3voi6DSkj14VXwvYXbnbUB6qu9wgx1brbf3kmn0gAi2WdqOECc5mawKcFZm6zHlJFsUjMxBrRngdGJPqzRJKKvuT+SEk0T9nvE0HCt0hcBOhlo7jgoq1mNKmZ71r3pMF70ufCrpI7HOARNBTOR5xQABAYICCgGCMEJT37UH4awsFAkLyTc7WO8xS4MTBNyRNM8IKQJ9/8QQ7TY85cOj84Z6tQhKCATx2E0j1nLQT/25sz72rDvzUlbPKLJ+RJejxMsC0IU9CLpMU3k0vUBDmivHrvOABhfv9qzjhFWp2dLa4T0cZn+k5jXLACn7lg6qBoHjetcHKjj713HmnWZKj6wmX5DzHhGktWzP5OfR9X/BSj0ZE7BS54yDEyXCrb/K+Do+l4sov1GOdf+OQvMUGLWEc0wNX8mTJsIPN901OAcV3OORq68g1x24YFgv04f7gamC2cQkgqDbc+AG9U2ilp02doAy/IQjo8LKtyQSZ12KcRjNUrE18HsAAAEOAAAAAUFXUEY=";
var installPackageUrl = "http://127.0.0.1:6651/install/allwebPlugin_x86_v2.0.1.16_20240806.exe";
var installPackageVersion = "2.0.0.16";
g_allWebPlugin = new allWebPlugin();
if(g_allWebPlugin.IsInstall() == false){
//未安装，需要手动安装
if(confirm("allWebPlugin中间件未安装或未启动,是否立即安装？")){
window.open(installPackageUrl, '_blank');
}
}else{
//已安装，检测是否需要版本更新
if(g_allWebPlugin.IsNewVersion(installPackageVersion) == false)
{
hostCnt0 = g_allWebPlugin.createContainer(canvas0,"PluginContainer",license,false);
if(hostCnt0)
{
//hostCnt0.UI.ForceShowUI(false);//创建时隐藏插件,需要调用这句，隐藏插件
hostCnt0.RegisterEvent("OnCreated;OnCommand;OnRibbonCtrlCommand;OnOLECommand");
vlcPlugin0 = CreatePlugin(hostCnt0,"http://vd2.bdstatic.com/mda-mhhf5mr00yyhpfjs/1080p/cae_h264/1629284581057661229/mda-mhhf5mr00yyhpfjs.mp4");
}
hostCnt1 = g_allWebPlugin.createContainer(canvas1,"PluginContainer",license,false);
if(hostCnt1)
{
//hostCnt0.UI.ForceShowUI(false);//创建时隐藏插件,需要调用这句，隐藏插件
hostCnt1.RegisterEvent("OnCreated;OnCommand;OnRibbonCtrlCommand;OnOLECommand");
vlcPlugin1 = CreatePlugin(hostCnt1,"http://vd2.bdstatic.com/mda-mhig1c3sw223mx8p/1080p/cae_h264/1629380139191731149/mda-mhig1c3sw223mx8p.mp4");
}
hostCnt2 = g_allWebPlugin.createContainer(canvas2,"PluginContainer",license,false);
if(hostCnt2)
{
//hostCnt0.UI.ForceShowUI(false);//创建时隐藏插件,需要调用这句，隐藏插件
hostCnt2.RegisterEvent("OnCreated;OnCommand;OnRibbonCtrlCommand;OnOLECommand");
vlcPlugin2 = CreatePlugin(hostCnt2,"http://vd2.bdstatic.com/mda-mi1dd05gmhwejdwn/sc/cae_h264/1630576203346678103/mda-mi1dd05gmhwejdwn.mp4");
}
hostCnt3 = g_allWebPlugin.createContainer(canvas3,"PluginContainer",license,false);
if(hostCnt3)
{
//hostCnt0.UI.ForceShowUI(false);//创建时隐藏插件,需要调用这句，隐藏插件
hostCnt3.RegisterEvent("OnCreated;OnCommand;OnRibbonCtrlCommand;OnOLECommand");
vlcPlugin3 = CreatePlugin(hostCnt3,"http://vd2.bdstatic.com/mda-mesdm11tdp69a9ye/1080p/cae_h264/1622115758783335310/mda-mesdm11tdp69a9ye.mp4");
}
}else{
//需要升级
alert("检测到升级包,立即升级。");
g_allWebPlugin.UpdateVersion(installPackageUrl).then(function(data){
if(data.code == 0)
{ //检测是否安装成功
var checkInstall = setInterval(function(){
if(g_allWebPlugin.GetVersion() == installPackageVersion){
window.location.reload();
clearTimeout(checkInstall);
}
}, 1000);
}
else{
window.open(installPackageUrl, '_blank');//直接下载包，手动安装
}
}).catch(function(strErr){
window.open(installPackageUrl, '_blank');//直接下载包，手动安装
});
}
}
}
function MediaPlayerStopped() {
pluginUtilityObj = hostCnt.getPluginUtility();
if (pluginUtilityObj)
pluginUtilityObj.ShowMessage("MediaPlayerStopped！");
}
function CreatePlugin(hostCnt,url) {
if (hostCnt == null) return;
var vlc = hostCnt.createProxyPlugin("{9BE31822-FDAD-461B-AD51-BE1D1C159921}");
if (vlc != null) {
vlc.MRL = url;//"http://vd2.bdstatic.com/mda-mi1dd05gmhwejdwn/sc/cae_h264/1630576203346678103/mda-mi1dd05gmhwejdwn.mp4";
vlc.AutoPlay = true;
vlc.volume = 50;
var playlist = vlc.playlist();
if (playlist) {
var video_url = url;//"http://vd2.bdstatic.com/mda-mi1dd05gmhwejdwn/sc/cae_h264/1630576203346678103/mda-mi1dd05gmhwejdwn.mp4";
var options = ":rtsp-udp";
var itemId = playlist.add(video_url, "", options); //.add(vedio_url);
playlist.playItem(itemId);
playlist.play();
}
var audio = vlc.audio();
if (audio == null) {
return;
}
audio.volume = 10;
audio.toggleMute();
}
}
function init() {
CreateContainer();
}
</script>