微信小程序也许会用到上传视频，针对视频转码转为m3U8格式即web端可以使用的解决办法

最新推荐文章于 2025-05-22 15:21:46 发布
原创 最新推荐文章于 2025-05-22 15:21:46 发布 · 3.7k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍如何使用阿里云服务进行视频转码，涉及OSS、MNS和MTS服务。通过学习官方转码教程，设置工作流和管道，确保权限配置正确，最终将视频转换为适合web端播放的m3U8格式。

媒体处理这部分的视频转码涉及到 阿里云服务的对象存储OSS服务，消息服务MNS，及媒体处理MTS服务

可以利用阿里云服务的MTS服务即媒体处理  https://mts.console.aliyun.com/?spm=5176.8466032.aliyun_sidebar.aliyun_sidebar_mts.25181450XajZUr#/home/index

我们需要 通过学习  https://help.aliyun.com/document_detail/29208.html?spm=5176.2020520107.104.1.449f4ecbltS5na  转码教程，分别去完成工作流和管道的设置

登录我们的阿里云账户  进入之后如果要分配权限 则

 

 

根据转码文档  把该配的配好，然后进入如下


                

        

    


  


        

            

                      
                        最低0.47元/天 解锁文章
                          
                      
            

        


    



                



	

		

			

				
					
微信小程序BackgroundAudioManager播放m3u8格式音频

				
			

			

				

					小周sri的码农
				

				

					07-08
					
					4154
					
				

			

		

		

			
				
小程序中实现背景音乐播放。在这个项目中，也踩了很多坑，记录一下。由于后台给我返回的音频流是m3u8格式的，没有得办法，安全性高，由于实现背景音乐播放，但是设置了backgroundAudioManager.protocol = 'hls';这个，导致，backgroundAudioManager.onEnded这个api，在ios无法检测到，从18年到现在微信至今没有解决，所留下的坑。


实现功能

 切换上下首
  播放暂停
 列表播放
 随机播放
 单曲播放
 定时播放
  拖拽播放
 定位播放当前.

			
		

	



                

            
              



	

		

			

				
					
微信小程序video组件播放m3u8视频文件

				
			

			

				

					竹毛言己
				

				

					05-09
					
					6773
					
				

			

		

		

			
				
里面有两个比较重要的，METHODS是加密方式：AES-128，URI 的值应该传入一个获取数据加密的key的链接，例如URI的值设置为：“https://example.com/video.key?EXT-X-MEDIA-SEQUENCE ：第一个TS分片的序列号，一般情况下是0，但是在直播场景下，这个序列号标识直播段的起始位置；#EXT-X-ALLOW-CACHE：是否允许cache，#EXT-X-ALLOW-CACHE:YES 、#EXT-X-ALLOW-CACHE:NO，默认情况下是YES。

			
		

	



              


  
  
              

                


	

		

			

				
					
微信小程序使用video组件播放M3U8视频卡顿

				
			

			

				

					01-20
				

			

		

		

			
				
微信小程序中使用video组件播放m3u8直播视频，在ios的真机预览里点击video中间的播放容易卡几十秒，此时什么都做不了，手机也非常非常卡。
我的解决办法是在视频video组件里加入custom-cache={{false}} autoplay=true，禁缓存，开启自动播放，也符合使用场景，因为这种类似的m3u8多是像萤石云这种直播使用，视频本身就是没声音的，自动播放并不会影响用户使用，可以在页面中方格view给video，点击全屏时候视频全屏即可。
                    
                                        华生c

			
		

	





	

		

			

				
					
微信小程序中播放海康萤石云HLS '.m3u8'视频  video标签

				
			

			

				

					Li_Ning21的博客
				

				

					02-16
					
					1万+
					
				

			

		

		

			
				
微信小程序中播放海康萤石云HLS '.m3u8'视频  video标签前言萤石云开放平台微信开发者工具
前言
因为项目需要在微信小程序上展示实时视频流信息，以下内容是我将萤石云平台官方文档和自己实践过程中遇到的问题的总结。官方文档地址：https://open.ys7.com/doc/zh/book/index/live_proto.html 传送门
萤石云开放平台
步骤：

按照萤石摄像机官方携...

			
		

	



		

			
		



	

		

			

				
					
