直播觀看小程式開發（僅直播影片播放）

播放介面

開發前準備

1.小程式微信開發者後台設定-開發設定-伺服器域名中設定 [request合法域名]

開始開發

1.獲取頻道直播播放地址

index.wxml

<view class="video-box">
    <live-player id="polyvLiveVideo" class="vp-v" src="{{video.src}}" autoplay></live-player>
</view>

index.js

//引用polyvlive.js
import PolyvLive from '../../utils/polyvlive.min.js';

// 设置频道信息
// 直播后台开发设置 - 开发者信息 userId(账号ID)
const liveUid = "xxx";
// 频道号
const liveVid = "xxx";

const polyvLive = new PolyvLive();

polyvLive.getVideo({
    uid: liveUid,
    vid: liveVid,
    // 日志统计: 场次ID
    forceSessionId: true,
    // 日志统计
    statistics: {
        // 观众账号
        param1: Date.now(),
        // 观众昵称
        param2: 'polyv'
    },
    success: (videoInfo) => {
        // 调用getVideo回调
    },
    onApiStatus: (status)=>{
        // 直播状态回调
    }
});

polyvLive.getLatestLiveUrl((videoInfo)=>{
    this.setPlayerSrc(videoInfo);
});

setPlayerSrc(videoInfo) {
    this.setData({
        video: {
            src: videoInfo.flvSrc,
            poster: videoInfo.poster
        }
    });
}

選項說明

uid

類型：String 說明：直播後台開發設定 - 開發者資訊 userId(帳號ID)

vid

類型：String 說明：直播頻道id

forceSessionId

類型：Boolean 說明：日誌統計是否包含場次id

statistics]()

類型：object 說明：播放日誌參數，可設定值並且直播後台觀看日誌查詢中顯示對應欄位名稱如下

success（videoInfo）

類型：Function 說明：獲取影片資訊成功時觸發 參數：videoInfo 參數類型：object 參數說明：

onApiStatus（status）

類型：Function 說明：獲取影片直播/結束狀態 參數：status 參數類型：String 參數說明：

3.銷毀播放器

//页面处理函数
onUnload() {
    polyvLive.destroy();
}

注意事項

使用live-player元件有類目限制，需要先通過類目審核 然後需要在小程式管理後台，「設定」-「介面設定」中自助開通該元件權限

sdk預設使用live-player元件，使用flv拉流地址

setPlayerSrc(videoInfo) {
    this.setData({
      video: {
        src: videoInfo.flvSrc, // videoInfo.flvSrc返回flv地址
        poster: videoInfo.poster
      }
    });
  }

如果所用小程式元件為video，則需要設定播放地址為m3u8

<view class="video-wrap">
    <view class="video-box">
        <video id="polyvLiveVideo" class="vp-v" src="{{video.src}}" controls autoplay></video>
    </view>
</view>

setPlayerSrc(videoInfo) {
    this.setData({
      video: {
        src: videoInfo.src, // videoInfo.src返回m3u8地址
        poster: videoInfo.poster
      }
    });
  }

小程式直播sdk下載