跳转至

动态表情

表情包:表情包下包含一组表情,可同时存在多个表情包

表情:具体的动态表情,表情一定归属于一个表情包

兼容性

支持浏览器范围: IE6+、Chrome、FireFox、Safari、iOS Safari、Android4.0+ 浏览器

使用示例

动态表情https://rongcloud.github.io/websdk-demo/sticker/sticker.html

IM 收发表情https://rongcloud.github.io/websdk-demo/sticker/message.html

RequireJShttps://rongcloud.github.io/websdk-demo/sticker/require.html

引入方式

<!-- HTTP -->
<script src="http://cdn.ronghub.com/rong-sticker-1.0.0.js"></script>
<!-- HTTPS -->
<script src="https://cdn.ronghub.com/rong-sticker-1.0.0.js"></script>
<!-- 压缩版 -->
<script src="https://cdn.ronghub.com/rong-sticker-1.0.0.min.js"></script>
require.config({
  paths: {
    RongSticker: 'http[s]://cdn.ronghub.com/rong-sticker-1.0.0[.min]'
  }
});
require(['RongSticker'], function(RongSticker) {
  // 用法请参考: https://github.com/rongcloud/websdk-demo/sticker/sticker.html
});

初始化

config 参数说明:

参数 类型 必填 说明 最低版本
appkey String 应用的唯一标识,创建应用请移步 开发者后台 1.0.0
url String 表情包获取服务地址 1.0.0
extensions Array 扩展消息包 1.0.0

默认初始化示例:

var config = {
  appkey: 'appkey'
};
var rongSticker = RongSticker.init(config);

扩展包初始化示例:

var extensions = [{
  // 表情包 Id
  id: "c60plBGwk2686yv4vmv4H9",
  name: "嗨宝宝",  
  desc: "融云自制表情嗨宝宝",
  icon: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/icon_c60plBGwk2686yv4vmv4H9.png",
  poster: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/cover_c60plBGwk2686yv4vmv4H9.png",
  order: 1,
  author: "rongcloud",
  copyright: "rongcloud",
  // 表情列表
  stickers: [{
    id: "c60plBGwk2686yv4vmv4H9",
    name: "嗨宝宝",  
    desc: "融云自制表情嗨宝宝",
    icon: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/icon_c60plBGwk2686yv4vmv4H9.png",
    poster: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/cover_c60plBGwk2686yv4vmv4H9.png",
    order: 1,
    author: "rongcloud",
    copyright: "rongcloud"
  }]
}];
var config = {
  appkey: 'appkey',
  extensions: extensions
};
var rongSticker = RongSticker.init(config);

表情包列表

参数说明:

参数 类型 必填 说明 最低版本
callback Function 回调函数,用来接收数据 1.0.0
var config = {
  appkey: 'appkey'
};
var rongSticker = RongSticker.init(config);
var Package = rongSticker.Package;
Package.getList(function(result, error){
  // result.packages => 表情包列表
  // error => 错误信息,正常返回时 error 为 null
});

packages 结构示例:

[
  {
    id: "c60plBGwk2686yv4vmv4H9",
    name: "嗨宝宝",  
    desc: "融云自制表情嗨宝宝",
    icon: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/icon_c60plBGwk2686yv4vmv4H9.png",
    poster: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/cover_c60plBGwk2686yv4vmv4H9.png",
    order: 1,
    author: "rongcloud",
    copyright: "rongcloud"
  }
]

表情列表

package 参数说明:

参数 类型 必填 说明 最低版本
id String 表情包 id 1.0.0
var config = {
  appkey: 'appkey'
};
var rongSticker = RongSticker.init(config);
var Sticker = rongSticker.Sticker;
var package = {
  id: 'c60plBGwk2686yv4vmv4H9'
};
Sticker.getList(function(result, error){
  // result.stickers => 表情列表
  // error => 错误信息,正常返回时 error 为 null
});

stickers 结构示例:

[
  {
    packageId: "c60plBGwk2686yv4vmv4H9"
    stickerId: "d1PN1xTZ47p9nfMNWfGpyH",
    desc: "木问题",
    url: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/image_d1PN1xTZ47p9nfMNWfGpyH.gif",
    thumbUrl: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/thumb_d1PN1xTZ47p9nfMNWfGpyH.png",
    height: 240,
    width: 240,
    order: 1
  }
]

获取表情

stciker 参数说明:

参数 类型 必填 说明 最低版本
packageId String 表情包 Id 1.0.0
stickerId String 表情 Id 1.0.0
var config = {
  appkey: 'appkey'
};
var rongSticker = RongSticker.init(config);
var Sticker = rongSticker.Sticker;

var sticker = {
  packageId: 'c60plBGwk2686yv4vmv4H9',
  stickerId: 'd1PN1xTZ47p9nfMNWfGpyH'
};
Sticker.get(function(sticker, error){
  // sticker => 表情
  // error => 错误信息,正常返回时 error 为 null
});

sticker 结构示例:

{
  packageId: "c60plBGwk2686yv4vmv4H9"
  stickerId: "d1PN1xTZ47p9nfMNWfGpyH",
  desc: "木问题",
  url: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/image_d1PN1xTZ47p9nfMNWfGpyH.gif",
  thumbUrl: "http://sticker.ronghub.com/c60plBGwk2686yv4vmv4H9/thumb_d1PN1xTZ47p9nfMNWfGpyH.png",
  height: 240,
  width: 240,
  order: 1
}