直播电商源码，如何实现小程序的开发

阅读：评论：0

直播电商源码，如何实现小程序的开发

申请开通小程序直播

1、直播电商源码申请小程序直播有以下几个硬性指标：

1. 满足小程序18个开放类目
2. 主体下小程序近半年没有严重违规
3. 小程序近90天内有过支付行为
4. 主体下公众号累计粉丝数大于100人
5. 主体下小程序连续7日日活跃用户数大于100人
6. 主体在微信生态内近一年广告投放实际消费金额大于1万元

注：条件1、2、3为必须满足，4、5、6为满足其中一项即可

2、登录微信公众平台，提交申请开通直播电商源码

左侧菜单栏找到直播，即可申请。

小程序接入直播组件

1、引入直播电商源码组件

支持在主包或分包内引入【直播组件】 live-player-plugin 代码包（注：直播组件不计入代码包体积），项目根目录的 app.json 引用

（1）主包引入

"plugins": {"live-player-plugin": {"version": "1.1.10", // 注意填写该直播组件最新版本号，微信开发者工具调试时可获取最新版本号（复制时请去掉注释）"provider": "wx2b03c6e691cd7370" // 必须填该直播组件appid，该示例值即为直播组件appid（复制时请去掉注释）}
}

（2）分包引入

"subpackages": [{"plugins": {"live-player-plugin": {"version": "1.1.10", // 注意该直播组件最新版本号，微信开发者工具调试时可获取最新版本号（复制时请去掉注释）"provider": "wx2b03c6e691cd7370" // 必须填该直播组件appid，该示例值即为直播组件appid（复制时请去掉注释）}}}
]

2、获取直播电商源码列表
通过调用接口进行获取，接口详情

下面是使用C#请求此接口的示例

 public string JsCode2Session(){string appid = XXX;string secret = XXX;string JsCode2SessionUrl = "=client_credential&appid={0}&secret={1}";var url = string.Format(JsCode2SessionUrl, appid, secret);var str = HttpHelper.HttpGet(url);try{var jo = JsonHelper.ToJObject(str);string access_token = jo["access_token"].ToString();return access_token;}catch (Exception ex){return "";}}[HttpGet]public async Task<TData<List<RoomInfo>>> GetLivePlayer(){string url = "={0}";string token = JsCode2Session();url = string.Format(url, token);var postData = new QueryArgs{start = 0,limit = Int32.MaxValue};string result = HttpHelper.HttpPost(url, Newtonsoft.Json.JsonConvert.SerializeObject(postData));List<RoomInfo> roomInfos = new List<RoomInfo>();TData<List<RoomInfo>> obj = new TData<List<RoomInfo>>();if (!string.IsNullOrEmpty(result)){var json = JsonHelper.ToJObject(result);var error = json["errcode"].ToString();if (error == "0"){roomInfos = JsonHelper.ToObject<List<RoomInfo>>(json["room_info"].ToString());                    obj.Result = roomInfos;obj.TotalCount = roomInfos.Count;obj.Tag = 1;}else{obj.TotalCount = 0;obj.Message = json["errmsg"].ToString();obj.Tag = 0;}}return obj;}//房间信息public class RoomInfo{public string name { get; set; }public string roomid { get; set; }public string cover_img { get; set; }public string share_img { get; set; }public LiveStatus live_status { get; set; }public string start_time { get; set; }public string end_time { get; set; }public string anchor_name { get; set; }public int total { get; set; }}//直播状态public enum LiveStatus{直播中 = 101,未开始,已结束,禁播,暂停,异常,已过期}

通过调用GetLivePlayer接口即可获取直播间列表。

3、使用直播电商源码组件

（1）在wxml页面遍历所有直播

<block wx:for="{{liveList}}" wx:key="{{title}}"><view style="width:350rpx" bindtap="tolive" data-roomid="{{id}}" class="recommend_sp_img"><image class="image1" src="{{ver_img}}" mode="aspectFill"></image><text class="shiping">{{item.name}}</text></view>
</block>

（2）在js页面进行跳转

tolive:function(e){console.log(e)let roomId = e.idwx.navigateTo({url: `plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=${roomId}`})}