微信小程序中媒体api总结

简介:

图片

wx.chooseImage(OBJECT)

从本地相册选择图片或使用相机拍照

OBJECT参数说明:

参数名 类型 必填 说明
count Number 最多可以选择的图片张数,默认9
sizeType StringArray original 原图,compressed 压缩图,默认二者都有
sourceType StringArray album 从相册选图,camera 使用相机,默认二者都有
success Function 成功则返回图片的本地文件路径列表 tempFilePaths
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

注:文件的临时路径,在小程序本次启动期间可以正常使用,如需持久保存,需在主动调用 wx.saveFile,在小程序下次启动时才能访问得到。

success返回参数说明:

参数名 类型 说明 最低版本
tempFilePaths StringArray 图片的本地文件路径列表
tempFiles ObjectArray 图片的本地文件列表,每一项是一个 File 对象 1.2.0

File 对象结构如下:

字段 类型 说明
path String 本地文件路径
size Number 本地文件大小,单位:B
wx.chooseImage({
  count: 1, // 默认9
  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
  sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
  success: function (res) {
    // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
    var tempFilePaths = res.tempFilePaths
  }
})

wx.previewImage(OBJECT)

预览图片。2.3.0起支持云文件ID

参数名 类型 必填 说明
current String 当前显示图片的链接,不填则默认为 urls 的第一张
urls StringArray 需要预览的图片链接列表
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)
wx.previewImage({
  current: '', // 当前显示图片的http链接
  urls: [] // 需要预览的图片http链接列表
})

wx.getImageInfo(OBJECT)

获取图片信息,倘若为网络图片,需先配置download域名才能生效

OBJECT参数说明:

参数名 类型 必填 说明
src String 图片的路径,可以是相对路径,临时文件路径,存储文件路径,网络图片路径
success Function 成功则返回图片的本地文件路径列表 tempFilePaths
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数名 类型 说明 最低版本
width Number 图片宽度,单位px
height Number 图片高度,单位px
path String 返回图片的本地路径
orientation String 返回图片的方向,有效值见下表 1.9.90
type String 返回图片的格式 1.9.90

orientation参数说明:

枚举值 说明
up 默认
down 180度旋转
left 逆时针旋转90度
right 顺时针旋转90度
up-mirrored 同up,但水平翻转
down-mirrored 同down,但水平翻转
left-mirrored 同left,但垂直翻转
right-mirrored 同right,但垂直翻转
wx.getImageInfo({
  src: 'images/a.jpg',
  success: function (res) {
    console.log(res.width)
    console.log(res.height)
  }
})
wx.chooseImage({
  success: function (res) {
    wx.getImageInfo({
      src: res.tempFilePaths[0],
      success: function (res) {
        console.log(res.width)
        console.log(res.height)
      }
    })
  }
})

wx.saveImageToPhotosAlbum(OBJECT)

保存图片到系统相册。需要用户授权 scope.writePhotosAlbum; 基础库 1.2.0 开始支持,低版本需做兼容处理。

OBJECT参数说明:

参数名 类型 必填 说明
filePath String 图片文件路径,可以是临时文件路径也可以是永久文件路径,不支持网络图片路径
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数名 类型 说明
errMsg String 调用结果
wx.saveImageToPhotosAlbum({
    success(res) {
    }
})

录音

wx.startRecord(OBJECT)

开始录音。当主动调用wx.stopRecord,或者录音超过1分钟时自动结束录音,返回录音文件的临时文件路径。当用户离开小程序时,此接口无法调用。注意:1.6.0 版本开始,本接口不再维护。建议使用能力更强的 wx.getRecorderManager 接口

需要用户授权 scope.record

OBJECT参数说明:

参数 类型 必填 说明
success Function 录音成功后调用,返回录音文件的临时文件路径,res = {tempFilePath: '录音文件的临时路径'}
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

注:文件的临时路径,在小程序本次启动期间可以正常使用,如需持久保存,需在主动调用wx.saveFile,在小程序下次启动时才能访问得到

success返回参数说明:

参数 说明
tempFilePath 录音文件的临时路径

wx.stopRecord()

​主动调用停止录音

wx.startRecord({
  success: function(res) {
    var tempFilePath = res.tempFilePath 
  },
  fail: function(res) {
     //录音失败
  }
})
setTimeout(function() {
  //结束录音  
  wx.stopRecord()
}, 10000)

