EasyNVR前端为了更好的用户体验,不仅仅设有PC客户端,还适应移动客户端;

EasyNVR的客户端中PC端和移动端差异有很多。例如:

由于PC端、移动端自身硬件的差异,所需要展示的样式也会存在一定的差别;在摄像机接入类型是ONVIF时,EasyNVR视频实时播放界面中PC端会提供云台控制界面;而为了用户有一个更好的观感和体验,在移动端会隐藏该界面。

在初始加载时是如何判断出前端设备的类型的?

在全局中定义一个js方法;在需要区分客户端类型的地方自动执行该方法;

function isPC() {
var ua = navigator.userAgent.toLowerCase();
var agents = ["android", "iphone",
"symbianos", "windows phone",
"ipad", "ipod"
];
var flag = true;
for (var v in agents) {
if (ua.indexOf(agents[v]) > 0) {
flag = false;
break;
}
}
return flag;
}

EasyNVR播放页面在加载时判断为PC端时将云台控制界面展示出来;

   if(isPC()){
$("#ipcam_div").show();
}

如果需要细分到移动端的具体类型可以根据isPC中agents数组中具体元素来进行区分;区分pc端的浏览器类型可以根据navigator.userAgent来进行判断区分

关于EasyNVR

EasyNVR能够通过简单的网络摄像机通道配置,将传统监控行业里面的高清网络摄像机IP Camera、NVR等具有RTSP协议输出的设备接入到EasyNVR,EasyNVR能够将这些视频源的音视频数据进行拉取,转换为RTMP/HLS,进行全平台终端H5直播(Web、Android、iOS),并且EasyNVR能够将视频源的直播数据对接到第三方CDN网络,实现互联网级别的直播分发;

详细说明:http://www.easydarwin.org/easynvr/

获取更多信息

邮件:support@easydarwin.org

WEB:www.EasyDarwin.org

Copyright © EasyDarwin.org 2012-2017

EasyNVR无插件IPC摄像机直播方案前端构建之:如何区分PC端和移动端的更多相关文章

  1. EasyNVR无插件IPC摄像机直播方案前端构建之:区分页面是自跳转还是分享依据

    区分分享还是跳转 对于前端一些页面的展示,通常有两种方式:通过入口链接一步步进入,或是通过分享链接直接进入:对于这两种方式的区别是什么?在进行前端书写时又应该如何处理? 以EasyNVR为例来进行说明 ...

  2. EasyNVS摄像机公网全终端无插件网页摄像机直播管理服务运行出现“请求服务不存在或已停止”

    背景分析 了解我们产品线的小伙伴都知道,EasyNVR产品主要用于互联网安防直播,通过EasyNVR拉取摄像机的RTSP视频流,客户端通过访问EasyNVR服务端就可以实现音视频流分发.在此情况下会出 ...

  3. EasyNVR网页H5无插件播放摄像机视频功能二次开发之直播通道接口保活示例代码

    背景需求 随着雪亮工程.明厨亮灶.手机看店.智慧幼儿园监控等行业开始将传统的安防摄像头进行互联网.微信直播,我们知道摄像头直播的春天了.将安防摄像头或NVR上的视频流转成互联网直播常用的RTMP.HT ...

  4. EasyNVR无插件H5/HLS/m3u8直播解决方案中Windows系统服务启动错误问题的修复:EasyNVR_Service 服务因 函数不正确。 服务特定错误而停止。

    最近在做某地市移动公司景观直播的项目时,遇到一个问题,当我们部署EasyNVR为系统服务后,居然出现了无法启动服务的现象,表面上看,提示是系统服务启动失败,实际通过查看windows 系统日志: 查找 ...

  5. EasyNVR无插件直播流媒体服务器云端集中管控的EasyNVS云管理平台安装使用文档

    EasyNVS - EasyNVR云端集中管理服务 EasyNVS云管理平台是一套专门用于集中化管理EasyNVR 的解决方案. EasyNVR 采用主动注册的方式接入到 EasyNVS, 再由 Ea ...

  6. EasyNVR无插件直播服务器软件接口调用返回“Unauthorized”最简单的处理方式

    背景需求 对于EasyNVR的受众群体十分的广泛,不仅仅有将EasyNVR作为视频直播平台直接使用的,更多的是使用EasyNVR的对应功能集成到自身系统.对于前者,只需要将软件的使用功能搞清楚即可,对 ...

  7. 使用EasyNVR无插件流媒体服务器接口和EasyPlayer.js播放器插件实现web网页H5播放无插件

    1.背景需求 很多客户在使用EasyNVR无插件流媒体服务器时,不喜欢产品化的界面,有时可能满足不了日常观看使用的需求.因此软件提供丰富的HTTP接口,供第三方平台调用集成.但是有时客户这边可能没有专 ...

  8. EasyNVR摄像机网页无插件直播方案H5前端构建之:区分页面是自跳转页面还是分享页面

    背景分析 EasyNVR整套方案的架构中,涉及到前端设备(摄像机IPC.硬盘录像机NVR.编码器等).流媒体服务端(EasyNVR).客户端终端设备(PC.浏览器.Android.iOS.微信). 在 ...

  9. EasyNVR无插件播放HLS/RTMP网页直播方案前端完善:监听表单变动

    在上一篇博客中我们表述完了防止提交成功后多余操作提交的一个过程:其中的精髓在于ajax的触发事件的使用. 而这篇博客主要想说明一下如何实时的判断出表单是否发生变化. 问题表述: 在网页前端的开发过程中 ...

