微信小程序媒体API
一、图片管理
1. 选择图片
小程序使用wx.chooseImage(OBJECT)从本地相册选择图片或使用相机拍照获得图片,图片将被存放在设备的临时路径,在小程序本次启动期间可以正常使用。
参数
类型
必填
说明
count
Number
否
最多可以选择的图片张数,默认9
sizeType
StringArray
否
original 原图,compressed压缩图,默认二者都有
sourceType
StringArray
否
album 从相册选图,camera使用相机,默认二者都有
success
Function
是
成功则返回图片的本地文件路径列表tempFilePaths
fail
Function
否
接口调用失败的回调函数
complete
Function
否
接口调用结束的回调函数(调用成功与否都执行)
chooseImage : function ( ) {
var that = this
wx. chooseImage ( {
count: 1 ,
sizeType: [ 'original' , 'compressed' ] ,
sourceType: [ 'album' , 'camera' ] ,
success : function ( res ) {
var tempFilePaths = res. tempFilePaths
that. setData ( {
src: tempFilePaths[ 0 ] } )
}
} )
} ,
2. 预览图片
小程序使用wx.previewImage(OBJECT) 预览图片,OBJECT参数说明如表所示。
参数
类型
必填
说明
current
string
否
当前星示图片的链接。不境则默认为urls的第一张
urls
StringArray
是
需要预览的图片链接列表
suceess
Function
否
接口调用成功的回调亟数
fail
Function
否
接口调用失败的回调函数
complete
Function
否
接口调用结束的回调亟数(调用成功与否都执行)
previewImage : function ( ) {
var that = this
wx. previewImage ( {
urls: [ this . data. src] ,
} )
} ,
3. 获取图片信息
小程序使用wx.aetlmagelnfo(OBJECT)获取图片信息,OBJECT参数说明如表所示。
参数
类型
必填
说明
src
string
是
图片的路径,可以是相对路径,临时文件路径,存储文件路径,网络图片路径
suecess
Function
否
接口调用成功的回调函数
fail
Function
否
接口调用失败的回调函数
complete
Function
否
接口调用结束的回调函数(调用成功与否都执行)
success返回参数说明如表所示。
参数
类型
说明
width
Number
图片宽度,单位px
height
Number
图片高度,单位px
path
string
返回图片的本地路径
orientation
string
返回图片的方向
type
string
返回图片的格式
orientation参数说明说明如表所示。
枚举值
说明
up
默认
down
180度旋转
left
逆时针旋转90度
right
顺时针旋转90度
up-mirrored
同up,但水平翻转
down-mirrored
同down,但水平翻转
left-mirrored
同left。但垂直翻转
right-mirrored
同right,但垂直翻转
getImageInfo : function ( ) {
var that = this
wx. getImageInfo ( {
src: this . data. src,
success : function ( res ) {
wx. showToast ( {
icon: 'none' ,
title: '宽:' + res. width+ ',高:' + res. height,
} )
}
} )
} ,
4. 保存图片
小程序使用wx.saveImageToPhotosAlbum(OBJECT) 保存图片到系统相册,需要用户授权 scope.writePhotosAlbum。该接口从基础库 1.2.0 开始支持,低版本需做兼容处理。 OBJECT参数说明如表所示。
参数
类型
必填
说明
filePath
String
是
图片文件路径,可以是临时文件路径也可以是永久文件路径。不支持网络图片路径
success
Function
否
接口调用成功的回调函数,返回String类型参数errMsg。表示调用结果
fail
Function
否
接口调用失败的回调函数
complete
Function
否
接口调用结束的回调函数〔调用成功与否都执行)
saveImage : function ( ) {
var that = this
wx. saveImageToPhotosAlbum ( {
filePath: that. data. src,
success : function ( ) {
wx. showToast ( {
title: '保存成功!' ,
} )
}
} )
} ,
二、录音管理
小程序使用wx.getRecorderManager()获取全局唯一的录音管理器 recorderManager,该接口从基础库 1.6.0 开始支持,低版本需做兼容处理。
方法
参数
说明
start
options
开始录音
pause
暂停录音
resume
继续录音
stop
停止录音
onStart
callback
录音开始事件
onPause
callback
录音暂停事件
onStop
callback
录音停止事件,返回String类型参数tempFilePath表示录音文件的临时路径
onFrameRecorded
callback
已录制完指定帧大小的文件,会回调录音分片结果数据。如果设置了frameSize,则会回调此事件。
onError
callback
录音错误事件,返回String类型参数errMsa表示错误信息
开始录音
start : function ( ) {
const options = {
duration: 10000 ,
sampleRate: 44100 ,
numberOfChannels: 1 ,
encodeBitRate: 192000 ,
format: 'aac' ,
frameSize: 50
}
this . rm. start ( options)
} ,
结束录音
stop : function ( ) {
this . rm. stop ( )
} ,
1.start(options)方法的参数说明
start(options)方法的参数说明如表所示。
属性
类型
必填
说明
duration
Number
否
指定录音的时长,单位ms,如果传入了合法的duration,在到达指定的duration后会自动停止录音,最大值600000 (10分钟) ,默认值60000 (1分钟)
sampleRate
Number
否
采样率,有效值8000/16000/44100
numberOfChannels
Number
否
录音通道数,有效值1/2
encodeBitRate
Number
否
编码码率,有效值见下表格
format
String
否
音频格式,有效值aac/mp3
frameSize
Number
否
指定帧大小,单位KB。传入frameSize后,每录制指定帧大小的内容后,会回调录制的文件内容,不指定则不会回调。暂仅支持mp3格式
audioSource
String
否
指定音频输入源,默认值为’auto’
2.采样率和码率关系
采样率和码率关系如表所示
采样率
编码码率
8000
16000 ~ 48000
11025
16000 ~ 48000
12000
24000 ~64000
16000
24000 ~96000
22050
32000 ~ 128000
24000
32000 ~ 128000
32000
48000 ~ 192000
44100
64000~ 320000
48000
64000 ~ 320000
三、音频管理
音频根据其播放性质可以分为背景音频和前台音频。 背景音频在小程序最小化之后还可以继续在后台播放。
1. 背景音频管理
小程序使用wx.getBackgroundAudioManager()获取全局唯一的背景音频管理器 backgroundAudioManager。backgroundAudioManager对象的属性说明如表所示。
属性
类型
说明
只读
duration
Number
当前音频的长度(单位: s),只有在当前有合法的src时返回
是
currentTime
Number
当前音频的播放位置(单位: s),只有在当前有合法的src时返回
是
paused
Boolean
当前是是否暂停或停止状态,true表示暂停或停止, false表示正在播放
是
src
string
音频的数据源,默认为空字符串,当设置了新的src 时,会自动开始否播放,目前支持的格式有m4a, aac, mp3, wav
否
startTime
Number
音频开始播放的位置(单位: s)
否
buffered
Number
音频缓冲的时间点,仅保证当前播放时间点到此时间点内容已缓冲。
是
title
String
音频标题,用于做原生音频播放器音频标题。原生音频播放器中的分享功能,分享出去的卡片标题,也将使用该值。
否
epname
string
专辑名,原生音频播放器中的分享功能,分享出去的卡片简介,也将否使用该值。
否
singer
String
歌手名,原生音频播放器中的分享功能,分享出去的卡片简介,也将使用该值。
否
coverlmgUrl
String
封面图url,用于做原生音频播放器背景图。原生音频播放器中的分享功能,分享出去的卡片配图及背景也将使用该图。
否
webUrl
string
页面链接,原生音频播放器中的分享功能,分享出去的卡片简介,也将使用该值。
否
protocol
string
音频协议。默认值为’http’,设置’hls’可以支持播放HLS协议的直播音频
否
backgroundAudioManager 对象的方法说明如表所示。
方法
参数
说明
play
播放
pause
暂停
stop
停止
seek
position
跳转到指定位置,单位s
onCanplay
callback
背景音频进入可以播放状态,但不保证后面可以流畅播放
onPlay
callback
背景音频播放事件
onPause
callback
背景音频暂停事件
onStop
callback
背景音频停止事件
onEnded
callback
背景音频自然播放结束事件
onTimeUpdate
callback
背景音频播放进度更新事件
onPrev
callback
用户在系统音乐播放面板点击上一曲事件(iOS only)
onNext
callback
用户在系统音乐播放面板点击下一曲事件(iOs only)
onError
callback
背景音频播放错误事件,返回errCode
onWaiting
callbac
k音频加载中事件,当音频因为数据不足需要停下来加载时会触发
errCode 说明解释如下:
10001:系统错误
10002:网络错误
10003:文件错误
10004:格式错误
-1:未知错误
initialAudio : function ( ) {
let bgAudioManager = this . bgAudioManager
bgAudioManager. title = '******'
bgAudioManager. epname = '******'
bgAudioManager. singer = '******'
bgAudioManager. coverImgUrl = '******'
bgAudioManager. src = '******'
} ,
play : function ( ) {
this . bgAudioManager. play ( )
} ,
pause : function ( ) {
this . bgAudioManager. pause ( )
} ,
2. 音频组件控制
小程序使用wx.createInnerAudioContext()创建并返回内部 audio 上下文对象innerAudioContext,该接口从基础库 1.6.0 开始支持,低版本需做兼容处理。
属性
类型
说明
只读
src
String
音频的数据链接,用于直接播放。
否
startTime
Number
开始播放的位置(单位: s),默认0
否
autoplay
Boolean
是否自动开始播放,默认false
否
loop
Boolean
是否循环播放,默认false
否
obeyMuteSwitch
Boolean
是否遵循系统静音开关,当此参数为false时,即使用户打开了静音开关,也能继续发出声音,默认值true
否
duration
Number
当前音频的长度(单位: s),只有在当前有合法的src时返回
是
currentTime
Number
当前音频的播放位置(单位:s),只有在当前有合法的src 时返回,时间不取整,保留小数点后6位
是
paused
Boolean
当前是是否暂停或停止状态,true表示暂停或停止,false表示正在播放
是
buffered
Number
音频缓冲的时间点,仅保证当前播放时间点到此时间点内容已缓冲
是
volume
Number
音量。范围0~1
否
innerAudioContext对象的方法说明如表所示。
方法
参数
说明
play
无
播放
pause
无
暂停
stop
无
停止
seek
position
跳转到指定位置,单位s
destroy
无
销毁当前实例
onCanplay
callback
音频进入可以播放状态,但不保证后面可以流畅播放
onPlay
callback
音频播放事件
onPause
callback
音频暂停事件
onstop
callback
音频停止事件
onEnded
callback
音频自然播放结束事件
onTimeUpdate
callback
音频播放进度更新事件
onError
callback
音频播放错误事件
onWaiting
callback
音频加载中事件,当音频因为数据不足,需要停下来加载时会触发
onSeeking
callback
音频进行seek操作事件
onseeked
callback
音频完成seek操作事件
offCanplay
callback
取消监听onCanplay 事件
offPlay
callback
取消监听onPlay事件
offPause
callback
取消监听onPause事件
offStop
callback
取消监听onStop 事件
offEnded
callback
取消监听onEnded事件
offTimeUpdate
callback
取消监听onTimeUpdate 事件
offError
callback
取消监听onError 事件,并返回errCode
offWaiting
callback
取消监听onWaiting事件
offSeeking
callback
取背监听onSeeking 事件
offSeeked
callback
取消监听onSeeked事件
initialAudio : function ( ) {
let audioCtx = this . audioCtx
audioCtx. autoplay = true
audioCtx. src = '******'
audioCtx. onPlay ( ( ) => {
console. log ( '开始播放' )
} )
audioCtx. onPause ( ( res ) => {
console. log ( '暂停播放' )
} )
audioCtx. onStop ( ( res ) => {
console. log ( '停止播放' )
} )
} ,
play : function ( ) {
this . audioCtx. play ( )
} ,
pause : function ( ) {
this . audioCtx. pause ( )
} ,
stop : function ( ) {
this . audioCtx. stop ( )
} ,
四、视频管理
1. 选择视频
小程序使用wx.chooseVideo(OBJECT) 拍摄视频或从手机相册中选视频,返回视频的临时文件路径。OBJECT参数说明如表所示。
属性
类型
必填
只读
sourceType
StringArray
否
album从相册选视频,camera使用相机拍摄,默认为:[‘album’ , ‘camera’]
compressed
Boolead
否
是否压缩所选的视频源文件,默认值为true,需要压缩
maxDuration
Number
否
拍摄视频最长拍摄时间。单位秒。最长支持60秒
success
Function
否
接口调用成功,返回视频文件的临时文件路径
fail
Function
否
接口调用失败的回调函数
complete
Function
否
接口调用结束的回调函数〔调用成功与否都执行)
success返回参数说明如下:
tempFilePath:选定视频的临时文件路径;
duration:选定视频的时间长度;
size:选定视频的数据量大小;
height:返回选定视频的长;
width:返回选定视频的宽。
需要注意是,wx.chooseVideo获得的视频仅能在小程序启动期间临时使用。
如需持久保存,需在主动调用 wx.saveFile进行保存,在小程序下次启动时才能访问得到。
chooseVideo : function ( ) {
var that = this
wx. chooseVideo ( {
sourceType: [ 'album' , 'camera' ] ,
maxDuration: 60 ,
camera: 'back' ,
success : function ( res ) {
that. setData ( {
src: res. tempFilePath
} )
}
} )
} ,
2. 保存视频
小程序使用wx.saveVideoToPhotosAlbum(OBJECT) 保存视频到系统相册,需要用户授权 scope.writePhotosAlbum。该接口从基础库 1.2.0 开始支持,低版本需做兼容处理。 OBJECT参数说明如表所示。
参数名
类型
必填
说明
filePath
String
是
视频文件路径,可以是临时文件路径或永久文件路径
success
Function
否
接口调用成功的回调函数,返回String类型参数errMsg,表示调用结果
fail
Function
否
接口调用失败的回调函数
complete
Function
否
接口调用结束的回调函数(调用成功与否都执行)
saveVideo : function ( ) {
var src = this . data. src
wx. saveVideoToPhotosAlbum ( {
filePath: src,
success : function ( res ) {
wx. showToast ( {
title: '保存成功!' ,
} )
}
} )
} ,
3. 视频组件控制
小程序使用wx.createVideoContext(videoId,this) 创建并返回视频上下文videoContext对象。videoContext 通过 videoId 跟一个 video 组件绑定,通过它可以操作一个 video 组件。 在自定义组件下,第二个参数传入组件实例this,以操作组件内组件。
videoContext 对象的方法说明如表所示。
方法
参数
说明
play
无
播放
pause
无
暂停
seek
position
跳转到指定位置,单位s
sendDanmu
danmu
发送弹幕,danmu包含两个属性: text和color
playbackRate
rate
设置倍速播放,支持的倍率有0.5/0.8/1.0/1.25/1.5
requestFullScreen
无
进入全屏,可传入{direction}参数(1.7.0起支持)
exitFullScreen
无
退出全屏
play : function ( ) {
this . videoContext. play ( )
} ,
pause : function ( ) {
this . videoContext. pause ( )
} ,
inputValue: '' ,
bindInputBlur : function ( e ) {
this . inputValue = e. detail. value
} ,
bindSendDanmu : function ( ) {
this . videoContext. sendDanmu ( {
text: this . inputValue,
color: getRandomColor ( )
} )
} ,
五、相机管理
startRecord : function ( ) {
var that = this
that. setData ( {
isRecording: true , isHidden: true } )
this . ctx. startRecord ( {
timeoutCallback ( res ) {
that. setData ( {
isRecording: false ,
src: res. tempVideoPath,
isHidden: false
} )
}
} )
} ,
stopRecord : function ( ) {
var that = this
this . ctx. stopRecord ( {
success : function ( res ) {
that. setData ( {
isRecording: false ,
src: res. tempVideoPath,
isHidden: false
} )
}
} )
} ,
1. cameraContext对象的方法
cameraContext对象的方法列表如下表所示。
方法
参数
说明
takePhoto
OBJECT
拍照,可指定质量,成功则返回图片
startRecord
OBJECT
开始录像
stopRecord
OBJECT
结束录像,成功则返回封面与视频
2. takePhoto的OBJECT参数
takePhoto的OBJECT参数列表如下表所示。
参数
类型
必填
说明
quality
string
否
成像质量,值为high, normal, low,默认normal
success
Function
否
接口调用成功的回调函数,res = f templmagePath }
fail
Function
否
接口调用失败的回调函数
complete
Function
否
接口调用结束的回调函数(调用成功与否都执行)
3. startRecord的OBJECT参数
startRecord的OBJECT参数列表如下表所示。
参数
类型
必填
说明
success
Function
否
接口调用成功的回调函数
fail
Function
否
接口调用失败的回调函数
complete
Function
否
接口调用结束的回调函数(调用成功与否都执行)
timeoutCallback
Function
否
超过30s或页面onHide时会结束录像,res = { tempThumbPath, tempVideoPath }
4. stopRecord的OBJECT参数
stopRecord的OBJECT参数列表如下表所示。
参数
类型
必填
说明
success
Function
否
接口调用成功的回调函数,res = { tempThumbPath, tempVideoPath }
fail
Function
否
接口调用失败的回调函数
complete
Function
否
接口调用结束的回调函数(调用成功与否都执行)
六、推荐小程序(欢迎各位大佬指导)