关于javascript:使用-APICloud-开发-app-录音功能

4次阅读

共计 3729 个字符，预计需要花费 10 分钟才能阅读完成。

mp3Recorder 模块封装在 iOS、Android 下录音间接生成 mp3，对立两个平台的录音生成文件，不便双平台之间的交互，缩小录音实现后再转码的过程；同时提供分贝波形图显示 UI；应用该模块前须要关上麦克风权限。

固件要求：Android：4.0 及以上 iOS：8.0 及以上

该模块提供了 8 个接口：

addEventListener 视频后果和声音分贝监听；

startRecord 开始录音

stopRecord 进行录音

openVoiceLine 显示线性波形图

closeVoiceLine 敞开线性波形图

setDecibels 设置波形图的分贝值

pauseRecord 暂停录音

resumeRecord 复原录音

办法详解见 apicloud 平台模块开发文档：

https://docs.apicloud.com/Cli…

以下是代码的具体实现过程：

<!DOCTYPE html>
<html>

<head>
    <title>Module Develop</title>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <style type="text/css">
        html,
        body {height: 100%}

        body {
            background-color: #fff;
            margin: 0;
        }

        #wrap {
            height: 100%;
            position: relative;
        }

        #header {
            padding-top: 20px;
            background-color: #5082c2;
            height: 44px;
            position: relative;
        }

        #header h1 {
            font-size: 20px;
            height: 44px;
            line-height: 44px;
            margin: 0em;
            color: #fff;
            margin-left: 100px;
            margin-right: 100px;
            text-align: center;
        }

        #main {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-box-pack: center;
        }

        a.button {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-box-pack: center;
            -webkit-box-align: center;
            height: 32px;
            margin: 8px;
            background-color: rgba(240, 240, 240, 1.0);
            border-color: rgba(220, 220, 220, 1.0);
            border-width: 2px;
            border-style: solid;
        }

        a.active {background-color: rgba(240, 240, 240, 0.7);
        }
    </style>
</head>

<body>
    <div id="wrap">
        <div id="main">
            <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
            <a class="button" tapmode="active" onclick="_addEventListener()"> 监听录音 </a>
            <a class="button" tapmode="active" onclick="startRecord()"> 开始录音 </a>
            <a class="button" tapmode="active" onclick="pauseRecord()"> 暂停录音 </a>
            <a class="button" tapmode="active" onclick="resumeRecord()"> 复原录音 </a>
            <a class="button" tapmode="active" onclick="stopRecord()"> 进行录音 </a>
            <a class="button" tapmode="active" onclick="openVoiceLine()"> 关上曲线 </a>
            <a class="button" tapmode="active" onclick="closeVoiceLine()"> 敞开曲线 </a>
            <a class="button" tapmode="active" onclick="setDecibels()"> 设置分贝值 </a>
            <a class="button" tapmode="active" onclick="playAudio()"> 播放录音 </a>
            <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
        </div>
    </div>
</body>
<script>

    apiready = function () {}

    var mp3Path;

    function _addEventListener() {var demo = api.require('mp3Recorder');
        demo.addEventListener(function (ret, err) {alert(JSON.stringify(ret));
            if (ret.evenType == 'endRecord') {mp3Path = ret.data.path;}
            api.toast({msg: JSON.stringify(ret)
            });
        });
    }

    function startRecord() {var demo = api.require('mp3Recorder');
        demo.startRecord({
            channel: 2, // 声道反对:1 单声道 2 立体声道
            sampleRates: 44100, // 采样率
        }, function (ret, err) {
            api.toast({msg: JSON.stringify(ret)
            });
        });
    }

    function pauseRecord() {var demo = api.require('mp3Recorder');
        demo.pauseRecord(function (ret, err) {api.toast({ msg: JSON.stringify(ret) });
        });
    }

    function resumeRecord() {var demo = api.require('mp3Recorder');
        demo.resumeRecord(function (ret, err) {api.toast({ msg: JSON.stringify(ret) });
        });
    }

    function stopRecord() {var demo = api.require('mp3Recorder');
        demo.stopRecord(function (ret, err) {
            api.toast({msg: JSON.stringify(ret)
            });
        });
    }

    function openVoiceLine() {var demo = api.require('mp3Recorder');
        demo.openVoiceLine({
            rect: {
                x: 0,
                y: 0,
                w: api.frameWidth,
                h: api.frameHeight / 3
            },
            fixedOn: api.frameName,
            fixed: true,
            isTransparent: false, // 背景是否通明 (通明时能够穿透点击视图)
        }, function (ret, err) {alert(JSON.stringify(ret));
        });
    }

    function closeVoiceLine() {var demo = api.require('mp3Recorder');
        demo.closeVoiceLine(function (ret, err) {
            api.toast({msg: JSON.stringify(ret)
            });
        });
    }

    function setDecibels() {var demo = api.require('mp3Recorder');
        var random = getRandom(0, 60);
        demo.setDecibels({decibel: random}, function (ret, err) {
            api.toast({msg: JSON.stringify(ret)
            });
        });
    }

    function getRandom(min, max) {var r = Math.random() * (max - min);
        var re = Math.round(r + min);
        re = Math.max(Math.min(re, max), min)
        return re;
    }

    function playAudio() {
        api.startPlay({path: mp3Path}, function (ret, err) {});
    }
</script>

</html>

模块应用绝对比较简单，能够在 APICloud 开发平台上创立利用并增加间接增加模块，编译后装置到手机上，用示例代码进行测试。不便开发者在 app 开发的过程中应用。

正文完