简介
使用Media插件可以在设备上播放音频与录制音频。
注意:当前实现并不是遵循W3C规范的媒体捕捉,这里只是提供方便。未来的实现将坚持最新的W3C规范和可能弃用当前的API。
安装
cordova plugin add cordova-plugin-media
支持的平台
· Android
· BlackBerry 10
· iOS
· Windows Phone 7 and 8
· Tizen
· Windows 8
· Windows
· Browser
使用方法
这个插件定义一个全局媒体构造函数
虽然在全局范围内,这是deviceready事件以后才可用
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
console.log(Media);
}
详情
Media
初始化Media对象
var media = new Media(src, mediaSuccess, [mediaError], [mediaStatus]);
参数Parameters
src: 一个URI包含了这个音频内容。
mediaSuccess: (可选)一个媒体对象已完成当前播放,记录,或停止行动,执行这个回调函数。(函数)
mediaError: (可选)如果出现错误,执行这个回调函数。(函数)
mediaStatus: (可选)执行显示状态变化的回调函数。(函数)
注意:cdvfile路径可支持到src参数使用:
var my_media = new Media('cdvfile://localhost/temporary/recording.mp3', ...);
常量Constants
下面的常量是报道的唯一参数mediastatus回调:
· Media.MEDIA_NONE = 0;
· Media.MEDIA_STARTING = 1;
· Media.MEDIA_RUNNING = 2;
· Media.MEDIA_PAUSED = 3;
· Media.MEDIA_STOPPED = 4;
方法Methods
media.getCurrentAmplitude: 返回在音频文件的当前位置。
media.getCurrentPosition: 返回在音频文件的当前位置。
media.getDuration: 返回一个音频文件的持续时间。
media.play: 开始或恢复播放一个音频文件。
media.pause: 暂停播放音频文件
media.pauseRecord: 音频文件暂停录音
media.release: 释放操作系统底层的音频资源。
media.resumeRecord: 恢复音频文件记录
media.seekTo: 移动到当前播放音频文件的位置。
media.setVolume: 音频播放的音量设置
media.startRecord: 开始录制音频文件
media.stopRecord: 停止录制音频文件
media.stop: 停止播放音频文件
media.getCurrentAmplitude
返回当前记录的电流幅值。
media.getCurrentAmplitude(mediaSuccess, [mediaError]);
支持的平台Supported Platforms
· Android
· iOS
参数Parameters
mediaSuccess: 回调,通过电流的幅值(0 - 1)。
mediaError: (可选)回调执行如果出现错误。
media.getCurrentPosition
返回在一个音频文件的当前位置。还更新了媒体对象的位置参数.
media.getCurrentPosition(mediaSuccess, [mediaError]);
参数Parameters
mediaSuccess: 回调,当前位置的秒数。
mediaError: (可选)回调执行如果出现错误。
media.getDuration
在短时间内返回一个音频文件的持续时间。如果时间是未知的,它返回的值为1。
media.getDuration();
media.pause
暂停播放音频文件
media.pause();
media.pauseRecord
暂停录制音频文件
media.pauseRecord();
支持的平台Supported Platforms
· iOS
media.play
开始或恢复播放音频文件。
media.play();
media.release
发布操作系统底层的音频资源。这对于Android来说尤为重要,因为有一个有限的媒体播放OpenCore实例。应用程序不再需要任何媒体资源应该调用release 函数。
media.release();
media.resumeRecord
恢复录制音频文件
media.resumeRecord();
支持的平台Supported Platforms
· iOS
media.seekTo
设置当前的位置在一个音频文件。
media.seekTo(milliseconds);
参数Parameters
· milliseconds: 设置播放音频中的位置,以毫秒为单位。
media.setVolume
一个音频文件的音量设置。
media.setVolume(volume);
参数Parameters
· volume: 音量设置播放。该值必须在0到1的范围内。
支持的平台Supported Platforms
· Android
· iOS
media.startRecord
开始录制音频文件
media.startRecord();
支持的平台Supported Platforms
· Android
· iOS
· Windows Phone 7 and 8
· Windows
media.stop
停止播放音频文件
media.stop();
media.stopRecord
停止录制音频文件
media.stopRecord();
支持的平台Supported Platforms
· Android
· iOS
· Windows Phone 7 and 8
· Windows
示例
示例一:音频播放/暂定
index.html:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;"> <meta name="format-detection" content="telephone=no"> <meta name="msapplication-tap-highlight" content="no"> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> <title>Hello World</title> <style> .line{ padding: 10px; } </style> </head> <body> <div class="app"> <h1>media插件</h1> <div class="line"><button id="play">播放</button></div> <div class="line"><button id="pause">暂定</button></div> <div class="line"><button id="stop">停止</button></div> <div class="line"><button id="release">释放</button></div> <div id="audio_current"></div> <div id="audio_duration"></div> </div> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/index.js"></script> </body> </html>
index.js:
var app = { initialize: function() { document.addEventListener('deviceready', this.onDeviceReady.bind(this), false); }, onDeviceReady: function() { this.receivedEvent(); }, $$: function(id) { return document.getElementById(id); }, receivedEvent: function() { var src = "http://ws.stream.qqmusic.qq.com/C1000031Ecjg1tdNzL.m4a?fromtag=38"; var my_media = null; var mediaTimer = null; var timerDur = null; function mediaSuccess() { console.log("Media成功") } function mediaError(err) { console.log("Media失败") } // 开始或恢复播放一个音频文件 function playAudio() { if(my_media == null) { // 初始化Media对象 my_media = new Media(src, mediaSuccess, mediaError); } // 播放音频 my_media.play(); } // 暂停播放音频文件 function pauseAudio() { if(my_media) { my_media.pause(); } // 清除定时器对象 clearInterval(mediaTimer); mediaTimer = null; } // 释放操作系统底层的音频资源。 function releaseAudio() { if(my_media) { my_media.release(); } } // 停止播放音频文件 function stopAudio() { if(my_media) { }my_media.stop(); // 清除定时器对象 clearInterval(mediaTimer); mediaTimer = null; } // 返回在音频文件的当前位置。 function getCurrent() { if(mediaTimer == null){ mediaTimer = setInterval(function() { my_media.getCurrentPosition( // success callback function(position) { if(position > -1) { console.log((position) + " sec"); } document.getElementById('audio_current').innerHTML = position; }, // error callback function(e) { console.log("Error getting pos=" + e); } ); }, 1000); } } // 返回一个音频文件的持续时间。 function getDuration() { // Get duration var counter = 0; var timerDur = setInterval(function() { counter = counter + 100; if(counter > 2000) { clearInterval(timerDur); } var dur = my_media.getDuration(); if(dur > 0) { clearInterval(timerDur); document.getElementById('audio_duration').innerHTML = (dur) + " sec"; } }, 100); } this.$$("play").onclick = function() { playAudio(); getCurrent(); getDuration(); } this.$$("pause").onclick = function() { pauseAudio(); } this.$$("release").onclick = function() { releaseAudio(); } this.$$("stop").onclick = function() { stopAudio(); } } }; app.initialize();
运行:
点击“播放”按钮,开始播放音频。
点击“暂停”按钮,暂定当前音频播放,点击“播放”按钮,继续播放音频。
点击“停止”按钮,音频播放停止。
点击“释放”按钮,音频播放停止,并释放系统底层音频资源。
示例二:录制音频
index.html:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;"> <meta name="format-detection" content="telephone=no"> <meta name="msapplication-tap-highlight" content="no"> <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> <title>Hello World</title> <style> .line{ padding: 10px; } </style> </head> <body> <div class="app"> <h1>media插件</h1> <div class="line"><button id="startRecord">开始录制</button></div> </div> <script type="text/javascript" src="cordova.js"></script> <script type="text/javascript" src="js/index.js"></script> </body> </html>
index.js:
var app = { initialize: function() { document.addEventListener('deviceready', this.onDeviceReady.bind(this), false); }, onDeviceReady: function() { this.receivedEvent(); }, receivedEvent: function() { function mediaSuccess() { console.log("Media成功") } function mediaError(err) { console.log("Media失败") } // 录制音频 function recordAudio(){ var src = "myrecord.mp3"; var mediaRec = new Media(src, mediaSuccess, mediaError); // 启动录制音频 mediaRec.startRecord(); // 10秒后停止录制 var recTime = 0; var recInterval = setInterval(function(){ recTime = recTime + 1; if(recTime >= 10){ clearInterval(recInterval); mediaRec.stopRecord(); alert("录制完成") } },1000); } document.getElementById("startRecord").onclick = function(){ recordAudio(); } } }; app.initialize();
运行:
点击“开始录制”按钮,开始录音
10秒后,自动停止
打开手机文件管理器的根目录,可以找到我们录制的音频文件