• EasyNVR无插件IPC摄像机直播方案前端构建之:如何区分PC端和移动端


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

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

    EasyNVR onvif 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

    EasyDarwin

  • 相关阅读:
    安卓下拉,刷新
    Android继承AppCompatActivity实现全屏设置
    端口被占用:android studio 虚拟机adb.exe已停止工作的处理
    学习笔记
    github上的文件比对
    框架:提供一定能力的小段程序
    游戏中实现粒子碰撞,纯java
    一个仿3D的平面游戏页面
    多媒体流处理,安卓进阶之路
    空间主页播放任意FLV格式视频方法
  • 原文地址:https://www.cnblogs.com/babosa/p/7468272.html
Copyright © 2020-2023  润新知