小程序直播插件接入 - 微信小程序

　　當下直播帶貨還是挺火的，對於直播項目理解拉流和推流基本就能搞定。之前小程序直播插件未開放的時候，當時是引入第三方直播服務進行做的；當下又有直播需求，這次便把小程序直播插件模塊體驗了下：小程序直播插件還是挺方便的，小程序直接開通引入就行，相比第三方省去了不少費用。當然嘍，各有各的好處，小程序插件對於某些引用場景還是有局限性的，看項目需求。具體小程序插件如何操作呢？

《1》首先微信公眾平台開通直播服務

　　  小程序直播插件交流專區

           小程序直播版本查看

《2》直播組件如何引入？

　　方式一：主包引入

"plugins": {
	"live-player-plugin": {
		//版本號
		"version": "1.1.2", 
		//直播組件appid
		"provider": "wx2b03c6e691cd7370" 
	}
}

　　方式二：分包引入

"subpackages": [
	{
		"plugins": {
			"live-player-plugin": {
				"version": "1.1.1", 
				"provider": "wx2b03c6e691cd7370"
			}
		}
	}
]

《3》直播組件如何引入？

　　a.使用 navigator 組件跳轉進入直播間　　

<navigator url="plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=8&custom_params={{customParams}}&open_share_ticket=1" class="image">直播組件測試</navigator>

　　b.使用編程式導航 navigateTo 方法跳轉進入直播間

//填寫具體的房間號，可通過下面【獲取直播房間列表】 API 獲取
let roomId = [直播房間id] 
//開發者在直播間頁面路徑上攜帶自定義參數（如示例中的path和pid參數）
//后續可以在分享卡片鏈接和跳轉至商詳頁時獲取，詳見【獲取自定義參數】、
//【直播間到商詳頁面攜帶參數】章節（上限600個字符，超過部分會被截斷）
let customParams = encodeURIComponent(JSON.stringify({ path: 'pages/index/index', pid: 1 })) 
wx.navigateTo({
    url: `plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=${roomId}&custom_params=${customParams}`
})

　　注意：開發時可以在管理平台創建直播間獲取room_id用於測試

通過上面三個步驟就接入了小程序直播插件了。

 

直播組件接口：

　　

 

 這些組件接口基本文檔上介紹的很詳細，下面具體只介紹下從分享卡片中進入獲取鏈接參數：

//app.js
let livePlayer = requirePlugin('live-player-plugin')
onShow(options) {
	//引入組件需設置open_share_ticket=1"。如：<navigator url="plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=8&custom_params={{customParams}}&open_share_ticket=1">
	//從微信群分享的卡片進入才有此參數
	console.log("微信群中打開shareTicket=", options.shareTicket)
	// 分享卡片入口場景才調用getShareParams接口獲取以下參數
	if (options.scene == 1007 || options.scene == 1008 || options.scene == 1044) {
		livePlayer.getShareParams().then(res => {
			//直播房間號
			console.log('房間號room_id=', res.room_id)
			//用戶openid
			console.log('進入者openid=', res.openid)
			//分享者openid，分享卡片進入場景才有
			console.log('分享者share_openid=', res.share_openid)
			//開發者在跳轉進入直播間頁面時，頁面路徑上攜帶的自定義參數，這里傳回給開發者
			console.log('開發者自定義參數custom_params=', res.custom_params)
		}).catch(err => {
			console.log('get share params', err)
		})
	}
}

　　對於直播間里的貨架商品跳轉到商家小程序的商品詳情頁或點擊直播間左上角首頁icon跳轉到商家小程序的首頁時，可通過頁面的周期函數onLoad(options)里獲取房間號、用戶openid、分享者share_openid（如果是從分享卡片進入直播間再跳轉到商詳頁才有該參數）、開發者攜帶的自定義參數custom_params

 

服務端接口：

　直播間管理接口：

　　

 　直播商品管理接口：

　　

 

 　　對於一些只針對小程序直播的開發需求理由小程序直播插件基本就可以了，可以拉流推流，可以對商品進行管理，還減少了開發成本。

　　

　　對於分享直播間碼，顯示頁面不存在解決辦法：

　　　　https://developers.weixin.qq.com/miniprogram/dev/framework/liveplayer/other-abilities.html

　　　　小程序引入直播組件后必須進行一次小程序發布上線，否則直播間的小程序碼不生效，具體表現是用戶掃碼進入直播間會顯示“頁面不存在”。

　　　　在 MP 小程序直播后台創建好直播間后，可以直接拿到直播間分享小程序碼，無需額外開發