在最近的H5项目中，遇到了个棘手的问题。

项目中需要使用微信录音的JSSDK接口，录完音后上传到自己的服务器上。流程如图：

整个流程非常清晰，也十分顺利。但下载到网站服务器上的文件时amr格式的音频文件。这种文件前端页面无法直接播放，无论时audio标签，还是各类JS播放音频文件的库都不支持直接播放amr文件。

查了很多资料，总共有以下三种解决方案：

1、上传时通过阿里云OOS、七牛云等云存储系统的API接口直接转码保存

这里以阿里云OOS为例，文档地址：传送门

但是！！！！！

阿里云OOS云存储系统跟媒体对象处理的功能是分别收费的！媒体对象转码功能需要额外付费。。。公司只购买了OOS云存储系统，没有购买媒体对象的功能，申请又不批，只能另寻他策。

2、前端页面转码

主要流程是，将amr文件下载到客户端设备，然后在本地进行转码成MP3播放。该方案主要使用benz-amr-recorder的库（其他转码库的原理基本一致），基于amr.js与recorder.js的库。文档地址：传送门

但是这种库的转码十分麻烦，而且用户体验非常糟糕。

3、服务器转码

在前面两种方案行不通的情况下只能将文件下载到服务器的同时进行转码。主要使用的技术是ffmpeg转码。本人使用的就是这种方案，主要是方案一不给钱，不然的话方案一是最优解。

因为网站服务器是centOS系统，所以我是参考的这个文章进行的安装与操作：linux下使用ffmpeg将amr转成mp3

虽然是2018年的文章，但亲测可用。

最后采用了一种比较迂回的方案解决这个问题

总算解决的当前需求。

总结：

在前端是无法直接播放amr文件的，需要将其转码成通用的Mp3格式。转码可以从三个方面考虑。按友好度跟效率分别为：云存储转码、服务器转码、前端页面转码。

网页上播放微信录音amr文件方案相关推荐

微信录音amr音频文件转mp3格式
直到现在,仍然不存在一项旨在网页上播放音频的标准.HTML5 规定了一种通过 audio 元素来包含音频的标准方法.audio 元素能够播放声音文件或者音频流.当前,audio 元素支持三种音频格式: ...
在网页上播放多种后缀的视频文件的临时解决方案
公司有一个项目,要在网页上播放各种视频文件.HTML5的video标签可以支持:1)带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件:2)带有 H.264 视频编码和 AAC 音 ...
html网页播放flac,教你如何无损录制网页上播放的声音
要对网页上的声音进行无损录制其实很简单,不管是网页上所播放视频上的声音,还是网页上的动画里发出的声音,或者是网页的背景音乐,都是可以进行无损录制的. 1,首先打开浏览器,并在百度上搜索下载支持无损内录 ...
HTML5网页上播放mp4失败的原因
HTML5网页上播放mp4失败的原因这个不错: https://blog.csdn.net/jacke121/article/details/84568802 解决方法1: FFMPEG -i ...
网页上播放视频的免费的播放器_CKPlayer
今天在工作的过程中遇到一个功能:在网页中加入视频播放器,类似于我们经常看到的优酷,爱奇艺等视频网站的功能. ckplayer(官网:http://www.ckplayer.com/)是一款在网页上播放 ...
微信录音amr解码问题
微信录音amr格式在php后端进行转码只有两种办法 1.ffmpeg工具实现,需要安装拓展,比较繁琐参考地址: https://blog.csdn.net/bq_cui/article/detail ...
微信录音amr转mp3
/** 微信录音amr转mp3* @param filePath 需要转换的文件*/ public static String transWxformMp3(String filePath, Stri ...
xbox one 越狱_如何在Xbox One上播放视频和音乐文件
xbox one 越狱 The Xbox One has integrated TV features and support for streaming media apps like Netfli ...
java 将微信录音amr转换为mp3格式
2020年更新,这是4前写的了文章了,今天找东西,登录账号发现一堆几年前的评论,真抱歉,我没回复你们如果有需要,尽量参考评论中的解决办法吧. https://blog.csdn.net/dadiya ...

网页上播放微信录音amr文件方案

1、上传时通过阿里云OOS、七牛云等云存储系统的API接口直接转码保存

2、前端页面转码

3、服务器转码

总结：

网页上播放微信录音amr文件方案相关推荐

最新文章

热门文章