自定义客服消息(坐席发给访客)

环信自定义消息API允许客户在坐席工作台加载自己的消息编辑页面，按照环信自定义消息的格式发送包含图文和链接的消息给访客，从而实现从坐席到访客的产品介绍，订单消息等丰富内容的可扩展消息。

第1步： 管理员登录并进入管理员模式后，选择“设置→在线客服→功能设置→客服→工作台→自定义消息”，填入自定义消息页面的 URL并保存。

第2步： 在管理员模式下选择“设置→扩展集成→iframe窗口”，添加一个新的iframe窗口，维护地址并保存即可

坐席使用说明

1. 启用自定义消息功能后，在会话工作台右侧的iframe窗口区域，会自动加载客户在管理面板设置的自定义消息页面（坐席可手动拖拽iframe页签出现的先后顺序）。
2. 在编辑页面编辑消息，并确认发送后，消息会直接发送给访客，并显示在客服人员的聊天记录窗口中。

通过 JS 调用 window.parent.postMessage(object, “*”) 发送消息，其中”object”是json格式的消息体，请参考下面的消息格式。接口使用可以参考MDN Web API文档

消息体为json格式：

//坐席给访客发送纯文本类型消息
var standardData = {
	easemob: {
		kefu: {
			sendMsg: {
				msg: "我是纯文本消息", //访客端上屏文字
				type: "txt"  //消息类型，txt代表纯文本
			}
		}
	}
};
window.parent.postMessage(standardData, "*")

消息体为json格式：

//坐席给访客发送简单的富文本类型消息
var standardData = {
	easemob: {
		kefu: {
			sendMsg: {
				msg: "[{\"type\":\"richText\",\"content\":\"<p>您是否要咨询订单号为<strong style='color:red;'>DDH20240818244221</strong>的订单</p></div>\"}]",
				type: "txt"
				}
			}
		}
	};
	window.parent.postMessage(standardData, "*")

消息体为json格式：

//坐席给访客发送富文本菜单列表/按钮类型消息，仅限于H5渠道可以使用，且msg里不可包含js逻辑
var standardData = {
	easemob: {
		kefu: {
			sendMsg: {
				msg: "[{\"type\":\"richText\",\"content\":\"<div class='dh_rich_text'><p>您是否要咨询以下订单？</p><p>订单号：DDH20240818244221</p><p>订单名字：Ins风蓝色女性手链</p><p>价格：25元</p><ul class='dh_option_list' style='display: block;'><li><a style='color: #fff;background: #009889;display: block; border-radius: 5px; text-align: center;margin-top: 5px;' name='是'>是</a></li><li><a style='color: #fff;background: #009889;display: block; border-radius: 5px; text-align: center;margin-top: 5px;' name='其他订单'>其他订单</a></li></ul></div>\"}]",
				type: "txt"
			}
		}
	}
};
window.parent.postMessage(standardData, "*")

消息体为json格式：

//坐席给访客发送图文类型消息
var standardData = {
	easemob: {
		kefu: {
			articles: [{
				title: "Title",
				description: "Description",
				url: "URL",
				picurl: "PIC_URL"
			}]
		}
	}
};
window.parent.postMessage(standardData, '*');

消息体为json格式：

var standardData = {
	easemob: {
		kefu: {
			miniprogrampage: {
				title: "Title",
                pagePath:"pagePath",
                thumbMediaId:"thumbMediaId",
                thumbUrl:"thumbUrl"
			}
		}
	}
};
window.parent.postMessage(standardData, '*');