EasyNVR无插件IPC摄像机直播方案前端构建之:区分页面是自跳转还是分享依据
区分分享还是跳转
对于前端一些页面的展示,通常有两种方式:通过入口链接一步步进入,或是通过分享链接直接进入;对于这两种方式的区别是什么?在进行前端书写时又应该如何处理?
以EasyNVR为例来进行说明解释:
EasyNVR通过视频广场界面可以进入到对应的通道内进行视频的观看;
为了方便用户,给用户更好的体验;在播放页面还设有视频分享功能;也方便了用户通过移动设备随时观看视频信息;
对于具体的跳转播放和分享播放有什么区别:
从视频广场直接跳转过来:
在视频广场界面通过点击事件来跳转到播放路径,进入对应的通道来进行视频播放;在跳转路径前会对获取到的信息进行处理;将获取到的信息存入cookie;
$.cookie("videoUrl", videoUrl);
$.cookie("DeviceType", DeviceType);
$.cookie("videoImg", $img.attr("src"));
$.cookie("channel", channel["Channel"]);
$.cookie("channelName", channel["Name"]);
top.location.href = "./play.html?channel=" + channel["Channel"];
通过链接分享页面:
对于播放页面就可通过cookie来判断页面是跳转过来还是分享过来的;
if (channel == $.cookie("channel")) {
if ($.cookie("DeviceType") == 'ONVIF') {
if(isPC()){
$("#ipcam_div").show();
}
}
player = setupPlayer($.cookie("videoUrl"), $.cookie("videoImg"));
$(".channel-title").text($.cookie("channelName") || "通道直播");
} else {
$.ajax({
type: "GET",
url: "/api/v1/getchannelstream",
data: {
Channel: channel,
Protocol: isPC() ? "RTMP" : "HLS",
Line: "local",
From: "lan"
如果没有cookie值则是分享页面,会通过ajax重新去请求数据在页面进行调用;
关于EasyNVR
EasyNVR能够通过简单的网络摄像机通道配置,将传统监控行业里面的高清网络摄像机IP Camera、NVR等具有RTSP协议输出的设备接入到EasyNVR,EasyNVR能够将这些视频源的音视频数据进行拉取,转换为RTMP/HLS,进行全平台终端H5直播(Web、Android、iOS),并且EasyNVR能够将视频源的直播数据对接到第三方CDN网络,实现互联网级别的直播分发;
详细说明:http://www.easydarwin.org/easynvr/
获取更多信息
Copyright © EasyDarwin.org 2012-2017
EasyNVR无插件IPC摄像机直播方案前端构建之:区分页面是自跳转还是分享依据的更多相关文章
- EasyNVR无插件IPC摄像机直播方案前端构建之:如何区分PC端和移动端
EasyNVR前端为了更好的用户体验,不仅仅设有PC客户端,还适应移动客户端: EasyNVR的客户端中PC端和移动端差异有很多.例如: 由于PC端.移动端自身硬件的差异,所需要展示的样式也会存在一定 ...
- EasyNVS摄像机公网全终端无插件网页摄像机直播管理服务运行出现“请求服务不存在或已停止”
背景分析 了解我们产品线的小伙伴都知道,EasyNVR产品主要用于互联网安防直播,通过EasyNVR拉取摄像机的RTSP视频流,客户端通过访问EasyNVR服务端就可以实现音视频流分发.在此情况下会出 ...
- EasyNVR网页H5无插件播放摄像机视频功能二次开发之直播通道接口保活示例代码
背景需求 随着雪亮工程.明厨亮灶.手机看店.智慧幼儿园监控等行业开始将传统的安防摄像头进行互联网.微信直播,我们知道摄像头直播的春天了.将安防摄像头或NVR上的视频流转成互联网直播常用的RTMP.HT ...
- EasyNVR无插件H5/HLS/m3u8直播解决方案中Windows系统服务启动错误问题的修复:EasyNVR_Service 服务因 函数不正确。 服务特定错误而停止。
最近在做某地市移动公司景观直播的项目时,遇到一个问题,当我们部署EasyNVR为系统服务后,居然出现了无法启动服务的现象,表面上看,提示是系统服务启动失败,实际通过查看windows 系统日志: 查找 ...
- EasyNVR无插件直播流媒体服务器云端集中管控的EasyNVS云管理平台安装使用文档
EasyNVS - EasyNVR云端集中管理服务 EasyNVS云管理平台是一套专门用于集中化管理EasyNVR 的解决方案. EasyNVR 采用主动注册的方式接入到 EasyNVS, 再由 Ea ...
- EasyNVR无插件直播服务器软件接口调用返回“Unauthorized”最简单的处理方式
背景需求 对于EasyNVR的受众群体十分的广泛,不仅仅有将EasyNVR作为视频直播平台直接使用的,更多的是使用EasyNVR的对应功能集成到自身系统.对于前者,只需要将软件的使用功能搞清楚即可,对 ...
- 使用EasyNVR无插件流媒体服务器接口和EasyPlayer.js播放器插件实现web网页H5播放无插件
1.背景需求 很多客户在使用EasyNVR无插件流媒体服务器时,不喜欢产品化的界面,有时可能满足不了日常观看使用的需求.因此软件提供丰富的HTTP接口,供第三方平台调用集成.但是有时客户这边可能没有专 ...
- EasyNVR摄像机网页无插件直播方案H5前端构建之:区分页面是自跳转页面还是分享页面
背景分析 EasyNVR整套方案的架构中,涉及到前端设备(摄像机IPC.硬盘录像机NVR.编码器等).流媒体服务端(EasyNVR).客户端终端设备(PC.浏览器.Android.iOS.微信). 在 ...
- EasyNVR无插件播放HLS/RTMP网页直播方案前端完善:监听表单变动
在上一篇博客中我们表述完了防止提交成功后多余操作提交的一个过程:其中的精髓在于ajax的触发事件的使用. 而这篇博客主要想说明一下如何实时的判断出表单是否发生变化. 问题表述: 在网页前端的开发过程中 ...
随机推荐
- 第13届景驰-埃森哲杯广东工业大学ACM程序设计大赛【待补】
[链接]:https://www.nowcoder.com/acm/contest/90#question
- Xamarin XAML语言教程Xamarin.Forms中改变活动指示器颜色
Xamarin XAML语言教程Xamarin.Forms中改变活动指示器颜色 在图12.10~12.12中我们会看到在各个平台下活动指示器的颜色是不一样的.Android的活动指示器默认是深粉色的: ...
- ZFS -世界上最高级的文件系统之一
https://www.oschina.net/news/44302/openzfs_launch_announcement https://en.wikipedia.org/wiki/ZFS ZFS ...
- getenv, _wgetenv
Description The C library function char *getenv(const char *name) searches for the environment strin ...
- C#规范整理·泛型委托事件
基于泛型,我们得以将类型参数化,以便更大范围地进行代码复用.同时,它减少了泛型类及泛型方法中的转型,确保了类型安全.委托本身是一种引用类型,它保存的也是托管堆中对象的引用,只不过这个引用比较特殊,它是 ...
- Java Web开发(JSP、Servlet)乱码的一揽子解决方案
千万不要看网上那些杂七杂八的解决乱码的文章,解决乱码最好的方法是(没有之一):在所有地方统一采用UTF-8编码. 这其中包括: 1 - 工程 如果使用的是Eclipse,那么打开Preference, ...
- RPM命令使用
RPM是RedHat Package Manager(RedHat软件包管理工具)的缩写 •rpm的常用参数 i:安装应用程序(install) e:卸载应用程序(erase) vh:显示安装进度:( ...
- 【前端阅读】——《活用PHP、MySQL建构Web世界》摘记之高级应用
一.高级应用 1.计数器 计数器的原理很简单,只有两步: 第一步就是读写一个数字,第二步就是显示出来.一般CGI'大多直接写到文件系统,当然也可以利用MySQL来存储这个数字,完成第一步的操作. 第二 ...
- rsync的几则tips(渗透技巧)
转自91ri 关于rsync rsync(remote synchronize)——Linux下实现远程同步功能的软件,能同步更新两处计算机的文件及目录.在同步文件时,可以保持源文件的权限.时间.软硬 ...
- Python爬虫爬取美剧网站
一直有爱看美剧的习惯,一方面锻炼一下英语听力,一方面打发一下时间.之前是能在视频网站上面在线看的,可是自从广电总局的限制令之后,进口的美剧英剧等貌似就不在像以前一样同步更新了.但是,作为一个宅diao ...