录音管理

wx.getRecorderManager()

获取全局唯一的录音管理器 recorderManager。基础库 1.6.0 开始支持,低版本需做兼容处理

recorderManager

recorderManager 对象的方法列表:

方法 参数 说明
start options 开始录音
pause 暂停录音
resume 继续录音
stop 停止录音
onStart callback 录音开始事件
onPause callback 录音暂停事件
onStop callback 录音停止事件,会回调文件地址
onFrameRecorded callback 已录制完指定帧大小的文件,会回调录音分片结果数据。如果设置了 frameSize ,则会回调此事件
onError callback 录音错误事件, 会回调错误信息

start(options) 说明:

属性 类型 必填 说明 支持版本
duration Number 指定录音的时长,单位ms,如果传入了合法的duration,在到达指定的duration后会自动停止录音,最大值600000(10分钟),默认值60000(1分钟) 1.6.0
sampleRate Number 采样率,有效值 8000/16000/44100 1.6.0
numberOfChannels Number 录音通道数,有效值 1/2 1.6.0
encodeBitRate Number 编码码率,有效值见下表格 1.6.0
format String 音频格式,有效值 aac/mp3 1.6.0
frameSize Number 指定帧大小,单位 KB。传入 frameSize 后,每录制指定帧大小的内容后,会回调录制的文件内容,不指定则不会回调。暂仅支持 mp3 格式 1.6.0
audioSource String 指定音频输入源,默认值为 'auto' 2.1.0

其中,采样率和码率有一定要求,具体有效值如下:

采样率 编码码率
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

audioSource 有效值:

说明 支持平台
auto 自动设置,默认使用手机麦克风,插上耳麦后自动切换使用耳机麦克风 iOS/Android/devtools
buildInMic 手机麦克风 iOS
headsetMic 耳机麦克风 iOS
mic 麦克风(没插耳麦时是手机麦克风,插耳麦时是耳机麦克风 Android
camcorder 摄像头的麦克风 Android

onStop(callback) 回调结果说明:

属性 类型 说明
tempFilePath String 录音文件的临时路径

onFrameRecorded(callback) 回调结果说明:

属性 类型 说明
frameBuffer ArrayBuffer 录音分片结果数据
isLastFrame Boolean 当前帧是否正常录音结束前的最后一帧

onError(callback) 回调结果说明:

属性 类型 说明
errMsg String 错误信息
const recorderManager = wx.getRecorderManager()
recorderManager.onStart(() => {
  console.log('recorder start')
})
recorderManager.onPause(() => {
  console.log('recorder pause')
})
recorderManager.onStop((res) => {
  console.log('recorder stop', res)
  const { tempFilePath } = res
})
recorderManager.onFrameRecorded((res) => {
  const { frameBuffer } = res
  console.log('frameBuffer.byteLength', frameBuffer.byteLength)
})
const options = {
  duration: 10000,
  sampleRate: 44100,
  numberOfChannels: 1,
  encodeBitRate: 192000,
  format: 'aac',
  frameSize: 50
}
recorderManager.start(options)

音频播放控制

wx.playVoice(OBJECT)

开始播放语音,同时只允许一个语音文件正在播放,如果前一个语音文件还没播放完,将中断前一个语音播放。 注意:1.6.0 版本开始,本接口不再维护。建议使用能力更强的 wx.createInnerAudioContext 接口

OBJECT参数说明:

参数 类型 必填 说明 最低版本
filePath String 需要播放的语音文件的文件路径
duration Number 指定录音时长,到达指定的录音时长后会自动停止录音,单位:秒,默认值:60 1.6.0
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)
wx.startRecord({
  success: function(res) {
    var tempFilePath = res.tempFilePath
    wx.playVoice({
      filePath: tempFilePath,
      complete: function(){
      }
    })
  }
})

wx.pauseVoice()

暂停正在播放的语音。再次调用wx.playVoice播放同一个文件时,会从暂停处开始播放。如果想从头开始播放,需要先调用 wx.stopVoice

wx.startRecord({
  success: function(res) {
    var tempFilePath = res.tempFilePath
    wx.playVoice({
      filePath: tempFilePath
    })    
    setTimeout(function() {
      //暂停播放
      wx.pauseVoice()
    }, 5000)
  }
})

wx.stopVoice()

