Udesk即时通讯网页插件发送咨询对象（三、使用信息区）

作者：张振琦

《Udesk即时通讯网页插件发送咨询对象（一、使用内嵌代码）》
《Udesk即时通讯网页插件发送咨询对象（二、使用专用链接）》

前两篇介绍了如何使用内嵌代码和专用链接发送咨询对象，本篇来介绍如何使用信息区来实现这个功能，信息区实现的效果更加完美，而且信息区还有发送消息的功能，是不是有点小惊喜?

信息区如何使用，可以参考下面的文章：
《Udesk即时通讯网页插件：窗口设置（五、信息区设置）》

信息区是以iframe的形式展示到即时通讯网页插件内的，这样就可以使用window.parent.postMessage方法，由子页面向父页面进行通讯，Udesk即时通讯网页插件实现了对message的解析，提供两种功能，也就是发送商品消息和发送文本消息。

参数说明

参数名称	类型	值	是否必填	说明
method	String	‘sendMsg’	是	方法名称,目前只支持sendMsg
type	String	‘text’ or ‘product’	是	消息类型: 文本消息 或 商品消息
content	String\Object		是	消息内容

客服聊天界面: 可以发送文本消息和商品消息
机器人聊天界面: 只支持发送文本消息

调用示例

1. 文本消息

var data = JSON.stringify({
   
        method: "sendMsg",   // 固定method
        type: "text",        // 固定type
        content:  “xxx”      // 需要发送的消息
    });
var origin = "*";
window.parent.postMessage(data, origin);

2. 商品消息

content对象参数说明

参数名称	类型	是否必选	说明
name	String	是	商品名称
url	String	否	商品跳转链接(新页显示)，如果值为空，则不能点击
imgUrl	String	否	如果值为空，则不显示
params	Object	否	参数列表
params.text	String	否	参数文本
params.color	String	否	参数颜色值，规定为十六进制值的颜色（比如 #ff0000）
params.break	Boolean	否	是否换行
params.size	Number	否	字体大小

 var data = JSON.stringify({
   
        method: "sendMsg",      // 固定method
        type: "product",        // 固定type
        content: {
                 // 商品消息格式
            name: "Apple iPhone X (A1903) 64GB 深空灰色 移动联通4G手机",
            url: "https://item.jd.com/6748052.html",
            imgUrl: "http://img12.360buyimg.com/n1/s450x450_jfs/t10675/253/1344769770/66891/92d54ca4/59df2e7fN86c99a27.jpg",
            params: [{
   
                text: "￥6999.00",
                color: "#FF0000",
                break: false,
                size: 12
            }, {
   
                text: "满1999元另加30元"
            }]
        }
    });
var origin = "*";
window.parent.postMessage(data, origin