uniapp微信小程序使用视频组件video时提示[渲染层网络层错误] Failed to load media错误

这篇具有很好参考价值的文章主要介绍了uniapp微信小程序使用视频组件video时提示[渲染层网络层错误] Failed to load media错误。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

在进行微信小程序开发的时候,使用到的video组件,在成功把视频渲染出来之后,控制台会报这样的错

[渲染层网络层错误] Failed to load media

https://temp.mp4#devtools_no_referrer
net::ERR_FAILED 
From server 222.76.205.74(env: Windows,mp,1.06.2301160; lib: 3.2.4)

 通过百度之后尝试过两种方式

一:添加autoplay属性

但是autoplay属性会导致视频自动播放,所以需要给标签加上id属性,然后在mounted方法中调用uni.createVideoContext去停止视频

<video id="myVideo" style="width: 100%; height: 100%;" type="video/mp4" :src="item.urls"  controls></video>

 mounted() {

          this.videoContext = uni.createVideoContext(`myVideo`)

          this.videoContext.stop()

},

这样写之后,一开始可以,后面打开时不时还是会报错

二:将autoplay属性置为false

<video id="myVideo" style="width: 100%; height: 100%;" type="video/mp4" :src="item.urls" :autoplay="false" controls></video>

只需要将:autoplay="false",之后重新打开几次都没有报错了

uni文档:

video | uni-app官网

uni.createVideoContext(videoId, this) | uni-app官网

参考文章:

解决微信小程序渲染层网络层错误 Failed to load media-CSDN博客 

微信小程序使用视频组件video时提示[渲染层网络层错误] Failed to load media错误的解决方法 - 开发笔记 - 梧州金马科技有限公司文章来源地址https://www.toymoban.com/news/detail-774387.html

到了这里,关于uniapp微信小程序使用视频组件video时提示[渲染层网络层错误] Failed to load media错误的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • uniapp,微信小程序确认收货组件的使用

     这里很容易误会成,执行success函数,就收货成功了。其实要根据返回的参数来判断是否真的收货成功。 微信文档上也有说明:  

    2024年02月08日
    浏览(53)
  • uniapp微信小程序video不显示,无法播放

    微信小程序开发者工具video不显示,无法播放 微信开发者工具调试基础库版本太高 将微信开发者工具调试基础库改为低版本

    2024年04月10日
    浏览(71)
  • uniapp使用微信小程序提供的原生插件(组件)

    小程序交易保障标展示组件 为例 参考uniapp加载插件、微信小程序加载插件 1. manifest.json: 先打开manifest.json文件,然后我们找到\\\"mp-weixin\\\",引入需要使用的插件 2. pages.json 打开pages.json文件,然后再对应的页面配置处添加东西 3.页面使用

    2024年02月11日
    浏览(61)
  • uniapp 微信小程序 使用video 播放mp3、wav、flac等音频文件 报错 MEDIA_ERR_DECODE(-11103,11010001)

     官方解释是解码发生了错误,当是我对音频文件进行转码后并未解决这个问题,但是我想到解决方案是使用audio 标签,但是样式又非常丑自能选择自己写,然后又出现个问题audio标签获取不了播放音频总时长,差点没缓过气来。。。最后苦思冥想到了解决方案,使用video标签

    2024年02月03日
    浏览(96)
  • 【uniapp】使用canvas组件编译到微信小程序兼容出错问题

    使用uniapp编译跨平台项目会遇到不少兼容问题,这里主要讲canvas组件的,编译到微信小程序会有兼容出错问题,这里给讲一下解决方案,希望有帮助。 如果使用 CanvasContext 绘制,以下代码,编译到微信小程序上可能发现绘制不出来 看canvas组件的属性 type=\\\"2d\\\" 是否有加,要去掉

    2024年02月02日
    浏览(140)
  • uniapp小程序中使用video视频播放卡顿

    问题:在使用uniapp小程序的video视频播放,视频已经在播放了,但是进度条没走,还是卡顿的状态(测试ios能正常使用,安卓手机会出现此问题) 在网上找了很多方法,最多的说是用:custom-cache=\\\"false\\\",试了并没有效果,看来和我问题不一样,后来用了个简单粗暴的方法,发现是有效果的,以下是

    2024年04月11日
    浏览(41)
  • uniapp 微信小程序使用uview u-tabbar组件自定义tabbar

    1.在components文件下面新建TabBar.vue组件, 使用uview的u-tabbar组件进行二次封装; u-tabbar组件中value取当前匹配项的name, 一般从父组件传过来即可; 在u-tabbar-item标签内可以使用插槽 slot=\\\'inactive-icon\\\'(选中的图标)和slot=\\\'inactive-icon\\\'(未选中的图标)自定义图片样式 u-tabbar组件默认已经为i

    2024年02月13日
    浏览(69)
  • uniapp中使用uview组件u-icon 编辑到微信小程序样式问题

    在微信小程序中用u-icon标签选择器才能对其设置样式,但在h5预览中u-icon{ }这样设置样式不生效,用组件的customStyle属性才生效。所以干脆对不同平台用不同写法: 同时在style标签里使用u-icon选择器写样式来作用于微信小程序中: 这样互不影响

    2024年02月16日
    浏览(58)
  • 微信小程序video标签如何在其他视频播放时让另一个视频暂停播放-demo

    一个页面同时有很多视频播放,当用户点击一个视频后,开始播放视频,当点击另一个视频后,暂停前一个播放视频,让当前页面只有一个视频处于播放状态 原理 播放视频时,先判断当前是否有视频正在播放,如果没有,则播放,如果有,则暂停其他视频,再播放当前视频

    2024年02月04日
    浏览(84)
  • 关于uniapp微信小程序scroll-view组件使用show-scrollbar隐藏不了滚动条

    这里关于使用  scroll-view组件  时候有滚动条 想要隐藏滚动条但是使用show-scrollbar没有效果 这时候又使用类名隐藏滚动条 使用id隐藏滚动条都不行 解决方法:在使用  scroll-view组件 的页面或者app 页面加上以下代码就可以了         

    2024年02月12日
    浏览(47)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包