2023年11月27日发(作者：)

录⾳⽂件与Base64编码相互转换的⽅法

前⾔

最近有⼏个朋友⼀直在问语⾳⽂件怎么转base64字符串进⾏发送上传，base64字符串⼜如何转成⽂件，论坛中已经有多篇问题的帖⼦有介

绍，这⾥只是稍微整理，⽅便⼤家可以更加⽅便的使⽤，⾸先看效果：

录⾳⽂件转成base64字符串

hello mui 演⽰app中有演⽰案例，通过hold和release控制录⾳的长度，即长按按钮开始录⾳，释放就停⽌录⾳，上拉取消发送

录⾳。

html部分：部分

id"recorder" type"button" class"mui-btn mui-btn-blue mui-btn-block">

js部分：部分

中⾸先需要配置：

true//默认为true

true//默认为false

true//默认为false

true//默认为true

true//默认为true

true//默认为false，不监听

true //默认为false，不监听

录⾳逻辑控制，按住按钮弹出录⾳提⽰框，并且对录⾳时长进⾏控制，录⾳时间太短取消操作，⼿指上划，取消发送。

var800

varnull

varnull

varnull

varnull

varfalse

var"sound-alert"

var"audio-tips"

// 控制录⾳弹出框是否播放

varfunction

if

'block'

1

else

0

// 完成再真正隐藏

function

'none'

200

function

/**

* 录制语⾳⽂件转base64字符串

* 录制语⾳⽂件转base64字符串

*/

// 按住录⾳（长按开始录⾳）

'#recorder''hold'function

false

if

"⼿指上划，取消发送"

'rprogress-sigh'

true

// 获取当前设备的录⾳对象

new Date

"_doc/audio/"

"amr" //iOS平台⽀持"wav"、"aac"、"amr"格式，默认为"wav"

function

ifreturn

"path:"

Audio2dataURL

function

"录⾳出现异常: "

// 释放保存（松⼿保存）

'#recorder''release'function

if"cancel"

"cancel"

"⼿指上划，取消发送"

// 判断录⾳时间

new Date

if800

"录⾳时间太短"

'rprogress-sigh'

true

function

false

800

else

false

// 拖动屏幕（⼿指上划，取消发送）

'drag'functionevent

ifMathevent50

if

true

if"cancel"

"cancel"

"松开⼿指，取消发送"

else

if

false

if"cancel"

"cancel"

"⼿指上划，取消发送"

false

当录⾳成功后，我们可以将录⾳⽂件转成base64字符串，⽤于⽹络传输。

/**

* 录⾳语⾳⽂件转base64字符串

* @param {Object} path

*/

function Audio2dataURL

function

function

varnewFileReader

function

function

"读写出现异常: "

⾄此我们完成了录⾳语⾳⽂件转base64字符串，反过来我们需要将base64字符串转成语⾳⽂件。

base64字符串转成语⾳⽂件

我们可以封装如下⽅法：

/**

* base64字符串转成语⾳⽂件(参考/question/16935)

* @param {Object} base64Str

* @param {Object} callback

*/

function

var'data:audio/amr;base64,'''

varnew Date'.amr'

function

truefunction

// 获得平台绝对路径

var

if

// 读取⾳频

var Base64"64"

var FileOutputStream"tputStream"

try

var outnew FileOutputStream

varBase64Base64

out

out

// 回调

catch

else if

var NSData'NSData'

varnew NSData

0

if

true

// 回调

调⽤⽅法如下：

html部分：

id"player" type"button" class"mui-btn mui-btn-blue mui-btn-block">

js部分：

/**

* base64字符串转成语⾳⽂件播放

*/

'#player''tap'function

// 语⾳⽂件Base64编码（由于编码过长影响阅读体验，请查看⼯程验证）

var' '

// 转成.amr⽂件播放

function

var

// 播放⾳频

/**

* 播放⾳频

* @param {Object} path

*/

function

var

function

"播放成功"

function

"播放失败"

写在后⾯

本⽂以语⾳⽂件为例说明5+中语⾳⽂件与Base64编码的相互转换，对于图⽚与Base64编码的转换⽅法请参考，可以通过loadBase64Data

⽅法加载Base64编码格式图⽚到Bitmap对象，通过toBase64Data⽅法获取图⽚的Base64编码数据。对于⼀般性⽂件，建议使⽤h5 File

API，详细可以参考我这篇⽂章：

本⽂详细代码请查看附件⼯程。