结束播放语音

wx.startRecord({
  success: function(res) {
    var tempFilePath = res.tempFilePath
    wx.playVoice({
      filePath:tempFilePath
    })  
    setTimeout(function(){
      wx.stopVoice()
    }, 5000)
  }
})

音乐播放控制

wx.getBackgroundAudioPlayerState(OBJECT)

获取后台音乐播放状态

注意:1.2.0 版本开始,本接口不再维护。建议使用能力更强的 wx.getBackgroundAudioManager 接口

OBJECT参数说明:

参数 类型 必填 说明
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数 说明
duration 选定音频的长度(单位:s),只有在当前有音乐播放时返回
currentPosition 选定音频的播放位置(单位:s),只有在当前有音乐播放时返回
status 播放状态(2:没有音乐在播放,1:播放中,0:暂停中)
downloadPercent 音频的下载进度(整数,80代表80%),只有在当前有音乐播放时返回
dataUrl 歌曲数据链接,只有在当前有音乐播放时返回
wx.getBackgroundAudioPlayerState({
    success: function(res) {
        var status = res.status
        var dataUrl = res.dataUrl
        var currentPosition = res.currentPosition
        var duration = res.duration
        var downloadPercent = res.downloadPercent
    }
})

wx.playBackgroundAudio(OBJECT)

使用后台播放器播放音乐,对于微信客户端来说,只能同时有一个后台音乐在播放。当用户离开小程序后,音乐将暂停播放;当用户在其他小程序占用了音乐播放器,原有小程序内的音乐将停止播放

OBJECT参数说明:

参数 类型 必填 说明
dataUrl String 音乐链接,目前支持的格式有 m4a, aac, mp3, wav
title String 音乐标题
coverImgUrl String 封面URL
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)
wx.playBackgroundAudio({
    dataUrl: '',
    title: '',
    coverImgUrl: ''
})

wx.pauseBackgroundAudio()

暂停播放音乐

wx.pauseBackgroundAudio()

wx.seekBackgroundAudio(OBJECT)

控制音乐播放进度

OBJECT参数说明:

参数 类型 必填 说明
position Number 音乐位置,单位:秒
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)
wx.seekBackgroundAudio({
    position: 30
})

wx.stopBackgroundAudio()

停止播放音乐

wx.stopBackgroundAudio()

wx.onBackgroundAudioPlay(CALLBACK)

监听音乐播放

wx.onBackgroundAudioPause(CALLBACK)

监听音乐暂停

wx.onBackgroundAudioStop(CALLBACK)

监听音乐停止

bug: iOS 6.3.30 wx.seekBackgroundAudio 会有短暂延迟

背景音频播放管理

wx.getBackgroundAudioManager()

基础库 1.2.0 开始支持,低版本需做兼容处理。

获取全局唯一的背景音频管理器 backgroundAudioManager。

小程序切入后台,如果音频处于播放状态,可以继续播放。但是后台状态不能通过调用API操纵音频的播放状态。

注:从微信客户端6.7.2版本开始,若需要在小程序切后台后继续播放音频,需要在 app.json 中配置 requiredBackgroundModes 属性。开发版和体验版上可以直接生效,正式版还需通过审核。

backgroundAudioManager 对象的属性列表:

参数 类型 只读 说明 最低版本
duration Number 当前音频的长度(单位:s),只有在当前有合法的 src 时返回
currentTime Number 当前音频的播放位置(单位:s),只有在当前有合法的 src 时返回
paused Boolean 当前是是否暂停或停止状态,true 表示暂停或停止,false 表示正在播放
src String 音频的数据源,支持云文件ID(2.2.3起),默认为空字符串,当设置了新的 src 时,会自动开始播放 ,目前支持的格式有 m4a, aac, mp3, wav
startTime Number 音频开始播放的位置(单位:s)
buffered Number 音频缓冲的时间点,仅保证当前播放时间点到此时间点内容已缓冲
title String 音频标题,用于做原生音频播放器音频标题(必填)。原生音频播放器中的分享功能,分享出去的卡片标题,也将使用该值
epname String 专辑名,原生音频播放器中的分享功能,分享出去的卡片简介,也将使用该值
singer String 歌手名,原生音频播放器中的分享功能,分享出去的卡片简介,也将使用该值
coverImgUrl String 封面图url,用于做原生音频播放器背景图。原生音频播放器中的分享功能,分享出去的卡片配图及背景也将使用该图
webUrl String 页面链接,原生音频播放器中的分享功能,分享出去的卡片简介,也将使用该值
protocol String 音频协议。默认值为 'http',设置 'hls' 可以支持播放 HLS 协议的直播音频 1.9.94

