npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

live-service-sdk-wx

v1.3.53

Published

> SDK说明: </br> >+ api所在包 live-service-sdk</br> >+ 直播间客户端类所在包 live-service-client-sdk</br> >+ 每个直播间对应一个客户端实例,切换到另一个直播间,需要用该直播间ID重新new一个LiveClient来使用

Downloads

3

Readme

SDK说明:

  • api所在包 live-service-sdk
  • 直播间客户端类所在包 live-service-client-sdk
  • 每个直播间对应一个客户端实例,切换到另一个直播间,需要用该直播间ID重新new一个LiveClient来使用
  • 安装直播间客户端SDK

npm install live-service-client-sdk yarn add live-service-client-sdk

依赖的包 agora-rtm-sdk , agora-rtc-sdk-ng 没有自动安装就需要自己安装一下

  • 安装api SDK

npm install live-service-sdk yarn add live-service-sdk

  • 引入 api和直播间客户端类
import { LiveClient } from 'live-service-client-sdk';
import { api } from 'live-service-sdk';
  • api获取直播间信息(主播、观众)
const appid = '343099033251876864'; //从后台配置获取,比如weber,宝源后台
const list = api.getLives(appid);
const liveId = list[0].id;// 选择某个直播
const live=api.getLive(liveId);// 获取直播间详情数据
  • 创建客户端(主播、观众)
import { LiveModel } from './LiveModel';

const live = { id: 'xxx'} as LiveModel;
const client = new LiveClient(live);

原先创建客户端方式 const client = new LiveClient(live, (live) => api.getToken(live.id));

  • 设置当前用户信息(如果未登录就不用设置)
 liveClient.setUserInfo({
  name: '聂国玉',
  avatar: 'http://xxxxxx', // 用户头像,可没有
  bizUid: 'xxxx', // 业务用户id,可没有,可以填商家id,会员id等
  role: 'audience', // host主播 audience观众
});
  • 加入直播间(主播、观众)
client.join();
  • 主播开播(主播,前提是需要有摄像头以及部署了https)
client.publish().then(
([audioTrack, videoTrack]) => {
    // 主播播放本地流
    audioTrack.play();// 主播播放本地音频流
    videoTrack.play('player'); // 主播播放本地视频流 player可以是id| HTMLElement,sdk将在这个元素上插入video标签
});
  • 监听主播发布流事件(观众),播放
client.on('user-published', (event, { user, mediaType }) => {
    console.log('接收到音视频流');
    // 订阅远端流,这是异步操作,订阅完成后再调用play,将流显示到界面上
    liveClient.subscribe(user, mediaType).then(() => {
        if (mediaType === 'video') {
           user.videoTrack.play('player');// 观众播放视频流 player可以是id| HTMLElement,sdk将在这个元素上插入video标签
        } else {
           user.audioTrack.play();// 观众播放音频流,不需要提供dom元素
        }
    });
});
  • 发消息(主播、观众)
client.sendChannelMessage('直播间消息测试');
  • 收消息(主播、观众)
client.on('ChannelMessage', (event, customMessage:CustomMessage) => {
    console.log('收到直播间消息',
    `直播间频道:${customMessage.channel}`,
    `发送人:${customMessage.sendMemberId}`,
    `时间:${customMessage.receivedTs}`,
    `发送人是否自己:${customMessage.isSelf}`,
    `消息文本:${(customMessage.message as RtmTextMessage).text}`,
    '用户名:'+customMessage.userInfo?customMessage.userInfo.name:'临时用户',
    '用户头像:'+customMessage.userInfo?customMessage.userInfo.avatar:'');
});
  • 离开直播间(主播、观众)
client.left();
  • 进出直播间事件
client.on('MemberJoined', async (event, { memberId }) => {
  console.log(`${memberId}进入直播间`);
});
client.on('MemberLeft', (event, { memberId }) => {
  console.log(`${memberId}离开直播间`);
});
  • 直播间所有人员
const members:string[] = await client.getMembers();
console.log('直播间成员列表', members);
  • api多语言支持
import { api} from 'live-service-sdk';
  • 获取当前设置的语言
 const lang:string=api.getLang();//'zh'|'cht'|'en'|'jp'
  • 设置语言
 api.setLang('zh');//设置为简体中文

设置后详情、列表查询接口的name,describe字段会返回对应语言数据

  • 获取api支持的语言列表
const langs=api.langDic();

['zh', '简体'],['cht', '繁體'],['en', 'English'],['jp', '日本語'],

  • 查询条件

直播列表和预告列表支持查询条件设置

import { api} from 'live-service-sdk';
const queryOptions:QueryModel={
    filter: new Map<string, any>([//字段查询条件
    ['appid', 'xxxxxx'],
    ]),
    sort:['updated_at'],  //排序
    page:{                //分页
        size:20,
        number:1,
    },    
    include:['stream','trailer'], //查询带回推流、预告子表数据
};
const lives=await api.getLives(queryOptions);
const trailers=await api.getTrailers(queryOptions);
  • 客户端互动操作
    • 点赞
  //主动点赞