微信小程序播放m3u8视频总结

				
			

			

				

					gng787739158的博客
				

				

					08-09
					
					1万+
					
				

			

		

		

			
				
小程序

小程序视频播放跳坑日记



微信播放小程序，腾讯云免费空间2M，光代码本身就差不多，不可能免费直接把视频存入腾讯云，因此需要用到服务器存储数据，需要域名。小程序有域名校验，hhtps验证，费劲，所以在小程序后台取消域名验证，直接使用ip访问服务器。如图所示



 跳坑开始：

1、微信小程序video组件支持mp4视频

，好处是兼容性强，坏处是mp4视频从网络请求开始...

			
		

	





	

		

			

				
					
uniapp 打包微信小程序播放hls(m3u8)视频流

				
			

			

				

					u010867236的专栏
				

				

					03-13
					
					4321
					
				

			

		

		

			
				
博主近期做了可一个小程序对接监控视频的活，记录一下步骤。使用uniapp解析hls还是很方便的，使用内置的video标签就行，如果是动态的路径动态修改路径地址就行。同时这个标签也支持显示弹幕，有需要的童鞋了可以看一下uniapp官方文档和对应的小程序文档。

			
		

	





	

		

			

				
					
uniapp实现H5、APP、微信小程序播放.m3u8监控视频

					
最新发布

				
			

			

				

					qq_72114625的博客
				

				

					05-22
					
					3632
					
				

			

		

		

			
				
在开发uniapp实现H5、APP、微信小程序三端兼容的.m3u8监控视频播放功能时，发现不同平台对视频播放的支持存在差异。APP端可以直接使用uniapp的video组件实现播放；H5端由于浏览器对.m3u8格式的支持不一，需引入video.js库来确保兼容性；微信小程序端则因原生video组件的限制，采用web-view组件跳转至自定义页面实现播放，但需注意微信小程序的校验文件规则。通过针对不同平台的特定处理，最终成功实现了三端的视频播放功能。

			
		

	





	

		

			

				
					
微信小程序有的机型无法播放m3u8格式的直播流，使用H5在微信环境里播放

				
			

			

				

					lixu102593的博客
				

				

					04-25
					
					1572
					
				

			

		

		

			
				
这个还是有问题，有的直播地址在鸿蒙和苹果上都有声音，有的是鸿蒙上有声音，但是苹果上没有，也没找几个手机，测试的不准，不知道问题出在哪里，有可能是直播流的格式问题；我这测试鸿蒙的还有苹果X及部分机型在微信小程序里无法播放，不知道什么原因；直播流地址有的是hevc有的是h.264，音频都是aac；

			
		

	





	

		

			

				
					
html5中使用video.js播放器播放m3u8直播文件，兼容微信浏览器自动播放（亲测有效）

				
			

			

				

					11-30
				

			

		

		

			
				
html5中使用video.js播放器播放m3u8直播文件，兼容微信浏览器自动播放（亲测有效） 。

			
		

	





	

		

			

				
					
小程序video播放m3u8格式实时监控视频流问题

				
			

			

				

					m0_65209474的博客
				

				

					10-23
					
					1648
					
				

			

		

		

			
				
使用ios打开就会黑屏

			
		

	





	

		

			

				
					
微信小程序使用video组件播放视频功能示例【附源码下载】

				
			

			

				

					08-28
				

			

		

		

			
				
主要介绍了微信小程序使用video组件播放视频功能,结合实例形式分析了video组件播放本地mp4小视频的具体实现技巧,并附带源码供读者下载参考,需要的朋友可以参考下

			
		

	





	

		

			

				
					
小程序视频播放.docx

				
			

			

				

					08-09
				

			

		

		

			
				
原创文档，自己从开始做小程序视频需求开始，到最后完美解决问题所经历的一些过程，希望对有需要的朋友一些帮助，原创不易

			
		

	





	

		

			

				
					
原生小程序实现视频监控(m3u8格式)

				
			

			

				

					请叫我欧皇！的博客
				

				

					10-15
					
					6960
					
				

			

		

		

			
				
