FreeSWITCH 1.10.10 简单图形化界面26-在网页上播放SIP设备视频

news2024/11/24 16:52:28


FreeSWITCH 1.10.10 简单图形化界面26-在网页上播放SIP设备视频

  • 1、前言
  • 2、大概流程
  • 3、测试环境
  • 4、安装流媒体服务器
  • 5、设置流媒体服务器接口
  • 6、简单写个web接口
  • 7、测试一下
    • 1、web播放
      • 在线播放器1
      • 在线播放器2
      • 本地video控件
    • 2、vlc播放
      • vlc播放rtmp
      • vlc播放rtsp
  • 8、总结

1、前言

在web上播放SIP设备的视频,通常使用jssip或者sipjs,使用webrtc技术及wss协议呼叫SIP设备,然后再使用video控件播放视频流。通过库,可实现双向的音视频通信。

如果有不需要双向通信的情况下(监听SIP设备、站岗等场景),只是想查看下SIP设备的视频流,最近在学习sip过程中,貌似也可以通过流媒体服务器实现在web上播放SIP设备的视频流。但是只是单向的,无法像使用js库那样进行对讲通话。
使用流媒体服务器,可以使用http、rtsp、rtmp播放视频流,前端没有使用js库那么复杂(js库必须使用wss协议,服务器需要部署wss证书等环境)

2、大概流程

部署流媒体服务器–>拉取流媒体–>流不存在–>调用web接口–>web接口把FreeSWITCH的终端视频流推送到流媒体服务器–>播放。
参考https://docs.zlmediakit.com/zh/guide/media_server/on-demand_streaming.html
如图:
在这里插入图片描述

开始瞎折腾

3、测试环境

参考安装步骤:https://blog.csdn.net/jia198810/article/details/137820796,安装一个FreeSWITCH作为测试环境。

参考使用手册:https://docs.qq.com/pdf/DVEZjSGhXVHhaUEFW?,设置一下,并添加账号,注册一个SIP终端。

4、安装流媒体服务器

安装流媒体服务器,本次使用的流媒体服务器是 ZLMediaKit,安装可参考https://docs.zlmediakit.com/zh/tutorial/

安装完毕后,运行,如下图:

在这里插入图片描述

端口554为rtsp端口
端口1935为rtmp端口
端口8080为http端口
端口8443为https端口

5、设置流媒体服务器接口

找到流媒体服务器的配置文件,修改web接口,ZLMediaKit的配置文件为config.ini,如下图:

在这里插入图片描述
找到hook,找到on_stream_not_found,设置为web接口的地址,如下图:
在这里插入图片描述

6、简单写个web接口

简单编写一个web接口,用于处理流媒体服务器的回调时,把SIP终端的视频流推送到流媒体服务器,如下:

from flask import Flask, request, jsonify
from subprocess import getoutput

app = Flask(__name__)

@app.route('/on_stream_not_found', methods=['POST'])
def call():
    print(request.form)
    data = request.get_json() or request.form.to_dict()
    print(data)
    app_ = data.get('app', '')
    hook_index = data.get('hook_index', '')
    id_ = data.get('id', '')
    ip_ = data.get('ip', '')
    mediaServerId = data.get('mediaServerId', '')
    params = data.get('params', '')
    port = data.get('port', '')
    schema = data.get('schema', '')
    stream = data.get('stream', '')
    vhost = data.get('vhost', '')
    # 呼叫FreeSWITCH终端,并将流发布到流媒体服务器
    cmd = f"fs_cli -pfs8021 -x'bgapi originate {{absolute_codec_string='^^:PCMA:PMCU:H264'}}user/{stream} &record(rtmp://127.0.0.1/{app_}/{stream})'"
    print(cmd)
    output = getoutput(cmd)
    print(output)


    # 构建响应数据
    response_data = {
        "code": 200,
        "msg": "Success",
        "data": {
            "max_time_length": 20,
            "upload_record": 1,
            "app": app_,
            "hook_index": hook_index,
            "id": id_,
            "ip": ip_,
            "mediaServerId": mediaServerId,
            "params": params,
            "port": port,
            "schema": schema,
            "stream": stream,
            "vhost": vhost
        }
    }

    # 返回 JSON 格式的响应
    return jsonify(response_data)

@app.route('/on_stream_not_found', methods=['POST'])
def hangup():
    pass