import { ActionEnum } from './ActionEnum';
let zan_total =await client.zan();
console.log('接收到最新点赞数',zan_total);
// 监听互动操作
client.on('CustomAction',(event,action)=>{
    switch (action.action){
      case ActionEnum.ZAN:// 监听到点赞
        const zanObj=JSON.parse(action.payload);
        console.log('接收到最新点赞数',zanObj.zan_total);
    }
});

可能会出现拿到zan_total比本地的小,所以应该跟本地的zan_total比较,保留值大的那个

  • 客户端事件回调,按需使用
// 监听客户端异常
import { Action } from './Action';
client.on('exception', (event, {
  code,
  msg,
  uid,
}) => {
  console.error(msg);
});
// 监听客户端连接的网络质量
client.on('network-quality', (event, {
  quality,
  dStr,
  uStr,
}) => {
  console.log(`网络质量 ↓:${dStr} ↑:${uStr}`);
});
// 有用户进入直播间
client.on('MemberJoined', (event, { memberId }) => {
  console.log(memberId);
});
// 有用户离开直播间
client.on('MemberLeft', (event, { memberId }) => {
  console.log(memberId);
});
// 监听互动操作
client.on('CustomAction', async (event, action:Action)=>
    {
      switch (action.action) {
        case ActionEnum.ZAN:// 监听到点赞
          const zanObj = JSON.parse(action.payload);
          console.log('接收到最新点赞数', zanObj.zan_total);
          break;
        case ActionEnum.UPDATE_WATCH:// 监听到观众数更新
          const watchObj = JSON.parse(action.payload) as any;
          console.log('直播间当前人数', watchObj.watch_total);
          break;
        case ActionEnum.UPDATE_GOODS:// 监听到商品列表更新
          // eslint-disable-next-line no-case-declarations
          const goodslist = (await api.getGoods(id)) as any[];
          // eslint-disable-next-line no-case-declarations
          const ids = [] as string[];
          goodslist.forEach((goods) => {
            ids.push(goods.attach_id as string);
          });
          console.log('直播间商品列表更新了', ids);// ids='商品唯一标识1,商品唯一标识2';
          break;
        case ActionEnum.PUSH_GOODS:// 监听到商品推送
          const pushGoods = JSON.parse(action.payload) as any;
          console.log('直播间推送了商品', pushGoods.skuid);
          break;
        case ActionEnum.MEMBER_JOINED:// 监听到观众进入 在线人数更新
          // eslint-disable-next-line no-case-declarations
          onlineObj = JSON.parse(action.payload) as any;
          state.online_total = onlineObj.online_total;
          alert(`欢迎 ${action.userInfo.name}`);
          break;
        case ActionEnum.MEMBER_LEFT:// 监听到观众离开 在线人数更新
          // eslint-disable-next-line no-case-declarations
          onlineObj = JSON.parse(action.payload) as any;
          state.online_total = onlineObj.online_total;
          break;
        case ActionEnum.MEMBER_UNSPEAK:// 监听到观众被禁言 显示后判断是否为当前观众
          // eslint-disable-next-line no-case-declarations
          unspeakUser = JSON.parse(action.payload) as any;
          alert(`${action.unspeakUser.name} 被禁言`);
          if(client.getUserInfo().uid===unspeakUser.uid){
            alert('您被禁言');
          }
          break;
        case ActionEnum.MEMBER_BLOCK:// 监听到观众被拉黑 显示后判断是否为当前观众
          blockUser = JSON.parse(action.payload) as any;
          alert(`${action.blockUser.name} 被拉黑`);
          if(client.getUserInfo().uid===blockUser.uid){
            alert('您被拉黑,去看看别的直播间吧');
            setTimeout(client.left(),20*1000);// 离开直播间
            // 离开当前播放页面
          }
          break;
        default: break;
      }
    }
);
// 主播停止发布 视频/音频 流
client.on('user-unpublished', (event, { user, mediaType }) => {
  console.log('主播停止发布流');
});
  • 预告列表
import { api} from 'live-service-sdk';
const trailers=await api.getTrailers() // 预告列表
const trailer=await api.getTrailer(trailers.data[0]) // 获取第0条预告详情
  • 统计
import { api} from 'live-service-sdk';
// 点击分享的时候
api.updateShare(live_id);
// 点击商品的时候
api.updateGoodsClick(live_id);

1.2.0更新 主要是去除服务实例的相关接口修改以及自定义url 去除 api.getApps()等跟服务实例相关接口 预告列表接口修改 api.getTrailers(appid,queryOptions) 改为api.getTrailers(queryOptions) 直播列表接口修改 api.getLives(queryOptions) 去除filter[app_id]条件

一次性设置url api.setBaseUrl('http://xxxx'); 也可以在接口参数里指定单个接口的url跟路径

所有接口最后面添加了一个url参数 api.getLives(queryOptions) 改为 api.getLives(queryOptions,url)