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的触发事件的使用. 而这篇博客主要想说明一下如何实时的判断出表单是否发生变化. 问题表述: 在网页前端的开发过程中 ...
随机推荐
- datasnap——动态注册服务类
datasnap——动态注册服务类 在DataSnap的应用程序时,我们首先需要注册的服务器类,以提供访问客户端应用程序的服务器方法.通常的做法是使用DSServerClass组件,但有些时候,我们要 ...
- flannel无法跨主机ping通容器的解决方式
前几天,出现了无法跨主机ping通容器的情况,导致一个node机网络中断,无法访问,排查过程如下. 首先确认,宿主机node2是可以ping通容器 [root@node2 ~]# ping 10.1. ...
- 【lombok】lombok---帮你简化生成必要但臃肿的java代码工具 【映射注解和lombok注解同时使用 以及 映射注解放在属性和get方法上的区别】
官方地址:https://projectlombok.org/ GitHub:https://github.com/rzwitserloot/lombok 指导说明文档:http://jnb.ociw ...
- linux下ftp、telnet的安装和使用
1.ftp的安装和使用 一般在各种linux的发行版中,默认带有的ftp软件是vsftp. 使用如下命令#rpm -qa | grep vsftpd可以检测出是否安装了vsftpd软件,如果没有安装, ...
- ylb:SQL 索引(Index)
ylbtech-SQL Server: SQL Server-SQL 索引(Index) SQL 索引(Index). ylb:索引(Index) 返回顶部 --=================== ...
- 简单便捷的纯PHP网盘程序 Veno File Manager 2.6.3(VFM2)
体验过很多国外网盘程序,例如:Owncloud.Bedrive.YetiShare.XFilesharing.uCloud.Cloudshare 等等,诸如此类,VFM2与这些臃肿的商用或非商用来的程 ...
- 人工神经网络--ANN
神经网络是一门重要的机器学习技术.它是目前最为火热的研究方向--深度学习的基础.学习神经网络不仅可以让你掌握一门强大的机器学习方法,同时也可以更好地帮助你理解深度学习技术. 本文以一种简单的,循序的方 ...
- Linux下Utuntu使用
以前一直用Centos,在下面安装了Vmware Tools和Eclipse C++基本能使用,也遇到过一些问题.突然心血来潮,试试Utuntu,所以在实验室电脑虚拟机上装一下,安装过程很熟练了,参考 ...
- 【前端阅读】——《活用PHP、MySQL建构Web世界》摘记之高级应用
一.高级应用 1.计数器 计数器的原理很简单,只有两步: 第一步就是读写一个数字,第二步就是显示出来.一般CGI'大多直接写到文件系统,当然也可以利用MySQL来存储这个数字,完成第一步的操作. 第二 ...
- zabbix agent shell一键安装脚本
#!/bin/bash basepath=$(cd ``; pwd) SHELL_DIR="${basepath}/shell" PACKAGE_DIR="${basep ...