auto-pause-if-navigate：当跳转到本小程序的其他页面时，是否自动暂停本页面的视频播放。我这里播放的是m3u8格式的视频，在微信开发者工具上其实是播放不了，需要点击预览在自己手机上播放即可。enable-play-gesture：是否开启播放手势，即双击切换播放/暂停。controls：是否显示默认播放控件（播放/暂停按钮、播放进度、时间）show-center-play-btn：是否显示视频中间的播放按钮。show-play-btn：是否显示视频底部控制栏的播放按钮。

			
		

	





	

		

			

				
					
小程序 m3u8_小程序实时音频视频组件解析

				
			

			

				

					weixin_39689870的博客
				

				

					12-04
					
					2253
					
				

			

		

		

			
				
2017年下半年，微信6.5.21版本支持在线音视频功能。开发者可以通过两个音视频组件 <live-pusher> 和 <live-player> 实现实时地在线直播、视频通话、语音通话等功能。下面我们将详细介绍一下音视频组件在线直播和视频通话这两个应用场景。在线直播01在线直播的应用场景有哪些？在游戏直播、远程授课、以及企业内部的培训分享等场景中，都可能会用到在线直播功能...

			
		

	





	

		

			

				
					
uniapp项目播放m3u8（hls）视频

					
热门推荐

				
			

			

				

					woxingliu2018的博客
				

				

					12-11
					
					1万+
					
				

			

		

		

			
				
①uniapp项目，运行在手机浏览器端，需要播放m3u8类型视频。在网上找了好久教程，记录一下实现过程。②最开始使用的是videojs，后来改用MuiPlayer，两种方式都记一下。③m3u8就是hls。④在线播放m3u8视频： https://m3u8play.com/、http://tool.liumingye.cn/m3u8/（第一个播放速度比较快）⑤用来测试的m3u8视频地址：https://test-streams.mux.dev/x36xhzz/x36xhzz.m3u8。

			
		

	





	

		

			

				
					
微信小程序音视频格式转换及处理

				
			

			

				

					DsiCoder的博客
				

				

					09-17
					
					2839
					
				

			

		

		

			
				
在开发微信小程序时，经常会遇到需要对音视频进行格式转换和处理的情况。为了实现这一功能，我们可以借助FFmpeg这个强大的开源多媒体处理工具。本文将介绍如何在微信小程序中使用FFmpeg进行音视频格式转换。

			
		

	





	

		

			

				
					
微信小程序转码的方法，超级简单

				
			

			

				

					qq_34571485的博客
				

				

					12-14
					
					1502
					
				

			

		

		

			
				
微信小程序转码的方法，超级简单

			
		

	





	

		

			

				
					
在ASP.NET MVC 中M3U8视频处理

				
			

			

				

					刚哥的博客
				

				

					05-15
					
					3935
					
				

			

		

		

			
				
1）上传文件大小限制
 （1）必须在配置文件中配置
  <security>
   <!--允许上传文件的长度，单位字节-->
   <requestFiltering>
    <requestLimits maxAllowedContentLength="2097152000"></requestLimits&g...

			
		

	





	

		

			

				
					
ios微信本地视频上传到服务器,小程序 ios上传视频的问题

				
			

			

				

					weixin_28820911的博客
				

				

					08-06
					
					651
					
				

			

		

		

			
				
微信小程序做了个视频上传的功能，上传视频到七牛云 安卓没有任何问题 ios就有问题了 ios下如果从相册选择视频上传之后提示上传成功了，但是跳转不了页面，但是如果直接拍摄的视频上传之后可以正常跳转页面。。。。。。。。uploadVideoFile() {wx.showLoading({title: '视频上传中'})let that = thiswx.uploadFile({url: app.gl...

			
		

	





	

		

			

				
					

				
			

			

				

					
				

			

		

		

			
				

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		
评论 1

	

  

	
    

      

      

      

        
        

          
          

            

              成就一亿技术人!
            

            

              拼手气红包6.0元
            

          

        

        

          

            还能输入1000个字符
          

          

             
          

          

            

              红包
              添加红包
            

            

              表情包
              插入表情
              

                

              

            

            

              表情包
              代码片
              

                
              

            

            

              
              
              
              
              
              
              
            

          

        

      

    

		

			

			

			
			

					 条评论被折叠 查看
			

			

				
			

		

	

	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

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

              

            

          

      

      余额充值