if __name__ == '__main__':
    app.run(debug=True,host='0.0.0.0')

# 把终端的视频流推送到流媒体服务器
cmd = f"fs_cli -pfs8021 -x'bgapi originate {{absolute_codec_string='^^:PCMA:PMCU:H264'}}user/{stream} &record(rtmp://127.0.0.1/{app_}/{stream})'"

7、测试一下

通过ZLMediaKit,可以直接通过http、rtsp、rtmp播放媒体流。播放url规则,可参考https://docs.zlmediakit.com/zh/guide/media_server/play_url_rules.html#_3%E3%80%81%E6%B5%81%E5%AA%92%E4%BD%93%E6%BA%90%E5%AF%B9%E5%BA%94%E7%9A%84%E6%92%AD%E6%94%BE-url
如下:

# HLS(mpegts)
http://somedomain.com/live/0/hls.m3u8
https://somedomain.com/live/0/hls.m3u8
http://127.0.0.1/live/0/hls.m3u8?vhost=somedomain.com
https://127.0.0.1/live/0/hls.m3u8?vhost=somedomain.com

# HLS(fmp4)
http://somedomain.com/live/0/hls.fmp4.m3u8
https://somedomain.com/live/0/hls.fmp4.m3u8
http://127.0.0.1/live/0/hls.fmp4.m3u8?vhost=somedomain.com
https://127.0.0.1/live/0/hls.fmp4.m3u8?vhost=somedomain.com

# HTTP-TS/WS-TS(后缀为.live.ts,目的是为了解决与 hls 的冲突)
http://somedomain.com/live/0.live.ts
https://somedomain.com/live/0.live.ts
http://127.0.0.1/live/0.live.ts?vhost=somedomain.com
https://127.0.0.1/live/0.live.ts?vhost=somedomain.com
ws://somedomain.com/live/0.live.ts
wss://somedomain.com/live/0.live.ts
ws://127.0.0.1/live/0.live.ts?vhost=somedomain.com
wss://127.0.0.1/live/0.live.ts?vhost=somedomain.com

# HTTP-fMP4/WS-fMP4(后缀为.live.mp4,目的是为了解决与 mp4 点播的冲突)
http://somedomain.com/live/0.live.mp4
https://somedomain.com/live/0.live.mp4
http://127.0.0.1/live/0.live.mp4?vhost=somedomain.com
https://127.0.0.1/live/0.live.mp4?vhost=somedomain.com
ws://somedomain.com/live/0.live.mp4
wss://somedomain.com/live/0.live.mp4
ws://127.0.0.1/live/0.live.mp4?vhost=somedomain.com
wss://127.0.0.1/live/0.live.mp4?vhost=somedomain.com

1、web播放

上面编写的web接口,当访问http://ip/live/[分机号].live.mp4时(其他url地址,如上),会呼叫指定的分机号,如下图:呼叫的是1100分机号。

在线播放器地址1:http://cloud.liveqing.com:18000/#/liveplayer
在线播放器地址2:http://player.ruiboyun.cn/

找个在线播放器(本地播放测试,请使用相关播放器本地部署),或者输入流媒体服务器的url地址,点击播放按钮后,流媒体服务器开始拉取媒体流,拉取失败后会调用web接口,web接口在呼叫FreeSWITCH进行推流,推流成功后,网页开始播放。如下图:

PS: 8000是媒体服务器的公网http端口,因为是公网,所以进行了端口映射,公网为8000,内网为媒体服务器的http端口8080。

在线播放器1

在这里插入图片描述

在线播放器2

在这里插入图片描述

本地video控件

编写一个简单本地video控件测试,代码如下:

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>播放SIP终端视频</title>
</head>
<body>
    <h1>视频直播</h1>
    <video width="640" height="480" controls autoplay>
        <source src="http://210.51.10.231:8000/live/1100.live.mp4" type="video/mp4">
        您的浏览器不支持 video 标签。
    </video>
</body>
</html>

效果如下图:
在这里插入图片描述
linphone测试。
在这里插入图片描述

2、vlc播放

也可以通过rtsp、rtmp进行播放,播放url,如下:

http://210.51.10.231:8000/live/1100.live.flv
rtmp://210.51.10.231/live/1100
rtsp://210.51.10.231/live/1100
http://210.51.10.231:8000/live/1100/hls.m3u8
http://210.51.10.231:8000/live/1100.live.mp4