backgroundAudioManager 对象的方法列表:

方法 参数 说明 支持版本
play 播放
pause 暂停
stop 停止
seek position 跳转到指定位置,单位 s。精确到小数点后 3 位,即支持 ms 级别精确度
onCanplay callback 背景音频进入可以播放状态,但不保证后面可以流畅播放
onPlay callback 背景音频播放事件
onSeeking callback 背景音频开始跳转操作事件 2.2.3
onSeeked callback 背景音频完成跳转操作事件 2.2.3
onPause callback 背景音频暂停事件
onStop callback 背景音频停止事件
onEnded callback 背景音频自然播放结束事件
onTimeUpdate callback 背景音频播放进度更新事件
onPrev callback 用户在系统音乐播放面板点击上一曲事件(iOS only)
onNext callback 用户在系统音乐播放面板点击下一曲事件(iOS only)
onError callback 背景音频播放错误事件
onWaiting callback 音频加载中事件,当音频因为数据不足,需要停下来加载时会触发

errcode 说明

errCode 说明
10001 系统错误
10002 网络错误
10003 文件错误
10004 格式错误
-1 未知错误
const backgroundAudioManager = wx.getBackgroundAudioManager()
backgroundAudioManager.title = '此时此刻'
backgroundAudioManager.epname = '此时此刻'
backgroundAudioManager.singer = '许巍'
backgroundAudioManager.coverImgUrl = 'http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg?max_age=2592000'
backgroundAudioManager.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46' // 设置了 src 之后会自动播放

音频组件控制

wx.createAudioContext(audioId, this)

创建并返回 audio 上下文 audioContext 对象。在自定义组件下,第二个参数传入组件实例this,以操作组件内 组件

注意:1.6.0 版本开始,本接口不再维护。建议使用能力更强的 wx.createInnerAudioContext 接口

audioContext

audioContext 通过 audioId 跟一个 <audio/> 组件绑定,通过它可以操作对应的 <audio/> 组件

audioContext 对象的方法列表:

方法 参数 说明
setSrc src 音频的地址
play 播放
pause 暂停
seek position 跳转到指定位置,单位 s
<!-- audio.wxml -->
<audio  src="{{src}}" id="myAudio" ></audio>
<button type="primary" bindtap="audioPlay">播放</button>
<button type="primary" bindtap="audioPause">暂停</button>
<button type="primary" bindtap="audio14">设置当前播放时间为14秒</button>
<button type="primary" bindtap="audioStart">回到开头</button>
// audio.js
Page({
  onReady: function (e) {
    // 使用 wx.createAudioContext 获取 audio 上下文 context
    this.audioCtx = wx.createAudioContext('myAudio')
    this.audioCtx.setSrc('http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46')
    this.audioCtx.play()
  },
  data: {
    src: ''
  },
  audioPlay: function () {
    this.audioCtx.play()
  },
  audioPause: function () {
    this.audioCtx.pause()
  },
  audio14: function () {
    this.audioCtx.seek(14)
  },
  audioStart: function () {
    this.audioCtx.seek(0)
  }
})

wx.createInnerAudioContext()

创建并返回内部 audio 上下文 innerAudioContext 对象。本接口是 wx.createAudioContext 升级版。基础库 1.6.0 开始支持,低版本需做兼容处理

innerAudioContext

innerAudioContext 对象的属性列表:

属性 类型 说明 只读 支持版本
src String 音频的数据链接,用于直接播放。支持云文件ID(2.2.3起)
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 1.9.90

innerAudioContext 对象的方法列表:

方法 参数 说明 支持版本
play 播放
pause 暂停
stop 停止
seek position 跳转到指定位置,单位 s。精确到小数点后 3 位,即支持 ms 级别精确度
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 事件 1.9.0
offPlay callback 取消监听 onPlay 事件 1.9.0
offPause callback 取消监听 onPause 事件 1.9.0
offStop callback 取消监听 onStop 事件 1.9.0
offEnded callback 取消监听 onEnded 事件 1.9.0
offTimeUpdate callback 取消监听 onTimeUpdate 事件 1.9.0
offError callback 取消监听 onError 事件 1.9.0
offWaiting callback 取消监听 onWaiting 事件 1.9.0
offSeeking callback 取消监听 onSeeking 事件 1.9.0
offSeeked callback 取消监听 onSeeked 事件 1.9.0

