vue-video-player 在使用时视频加载不出来，报错The media could not be loaded, either because the server ...

最新推荐文章于 2024-05-14 10:20:50 发布
最新推荐文章于 2024-05-14 10:20:50 发布
阅读量9.2k 收藏 2
点赞数 1
分类专栏： vue 文章标签： 音视频
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44398350/article/details/127884283
版权

问题：在项目里安装引入vue-video-player之后，在开发阶段引入本地图片，显示X，同时报错

The media could not be loaded, either because the server or network failed or because the format is not supported

解决：引入本地视频资源时需要require引入，

配置引入使用的相关代码：
请添加图片描述请添加图片描述
在这里插入图片描述

张小薇爱学习
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue的video-player的视频无法加载出来，vue视频插件；显示叉号； The media could not be Loaded,
Zhu4010的博客
04-17 1万+
解决方法：require（）；
vue-video-player.zip
09-09
Vue-video-player是一个基于video.js的前端视频播放组件，专为Vue.js框架设计。这个组件将video.js的强大功能与Vue的灵活性相结合，使得在Vue项目中处理视频内容变得更加简单。Video.js是一个广泛使用的开源HTML5和...
vue-video-player视频播放器使用配置详解
01-18
本文实例为大家分享了vue-video-player视频播放器的使用配置，供大家参考，具体内容如下 1、安装 npm install vue-video-player -save 2、在main.js中添加 import VueVideoPlayer from 'vue-video-player' // 视频播放器 import 'video.js/dist/video-js.css' Vue.use(VueVideoPlayer) 3、新建一个vueVideoPlayer.vue组件供调用 <video-pl
nginx开发 | video.js报错：由于服务器或网络故障或不支持格式，无法加载媒体（已解决）
热门推荐
bobier_zhao的博客
11-09 13万+
The media could not be loaded, either because the server or network failed or because the format is not supported. 翻译： 由于服务器或网络故障或不支持格式，无法加载媒体 解决问题的方案及思路（文章最后有惊喜！！） 1.根据报错提示，非常直观的问题就是确认自己的视频格式，所以先看看自己发布的视频格式是否存在问题。 2.出现这个问题最多的是自己配置的文件路径出现问题，所以查看自己在前端页面配置的
Failed to resolve entry for package “vue3-video-play“.The package may have incorrect main/module
最新发布
kentturing的博客
05-14 678
本地环境将package.json中 "module": "./dist/index.es.js"改为"module": "./dist/index.mjs"import vue3videoPlay from "longze-vue3-video-player";
The media could not be loaded, either because the server or network failed or because the format is
SSS01233210的博客
12-24 12万+
The media could not be loaded, either because the server or network failed or because the format is not supported 问题 反复排查，视频资源没问题，调用方式也没问题。而且出问题的用户所占比例非常小，所在地区、宽带线路也无规律，而且均反映土豆、优酷等站的视频能正常播放。 远程方式查看用户浏览器控制台，网络选项中提示视频资源404，由于视频托管在阿里云oss服务器中，提交工单，阿里工程师也没说出所以
报错：The media could not be loaded, either because the server or network failed or ...
weixin_45898996的博客
12-08 5万+
vue播放视频报错The media could not be loaded, either because the server or network failed or
vue-core-video-player-Vue.js的轻量级视频播放器-Vue.js开发
05-27
开始使用Npm $ npm安装vue-core-video-player --save Yarn $ yarn添加vue-core-video vue-core-video-player适用于Vue.js的轻量级视频播放器。 开始使用Npm $ npm安装vue-core-video-player --save Yarn $ yarn添加...
vue视频播放插件vue-video-player的具体使用方法
12-13
安装 npm install vue-video-player --save 引入 可以全局引入插件，也可以在需要用到该插件的组件内单独引入（二选一） 【1】全局引用， 在main.js里面...【2】组件内引用import { videoPlayer } from ‘vue-video-pl
vue使用video插件vue-video-player的示例
10-14
Vue-video-player 是一个基于 Vue.js 的视频播放插件，它利用 video.js 库提供了丰富的自定义选项和主题，使得在 Vue 项目中实现视频播放变得简单。下面将详细介绍如何在 Vue 项目中使用 vue-video-player 插件。 ...
The media could not be loaded, either because the server or network failed...
lanren312的博客
01-05 8465
视频在云服务器的OOS上，前端vue查看视频使用了video-player组件，在自己的云服务器上视频播放正常，但是在客户的服务器上视频无法播放。排除地域问题，之前有在nginx中有配置 add_header X-Frame-Options SAMEORIGIN;重启nginx发现视频还是无法播放，临时解决办法，直接使用window.open(url, "_blank");有尝试修改 X-Frame-Options。
使用videojs，安卓可以正常播放视频，ios浏览器报错The media could not be loaded,either because the server or network ...
Y_seaboy的博客
12-30 2万+
写在开头 video标签在各个浏览器中表现各异，存在很多兼容性问题，所以我尝试使用了videojs这个框架 传送门：videojs起步 传送门：videojs文档 直入主题 问题：按照videojs文档添加视频后，发现安卓可以正常播放视频，但是ios浏览器报错：The media could not be loaded,either because the server or network failed or because the format is not supported（无法加载媒体，原因可能是
求助：网页播放视频是出现错误：A network error caused the media download to fail part-way.
朦胧星海
05-20 2万+
网页播放视频时，会出现如下两种错误：其一：A network errorcaused the media download to fail part-way.其二：The media could not be loaded, either because the server or network failed or because the format is not supported.用的是w...
coursera “the media could not be loaded either because the server or network falled...“解决办法
happiness_boy的博客
07-16 1万+
1.进入https://ping.eu/nslookup/将地址 d3c33hcgiwev3.cloudfront.net 输入得到IP地址 d3c33hcgiwev3.cloudfront.net has address 13.225.84.9 d3c33hcgiwev3.cloudfront.net has address 13.225.84.30 d3c33hcgiwev3.cloudfront.net has address 13.225.84.12 d3c33hcgiwev3.cloudfr.
vue3的vite 使用vue-video-player 报错player.vue:2 uncaught referenceerror: re
12-22
vite是一个现代化的构建工具，用于快速构建Vue项目。而vue3是Vue.js的最新版本，具有更快的渲染速度和更好的性能优化。它们的结合使用可以更好地提升前端开发效率和用户体验。 当我们在使用vite构建Vue3项目时，想要使用vue-video-player来实现视频播放功能时，有时候会遇到报错的情况。比如在player.vue文件的第二行出现了一个未捕获的引用错误：uncaught referenceerror: re。这个错误可能是由于vue-video-player版本不兼容或者依赖错误导致的。 解决这个报错的方法有多种。首先，我们可以尝试更新vue-video-player的版本，看看是否有新的稳定版本可以解决这个问题。其次，可以检查我们的项目依赖是否安装正确，有没有遗漏某些必要的依赖包。同时还可以尝试在Vite中手动导入vue-video-player的相关组件，以确保它能够正确地被加载并使用。 除此之外，还可以去查阅vue-video-player和vite的官方文档或者社区中的相关讨论，看看有没有其他开发者遇到类似的问题并找到了解决方案。在遇到报错的问题时，多参考官方文档和开发者社区的讨论是解决问题的有效途径。 总的来说，解决vite使用vue-video-player报错的问题需要我们仔细分析出错的原因，尝试不同的解决方案，并多参考官方文档和开发者社区的讨论。希望以上解决方法能够帮助到你。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值