vlc播放rtmp

如下图:

在这里插入图片描述

vlc播放rtsp

如下图:在这里插入图片描述

8、总结

以上使用了ZLMediaKit流媒体服务器的按需拉取功能,此流媒体服务器功能强大,可以直接播放GB28181,可参考相关文档。

各类播放器支持url格式可能有不同,效果也有差异,延时等,可进行相关测试。祝君好运

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1943660.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

简过网:公务员公示后是不是就没有问题了?

A&#xff1a;请问&#xff0c;公务员录用考试公示期过后是不是说明就正式录用了&#xff1f; Q&#xff1a;公务员已经公示录用&#xff0c;就说明前期政审已经过关&#xff0c;档案在前期的审查工作中没有发现问题&#xff0c;在入职前&#xff0c;档案会调入组织部&#xf…

10.发布确认

解决消息不丢失的一个重要环节。 前面说过消息持久化&#xff0c;可能出现一种情况就是&#xff1a; 尽管它告诉rabbitmq将消息保存到磁盘&#xff0c;但是依然存在当消息刚准备存储到磁盘的时候&#xff0c;但是还没有存储完&#xff0c;消息还在缓存的一个间隔点。此时消息…

充电桩--交流充电桩硬件原理以及竞品方案

聚焦光伏领域、深耕储能市场、探究充电技术 微信公众号 小Q下午茶 聚焦光伏领域&#xff0c;深耕储能市场&#xff0c;探究充电技术 47篇原创内容 公众号 一、交流充电桩系统介绍 为了实现能源安全和“双碳”目标的达成&#xff0c;充电桩是需要智能电网支持&#xff0c;…

Linux 各目录

Linux 是一个非常严谨的操作系统&#xff0c;每个目录都有自己的作用&#xff0c;这些作用是固定的&#xff0c;没有特殊情况&#xff0c;应严格执行&#xff1b; Linux 中所有东西以文件形式存储和管理&#xff0c;命令也不例外&#xff1b; 以下四个 bin 是二进制文件&…

linux C++ onnxruntime yolov8 视频检测Demo

linux C onnxruntime yolov8 视频检测Demo 目录 项目目录 效果 ​编辑CMakeLists.txt 代码 下载 项目目录 效果 ./yolov8_demo --help ./yolov8_demo -c2 -ptrue ./yolov8_demo -c1 -strue CMakeLists.txt # cmake needs this line cmake_minimum_required(VERSION 3…

力扣最热一百题——3.最长连续序列

目录 题目链接&#xff1a;128. 最长连续序列 - 力扣&#xff08;LeetCode&#xff09; 题目描述 示例 提示 解法一&#xff1a;排序双指针剪枝 思路 1. 获取数组长度并进行特判 2. 对数组进行排序 3. 初始化变量 4. 遍历数组并寻找最长连续子序列 5. 返回结果 总结…

Linux笔记-对.a静态库的进一步理解(2024-04-09)

过程 问&#xff1a; Linux中生成.a库时候&#xff0c;如果代码里面调用了一些只引用未定义的函数&#xff0c;gcc不报错&#xff0c;但能生成对应的.a文件&#xff0c;这是为什么&#xff1f;再写一个执行程序去调用.a库时&#xff0c;链接时就会报这个.a库未定义的引用&…

列举excel中调整行高列宽的五种方法

列举excel中调整行高列宽的五种方法 在Excel中调整行高列宽的方法有以下五种&#xff1a; 使用鼠标手动调整行高列宽&#xff1a;将鼠标悬停在行或列的边界上&#xff0c;光标会变成双向箭头&#xff0c;此时按住鼠标左键并拖动边界即可调整行高或列宽。 使用快捷键调整行高列…

node和npm安装;electron、 electron-builder安装

1、node和npm安装 参考&#xff1a; https://blog.csdn.net/sw150811426/article/details/137147783 下载&#xff1a; https://nodejs.org/dist/v20.15.1/ 安装&#xff1a; 点击下载msi直接运行安装 安装完直接cmd打开可以&#xff0c;默认安装就已经添加了环境变量&…

vue3通过html2canvas dom转图片复制到剪贴板和dom转图片并下载

代码实现 <template><div class"page"><div id"to-img-dom"><strong>我是图片标题</strong><p>我是内容&#xff0c;我是内容&#xff0c;我是内容&#xff0c;我是内容&#xff0c;我是内容&#xff0c;我是内容&am…