errCode 说明

errCode 说明
10001 系统错误
10002 网络错误
10003 文件错误
10004 格式错误
-1 未知错误
const innerAudioContext = wx.createInnerAudioContext()
innerAudioContext.autoplay = true
innerAudioContext.src = 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E061FF02C31F716658E5C81F5594D561F2E88B854E81CAAB7806D5E4F103E55D33C16F3FAC506D1AB172DE8600B37E43FAD&fromtag=46'
innerAudioContext.onPlay(() => {
    console.log('开始播放')
})
innerAudioContext.onError((res) => {
    console.log(res.errMsg)
    console.log(res.errCode)
})

wx.getAvailableAudioSources(OBJECT)

获取当前支持的音频输入源。基础库 2.1.0 开始支持,低版本需做兼容处理

参数 类型 必填 说明
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数 类型 说明
audioSources ArrayString 音频输入源,每一项对应一种音频输入源

audioSource 有效值:

说明 支持平台
auto 自动设置,默认使用手机麦克风,插上耳麦后自动切换使用耳机麦克风 iOS/Android/devtools
buildInMic 手机麦克风 iOS
headsetMic 耳机麦克风 iOS
mic 麦克风(没插耳麦时是手机麦克风,插耳麦时是耳机麦克风 Android
camcorder 摄像头的麦克风 Android

视频

wx.chooseVideo(OBJECT)

拍摄视频或从手机相册中选视频,返回视频的临时文件路径

OBJECT参数说明:

参数 类型 必填 说明
sourceType StringArray album 从相册选视频,camera 使用相机拍摄,默认为:['album', 'camera']
compressed Boolean 是否压缩所选的视频源文件,默认值为true,需要压缩
maxDuration Number 拍摄视频最长拍摄时间,单位秒。最长支持 60 秒
success Function 接口调用成功,返回视频文件的临时文件路径,详见返回参数说明
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数 说明
tempFilePath 选定视频的临时文件路径
duration 选定视频的时间长度
size 选定视频的数据量大小
height 返回选定视频的长
width 返回选定视频的宽

注:文件的临时路径,在小程序本次启动期间可以正常使用,如需持久保存,需在主动调用 wx.saveFile,在小程序下次启动时才能访问得到

<view class="container">
    <video src="{{src}}"></video>
    <button bindtap="bindButtonTap">获取视频</button>
</view>
Page({
    bindButtonTap: function() {
        var that = this
        wx.chooseVideo({
            sourceType: ['album','camera'],
            maxDuration: 60,
            camera: 'back',
            success: function(res) {
                that.setData({
                    src: res.tempFilePath
                })
            }
        })
    }
})

wx.saveVideoToPhotosAlbum(OBJECT)

保存视频到系统相册。需要用户授权 scope.writePhotosAlbum。基础库 1.2.0 开始支持,低版本需做兼容处理

OBJECT参数说明:

参数 类型 必填 说明
filePath String 视频文件路径,可以是临时文件路径也可以是永久文件路径
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

success返回参数说明:

参数名 类型 说明
errMsg String 调用结果
wx.saveVideoToPhotosAlbum({
  filePath: 'wxfile://xxx'
  success(res) {
    console.log(res.errMsg)
  }
})

tip: camera 参数在部分 Android 手机下由于系统 ROM 不支持无法生效

视频组件控制

wx.createVideoContext(videoId, this)

创建并返回 video 上下文 videoContext 对象。在自定义组件下,第二个参数传入组件实例this,以操作组件内 <video/> 组件

videoContext

videoContext 通过 videoId 跟一个 video 组件绑定,通过它可以操作一个 video 组件

videoContext 对象的方法列表:

方法 参数 说明 支持版本
play 播放
pause 暂停
stop 停止 1.7.0
seek position 跳转到指定位置,单位 s
sendDanmu danmu 发送弹幕,danmu 包含两个属性 text, color
playbackRate rate 设置倍速播放,支持的倍率有 0.5/0.8/1.0/1.25/1.5 1.4.0
requestFullScreen 进入全屏,可传入{direction}参数(1.7.0起支持),详见video组件文档 1.4.0
exitFullScreen 退出全屏 1.4.0
showStatusBar 显示状态栏,仅在iOS全屏下有效 2.1.0
hideStatusBar 隐藏状态栏,仅在iOS全屏下有效 2.1.0
<view class="section tc">
  <video id="myVideo" src="http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400"   enable-danmu danmu-btn controls></video>
  <view class="btn-area">
    <input bindblur="bindInputBlur"/>
    <button bindtap="bindSendDanmu">发送弹幕</button>
  </view>
</view>
function getRandomColor () {
  let rgb = []
  for (let i = 0 ; i < 3; ++i){
    let color = Math.floor(Math.random() * 256).toString(16)
    color = color.length == 1 ? '0' + color : color
    rgb.push(color)
  }
  return '#' + rgb.join('')
}
Page({
  onReady: function (res) {
    this.videoContext = wx.createVideoContext('myVideo')
  },
  inputValue: '',
  bindInputBlur: function(e) {
    this.inputValue = e.detail.value
  },
  bindSendDanmu: function () {
    this.videoContext.sendDanmu({
      text: this.inputValue,
      color: getRandomColor()
    })
  }
})

相机组件控制

wx.createCameraContext(this)

创建并返回 camera 上下文 cameraContext 对象,cameraContext 与页面的 camera 组件绑定,一个页面只能有一个camera,通过它可以操作对应的 组件。 在自定义组件下,第一个参数传入组件实例this,以操作组件内 组件

cameraContext

cameraContext 对象的方法列表:

方法 参数 说明
takePhoto OBJECT 拍照,可指定质量,成功则返回图片
startRecord OBJECT 开始录像
stopRecord OBJECT 结束录像,成功则返回封面与视频

takePhoto 的 OBJECT 参数列表:

参数 类型 必填 说明
quality String 成像质量,值为high, normal, low,默认normal
success Function 接口调用成功的回调函数 ,res = { tempImagePath }
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

startRecord 的 OBJECT 参数列表:

参数 类型 必填 说明
timeoutCallback Function 超过30s或页面onHide时会结束录像,res = { tempThumbPath, tempVideoPath }
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

stopRecord 的 OBJECT 参数列表:

参数 类型 必填 说明
success Function 接口调用成功的回调函数 ,res = { tempThumbPath, tempVideoPath }
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

实时音视频

wx.createLivePlayerContext(domId, this)

操作对应的 组件。 创建并返回 live-player 上下文 LivePlayerContext 对象。在自定义组件下,第二个参数传入组件实例this,以操作组件内 组件。基础库 1.7.0 开始支持,低版本需做兼容处理

livePlayerContext

livePlayerContext 对象的方法列表:

方法 参数 说明 支持版本
play OBJECT 播放
pause OBJECT 暂停 1.9.90
stop OBJECT 停止
mute OBJECT 静音
resume OBJECT 恢复 1.9.90
exitFullScreen OBJECT 退出全屏
requestFullScreen OBJECT 进入全屏

requestFullScreen 的 OBJECT 参数列表:

参数 类型 必填 说明
direction Number 有效值为 0(正常竖向), 90(屏幕逆时针90度), -90(屏幕顺时针90度)
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

其他方法的 OBJECT 参数列表:

参数 类型 必填 说明
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

wx.createLivePusherContext()

创建并返回 live-pusher 上下文 LivePusherContext 对象,LivePusherContext 与页面的 组件绑定,一个页面只能有一个 live-pusher,通过它可以操作对应的 组件。 在自定义组件下,第一个参数传入组件实例this,以操作组件内 组件

livePusherContext

livePusherContext 对象的方法列表:

方法 参数 说明 支持版本
start OBJECT 播放推流
pause OBJECT 暂停推流
stop OBJECT 停止推流
resume OBJECT 恢复推流
switchCamera OBJECT 切换前后摄像头
snapshot OBJECT 快照 1.9.90
toggleTorch OBJECT 切换闪光灯 2.1.0

所有方法的 OBJECT 参数列表:

参数 类型 必填 说明
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

动态加载字体

wx.loadFontFace(OBJECT)

动态加载网络字体,文件地址需为下载类型。IOS下仅支持https格式文件地址。基础库 2.1.0 开始支持,低版本需做兼容处理

OBJECT参数说明:

参数 类型 必填 说明
family String 定义的字体名称
source String 字体资源的地址
desc Object 可选的字体描述符
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

desc参数说明:

字段 说明
style normal / italic / oblique 定义字体的样式,默认是"normal"
weight normal / bold / 100 / 200../ 900 定义字体的粗细,默认是"normal"
variant normal / small-caps / inherit 设置小型大写字母的字体显示文本,默认是"normal "
wx.loadFontFace({
  family: 'Bitstream Vera Serif Bold',
  source: 'url("https://sungd.github.io/Pacifico.ttf")',
  success: function(res) {
    console.log(res.status) //  loaded
  },
  fail: function(res) {
    console.log(res.status) //  error
  },
  complete: function(res) {
    console.log(res.status);
  }
});

tip:引入的外部字体资源,建议格式为TTF和WOFF,WOFF2在低版本的IOS上会不兼容

目录
相关文章
|
1月前
|
前端开发 小程序 API
【微信小程序】-- 使用 npm 包 - API Promise化(四十二)
【微信小程序】-- 使用 npm 包 - API Promise化(四十二)
|
2月前
|
存储 开发框架 小程序
社区每周丨小程序 CLI 1.8.10 版本上线及基础API新增接口(7.3-7.7)
社区每周丨小程序 CLI 1.8.10 版本上线及基础API新增接口(7.3-7.7)
42 0
|
2月前
|
小程序 安全 API
社区每周丨小程序基础API新增获取设备、系统等多个接口
社区每周丨小程序基础API新增获取设备、系统等多个接口
108 0
|
4月前
|
小程序 API 开发者
微信小程序授权登录流程以及应用到的API
微信小程序授权登录流程以及应用到的API
193 0
|
8天前
|
小程序 前端开发 API
小程序全栈开发中的RESTful API设计
【4月更文挑战第12天】本文探讨了小程序全栈开发中的RESTful API设计,旨在帮助开发者理解和掌握相关技术。RESTful API基于REST架构风格,利用HTTP协议进行数据交互,遵循URI、客户端-服务器架构、无状态通信、标准HTTP方法和资源表述等原则。在小程序开发中,通过资源建模、设计API接口、定义资源表述及实现接口,实现前后端高效分离,提升开发效率和代码质量。小程序前端利用微信API与后端交互,确保数据流通。掌握这些实践将优化小程序全栈开发。
|
2月前
|
小程序 API
小程序中用于跳转页面的5个api是什么?区别?
小程序中用于跳转页面的5个api是什么?区别?
|
3月前
|
缓存 开发框架 小程序
微信小程序(uniapp)api讲解
微信小程序(uniapp)api讲解
75 0
|
4月前
|
移动开发 小程序 JavaScript
【uniapp 小程序开发页面篇】代码编写规范 | 页面编写规范 | 小程序API
【uniapp 小程序开发页面篇】代码编写规范 | 页面编写规范 | 小程序API
111 0
|
8天前
|
小程序 前端开发 API
微信小程序全栈开发中的异常处理与日志记录
【4月更文挑战第12天】本文探讨了微信小程序全栈开发中的异常处理和日志记录,强调其对确保应用稳定性和用户体验的重要性。异常处理涵盖前端(网络、页面跳转、用户输入、逻辑异常)和后端(数据库、API、业务逻辑)方面;日志记录则关注关键操作和异常情况的追踪。实践中,前端可利用try-catch处理异常,后端借助日志框架记录异常,同时采用集中式日志管理工具提升分析效率。开发者应注意安全性、性能和团队协作,以优化异常处理与日志记录流程。
|
8天前
|
小程序 安全 数据安全/隐私保护
微信小程序全栈开发中的身份认证与授权机制
【4月更文挑战第12天】本文探讨了微信小程序全栈开发中的身份认证与授权机制。身份认证包括手机号验证、微信登录和第三方登录,而授权机制涉及角色权限控制、ACL和OAuth 2.0。实践中,开发者可利用微信登录获取用户信息,集成第三方登录,以及实施角色和ACL进行权限控制。注意点包括安全性、用户体验和合规性,以保障小程序的安全运行和良好体验。通过这些方法,开发者能有效掌握小程序全栈开发技术。

热门文章

最新文章