uni-app video 文档提示能适应rtsp流播放实际使用无法播放

uni-app video 文档提示能适应rtsp流播放实际使用无法播放

开发环境 版本号 项目创建方式
Windows 11 CLI

产品分类：uniapp/App
PC开发环境操作系统：Windows
手机系统：Android
手机系统版本号：Android 16
手机厂商：华为
手机机型：18081598046
页面类型：vue
vue版本：vue2
打包方式：离线
CLI版本号：4.5.19

示例代码：

<template> <view name="videoPlayer" class="flex flex-direction" style="width: 100%;"> </view> </template> <script> export default { name: 'videoPlayer', props: { title: { type: String, default: '' }, firstPic: { type: String, default: '' }, videoType: { type: String, default: '' }, videoSrc: { type: String, default: '' } }, data() { return { videoUrl: this.videoSrc, firstImg: this.firstPic, videoTitle: this.title }; }, watch: { videoSrc() { this.setVideoUrl(); } }, mounted() { this.setVideoUrl(); }, onReady() { this.videoContext = uni.createVideoContext('myVideo'); }, methods: { setVideoUrl() { this.videoUrl = this.videoSrc; this.firstImg = this.firstPic; this.videoTitle = this.title; }, videoErrorCallback(e) { console.log("+++++++") console.log(e) // uni.showModal({ content: e.target.errMsg, showCancel: false }); }, videoWaiting() { // uni.showLoading({ title: '加载中' }); }, videoLoadOk() { // uni.hideLoading(); } } }; </script> <style> /* 样式代码 */ </style> ```

操作步骤：

<template> <view> <video-player title="视频标题" videoSrc="rtsp://192.168.222.171:8554/rtsp001"></video-player> </view> </template> <script> import VideoPlayer from '@/common/video-player'; export default { components: { VideoPlayer } }; </script> ```

预期结果：

可直接播放


### 实际结果：


无法播放无法加载

bug描述：

期望为可正常播放
实际效果为无法加载rtsp视频流


更多关于uni-app video 文档提示能适应rtsp流播放实际使用无法播放的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

顶顶顶顶

更多关于uni-app video 文档提示能适应rtsp流播放实际使用无法播放的实战教程也可以访问 https://www.itying.com/category-93-b0.html


顶顶顶

顶顶顶顶

在uni-app中，video组件确实支持RTSP流播放，但需要满足特定条件。根据你的开发环境和代码分析，问题可能出现在以下几个方面：

  1. 平台限制：RTSP流在Android平台需要硬件解码支持，部分设备可能不支持特定编码格式。华为设备通常兼容性较好，但建议测试其他Android设备确认。

  2. 网络权限：确保在manifest.json中已配置网络权限：

"app-plus": {
    "distribute": {
        "android": {
            "permissions": [
                "<uses-permission android:name=\"android.permission.INTERNET\"/>"
            ]
        }
    }
}

  1. 流地址验证：确认RTSP地址可访问，建议使用VLC播放器测试同一流地址。注意RTSP默认使用554端口，非标准端口需确保防火墙放行。

  2. 解码兼容性：尝试在video组件添加decoder-type属性：

<video decoder-type="hardware" ... ></video>
回到顶部