Jupyter notebook 快速入门

1、什么是jupyter notebook Jupyter Notebook是一个交互式笔记本环境&#xff0c;可以在其中同时编写和运行代码&#xff0c;以及进行数据分析和可视化。它支持多种编程语言&#xff08;如Python、R、Julia等&#xff09;&#xff0c;并提供了丰富的功能和工具供用户使用。Jup…

如何减少网站延迟?

什么是网络延迟&#xff1f; Web 延迟描述了网站响应用户请求所花费的时间。它是网络性能的一个重要因素&#xff0c;因为它决定了用户访问网站内容并与之交互的速度。当延迟很高时&#xff0c;网站会变得缓慢且反应迟钝&#xff0c;从而导致用户不满意。延迟可能由多种因素引…

如何用 WinDbg 调试Linux上的 .NET程序

一&#xff1a;背景 1. 讲故事 最新版本 1.2402.24001.0 的WinDbg真的让人很兴奋&#xff0c;可以将自己伪装成 GDB 来和远程的 GDBServer 打通来实现对 Linux 上 .NET程序进行调试&#xff0c;这样就可以继续使用熟悉的WinDbg 命令&#xff0c;在这个版本中我觉得 WinDbg 不…

数据结构C++——二叉树和树

文章目录 一、树二、二叉树三、二叉树的特性特性1. 包含n (n> 0 )个元素的二叉树边数为n-1特性 2: 若二叉树的高度为h,h≥0,则该二叉树最少有h个元素,最多有2^h-1 个元素特性3:包含n(n≥0)个元素的二叉树的高度最大为n,最小为ceiling(log2(n+1))特性4. 完全二叉树四、二…

基于微信小程序+SpringBoot+Vue的高校校园交友(带1w+文档)

基于微信小程序SpringBootVue的高校校园交友(带1w文档) 基于微信小程序SpringBootVue的高校校园交友(带1w文档) 在目前的情况下&#xff0c;可以引进一款高校校园交友微信小程序这样的现代化管理工具&#xff0c;这个工具就是解决上述问题的最好的解决方案。它不仅可以实时完成…

代码随想录 day 21 二叉树

第六章 二叉树part08 669. 修剪二叉搜索树 这道题目比较难&#xff0c;比 添加增加和删除节点难的多&#xff0c;建议先看视频理解。 题目链接/文章讲解&#xff1a; https://programmercarl.com/0669.%E4%BF%AE%E5%89%AA%E4%BA%8C%E5%8F%89%E6%90%9C%E7%B4%A2%E6%A0%91.html…

行业、客户双认可!路凯智行精彩亮相新疆煤博会

7月18日&#xff0c;2024丝路矿业合作论坛、第14届中国新疆国际矿业与装备博览会、第19届中国新疆国际煤炭工业博览会在新疆国际会展中心举行&#xff0c;此次论坛和展会吸引了全国26个省区市和德国、美国、日本、挪威、芬兰、法国、巴基斯坦、俄罗斯、白俄罗斯、乌兹别克斯坦等…

企业如何应对大模型落地的四大挑战?

近年来&#xff0c;人工智能&#xff08;AI&#xff09;和机器学习&#xff08;ML&#xff09;技术取得了突飞猛进的发展&#xff0c;其中大模型&#xff08;如GPT-3、GPT-4、BERT等&#xff09;因其强大的数据处理和分析能力&#xff0c;受到了企业的高度重视。大模型在自然语…

使用nginx实现一个端口和ip访问多个vue前端

前言&#xff1a;由于安全组要求&#xff0c;前端页面只开放一个端口&#xff0c;但是项目有多个前端&#xff0c;此前一直使用的是一个前端使用单独一个端口进行访问&#xff0c;现在需要调整。 需要实现&#xff1a;这里以80端口为例&#xff0c;两个前端分别是&#xff1a;p…

[用AI日进斗金系列]用码上飞在企微接单开发一个项目管理系统!

今天是【日进斗金】系列的第二期文章。 先给不了解这个系列的朋友们介绍一下&#xff0c;在这个系列的文章中&#xff0c;我们将会在企微的工作台的“需求发布页面”中寻找有软件开发需求的用户 并通过自研的L4级自动化智能软件开发平台「码上飞CodeFlying」让AI生成应用以解…