随机推荐

  1. Codeforces Gym100971 L.Chess Match (IX Samara Regional Intercollegiate Programming Contest Russia, Samara, March 13)

    这个题就是两个队,看最多能赢的个数,然后比较一下,看两个队是都能赢彼此,还是只有一个队赢的可能性最大.表达能力不好,意思差不多... 和田忌赛马有点像,emnnn,嗯. 代码: 1 #include& ...

  2. Codeforces 898 A. Rounding

      A. Rounding   time limit per test 1 second memory limit per test 256 megabytes input standard inpu ...

  3. Network | 协议栈

    因特网协议栈Internet protocol stack: 应用层Application layer.运输层Transport layer.网络层Network layer.链路层Data link ...

  4. z-index 基础详解

    关于z-index网上其实有不少博文,写得也不错,不过有些帖子比较旧,而IE也已经更新到了IE11了,所以还是重新总结一下.由于 z-index 的属性表现和层级有关,有些特点在某些层级下才表现出来, ...

  5. Codeforces 583 DIV2 Asphalting Roads 模拟

    原题链接:http://codeforces.com/problemset/problem/583/A 题意: 很迷很迷,表示没看懂..但是你看样例就秒懂了 题解: 照着样例模拟就好 代码: #inc ...

  6. 某考试 T2 Seg

    Seg [问题描述]数轴上有n条线段,第i条线段的左端点是a[i],右端点是b[i].Bob发现1~2n共2n个整数点,每个点都是某条线段的端点.这些线段有如下两类特点:1 x y,表示第x条线段和第 ...

  7. Java 实现多线程切换等待唤醒交替打印奇偶数

    引言 在日常工作生活中,可能会有用时几个人或是很多人干同一件事,在java编程中,同样也会出现类似的情况,多个线程干同样一个活儿,比如火车站买票系统不能多个人买一到的是同一张票,当某个窗口(线程)在卖 ...

  8. 说说GestureDetector.OnGestureListener onScroll函数

    public abstract boolean onScroll (MotionEvent e1, MotionEvent e2, float distanceX, float distanceY) ...

  9. freemarker中include与import的区别

    在inc1.ftl与inc2.ftl中的内容分别是: <#assign username="刘德华">与<#assign username="张学友&q ...

  10. tts和字符集的关系--要求源和目的端的数据库字符集必须一样,国家字符集必须一样。

    tts和字符集的关系--要求源和目的端的数据库字符集必须一样,国家字符集必须一样. imp sys/as TRANSPORT_TABLESPACE=Y datafiles= C:\oracle\pro ...