8.2.6 视频

视频功能，在平时的项目开发中也是时常会用到的，本节将阐述视频播放、停止等视频控制API。

wx.chooseVideo(OBJECT)

拍摄视频或从手机相册中选视频，返回视频的临时文件路径。 OBJECT参数说明，如表8-20所示：

表8-20

返回参数说明，如表8-21所示：

表8-21

示例代码：

wxml中：

<View>1.播放网络视频</View>
<view>
  <video style="width: 100%;height=400px;margin:1px;" src="https://xxxx.xxxx.com/xxxx"
  binderror="videoErrorCallback"></video>
</view>
<View>2.播放本地视频</View>
<view style="display: flex;flex-direction: column;">
  <video style="width: 100%;height=400px;margin:1px;" src="{{src}}"></video>
  <view class="btn-area">
    <button bindtap="bindButtonTap">打开本地视频</button>
  </view>
</view>

js中：

Page({
  data: {
    src: ''
  },
  onLoad: function (options) {
    // 页面初始化 options为页面跳转所带来的参数
  },
  onReady: function () {
    // 页面渲染完成
  },
  onShow: function () {
    // 页面显示
  },
  onHide: function () {
    // 页面隐藏
  },
  onUnload: function () {
    // 页面关闭
  },
  /**
  * 打开本地视频
  */
  bindButtonTap: function () {
    var that = this
    //拍摄视频或从手机相册中选视频
    wx.chooseVideo({
      //album 从相册选视频，camera 使用相机拍摄，默认为：['album', 'camera']
      sourceType: ['album', 'camera'],
      //拍摄视频最长拍摄时间，单位秒。最长支持60秒
      maxDuration: 60,
      //前置或者后置摄像头，默认为前后都有，即：['front', 'back']
      camera: ['front', 'back'],
      //接口调用成功，返回视频文件的临时文件路径，详见返回参数说明
      success: function (res) {
        console.log(res.tempFilePaths[0])
        that.setData({
          src: res.tempFilePaths[0]
        })
      }
    })
  },
  /**
   * 当发生错误时触发error事件，event.detail = {errMsg: 'something wrong'}
   */
  videoErrorCallback: function (e) {
    console.log('视频错误信息:')
    console.log(e.detail.errMsg)
  }
})

运行效果如图8-4所示：

图8-4 视频API示例运行效果图

注意:

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