社区 学习 工具库 休闲
搜索
简体中文
首页 > 后端开发 > php教程 > 微信公众平台开发(97) 图文消息_PHP教程

微信公众平台开发(97) 图文消息_PHP教程

WBOY
发布： 2016-07-13 10:27:29
原创
926 人浏览过

关键字：微信公众平台 开发模式 图文消息
作者：方倍工作室
原文：http://www.cnblogs.com/txw1958/p/weixin-97-news.html

 

在这篇微信公众平台开发教程中，我们将介绍如何灵活的使用图文消息功能。我们将只介绍被动回复消息中的图文消息，发送客服消息及高级群发消息接口的发送的图文消息与本文介绍的图文消息的各情况基本一致。

本文分为以下四个部分：

 

一、图文消息的定义

在微信公众平台消息中，发送被动响应消息中的图文消息的XML结构如下所示。

<span><</span><span>xml</span><span>></span>
    <span><</span><span>ToUserName</span><span>></span><span><![CDATA[</span><span>toUser</span><span>]]></span><span></</span><span>ToUserName</span><span>></span>
    <span><</span><span>FromUserName</span><span>></span><span><![CDATA[</span><span>fromUser</span><span>]]></span><span></</span><span>FromUserName</span><span>></span>
    <span><</span><span>CreateTime</span><span>></span>12345678<span></</span><span>CreateTime</span><span>></span>
    <span><</span><span>MsgType</span><span>></span><span><![CDATA[</span><span>news</span><span>]]></span><span></</span><span>MsgType</span><span>></span>
    <span><</span><span>ArticleCount</span><span>></span>2<span></</span><span>ArticleCount</span><span>></span>
    <span><</span><span>Articles</span><span>></span>
        <span><</span><span>item</span><span>></span>
            <span><</span><span>Title</span><span>></span><span><![CDATA[</span><span>title1</span><span>]]></span><span></</span><span>Title</span><span>></span> 
            <span><</span><span>Description</span><span>></span><span><![CDATA[</span><span>description1</span><span>]]></span><span></</span><span>Description</span><span>></span>
            <span><</span><span>PicUrl</span><span>></span><span><![CDATA[</span><span>picurl</span><span>]]></span><span></</span><span>PicUrl</span><span>></span>
            <span><</span><span>Url</span><span>></span><span><![CDATA[</span><span>url</span><span>]]></span><span></</span><span>Url</span><span>></span>
        <span></</span><span>item</span><span>></span>
        <span><</span><span>item</span><span>></span>
            <span><</span><span>Title</span><span>></span><span><![CDATA[</span><span>title</span><span>]]></span><span></</span><span>Title</span><span>></span>
            <span><</span><span>Description</span><span>></span><span><![CDATA[</span><span>description</span><span>]]></span><span></</span><span>Description</span><span>></span>
            <span><</span><span>PicUrl</span><span>></span><span><![CDATA[</span><span>picurl</span><span>]]></span><span></</span><span>PicUrl</span><span>></span>
            <span><</span><span>Url</span><span>></span><span><![CDATA[</span><span>url</span><span>]]></span><span></</span><span>Url</span><span>></span>
        <span></</span><span>item</span><span>></span>
    <span></</span><span>Articles</span><span>></span>
<span></</span><span>xml</span><span>></span>
登录后复制

其参数说明如下.

参数是否必须说明
ToUserName 是 接收方帐号（收到的OpenID）
FromUserName 是 开发者微信号
CreateTime 是 消息创建时间 （整型）
MsgType 是 news
ArticleCount 是 图文消息个数，限制为10条以内
Articles 是 多条图文消息信息，默认第一个item为大图,注意，如果图文数超过10，则将会无响应
Title 否 图文消息标题
Description 否 图文消息描述
PicUrl 否 图片链接，支持JPG、PNG格式，较好的效果为大图360*200，小图200*200
Url 否 点击图文消息跳转链接

从中可以知道，图文消息的类型为news，图文消息个数最大为10（注意在编辑模式中，可以设置最大条数为8）。超过10条，微信将不再响应。

多图文消息中会有大图和小图的区别，第一个item中的图片为大图，其他item中的图片为小图。

二、图文消息的实现

根据上述定义，我们定义图文消息的回复代码实现如下：

    <span>//</span><span>回复图文消息</span>
    <span>private</span> <span>function</span> transmitNews(<span>$object</span>, <span>$newsArray</span><span>)
    {
        </span><span>if</span>(!<span>is_array</span>(<span>$newsArray</span><span>)){
            </span><span>return</span><span>;
        }
        </span><span>$itemTpl</span> = "<span>    <item>
        <Title><![CDATA[%s]]></Title>
        <Description><![CDATA[%s]]></Description>
        <PicUrl><![CDATA[%s]]></PicUrl>
        <Url><![CDATA[%s]]></Url>
    </item>
</span>"<span>;
        </span><span>$item_str</span> = ""<span>;
        </span><span>foreach</span> (<span>$newsArray</span> <span>as</span> <span>$item</span><span>){
            </span><span>$item_str</span> .= <span>sprintf</span>(<span>$itemTpl</span>, <span>$item</span>['Title'], <span>$item</span>['Description'], <span>$item</span>['PicUrl'], <span>$item</span>['Url'<span>]);
        }
        </span><span>$xmlTpl</span> = "<span><xml>
<ToUserName><![CDATA[%s]]></ToUserName>
<FromUserName><![CDATA[%s]]></FromUserName>
<CreateTime>%s</CreateTime>
<MsgType><![CDATA[news]]></MsgType>
<ArticleCount>%s</ArticleCount>
<Articles>
</span><span>$item_str</span><span></Articles>
</xml></span>"<span>;

        </span><span>$result</span> = <span>sprintf</span>(<span>$xmlTpl</span>, <span>$object</span>->FromUserName, <span>$object</span>->ToUserName, <span>time</span>(), <span>count</span>(<span>$newsArray</span><span>));
        </span><span>return</span> <span>$result</span><span>;
    }</span>
登录后复制

上述代码中，先将各item连接形成item_str，再将item_str赋值到xml模板中，组装一个图文消息。组装时，将object中的发送、接收方互换位置，计算出图文项的个数。

而在构造图文消息并使用图文回复的代码如下所示

<span>if</span> (<span>strstr</span>(<span>$keyword</span>, "单图文"<span>)){
    </span><span>$content</span> = <span>array</span><span>();
    </span><span>$content</span>[] = <span>array</span>("Title"=>"单图文标题",  "Description"=>"单图文内容", "PicUrl"=>"http://discuz.comli.com/weixin/weather/icon/cartoon.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
}</span><span>else</span> <span>if</span> (<span>strstr</span>(<span>$keyword</span>, "图文") || <span>strstr</span>(<span>$keyword</span>, "多图文"<span>)){
    </span><span>$content</span> = <span>array</span><span>();
    </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文1标题", "Description"=>"", "PicUrl"=>"http://discuz.comli.com/weixin/weather/icon/cartoon.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
    </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文2标题", "Description"=>"", "PicUrl"=>"http://d.hiphotos.bdimg.com/wisegame/pic/item/f3529822720e0cf3ac9f1ada0846f21fbe09aaa3.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
    </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文3标题", "Description"=>"", "PicUrl"=>"http://g.hiphotos.bdimg.com/wisegame/pic/item/18cb0a46f21fbe090d338acc6a600c338644adfd.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
}

</span><span>if</span>(<span>is_array</span>(<span>$content</span><span>)){
    </span><span>if</span> (<span>isset</span>(<span>$content</span>[0]['PicUrl'<span>])){
        </span><span>$result</span> = <span>$this</span>->transmitNews(<span>$object</span>, <span>$content</span><span>);
    }</span><span>else</span> <span>if</span> (<span>isset</span>(<span>$content</span>['MusicUrl'<span>])){
        </span><span>$result</span> = <span>$this</span>->transmitMusic(<span>$object</span>, <span>$content</span><span>);
    }
}</span><span>else</span><span>{
    </span><span>$result</span> = <span>$this</span>->transmitText(<span>$object</span>, <span>$content</span><span>);
}</span>
登录后复制

一个完整的体验代码可参考 微信公众平台开发接口PHP SDK完整版

三、图文消息的类型

图文消息从item的个数上来分，可以分为单图文消息和多图文消息，其中单图文消息中item数为1，多图文消息中item数从2~10都包括。

虽然图文消息只有两种类型，但其实可以通过设置不同的参数构造出更多的展示效果。

单图文消息

单图文消息就是一个图文消息。

下面代码定义一个基本的图文消息

<span>$content</span> = <span>array</span><span>();
</span><span>$content</span>[] = <span>array</span>("Title" =>"大学英语四六级成绩查询", 
                   "Description" =>"点击图片进入", 
                   "PicUrl" =>"http://365jia.cn/uploads/13/0301/5130c2ff93618.jpg", 
                   "Url" =>"http://israel.sinaapp.com/cet/index.php?openid=".<span>$object</span>->FromUserName);
登录后复制

它的回复效果如图所示。其特点是标题粗体显示，内容字体则为灰色显示，如果有图片，则同时显示日期。

再看一下不定义图片和链接时的情况，代码如下

<span>$aqiArray</span> = <span>array</span><span>(); 
</span><span>$aqiArray</span>[] = <span>array</span>("Title" =><span>$cityAir</span>[0]['area']."空气质量", 
                    "Description" =>"空气质量指数(AQI)：".<span>$cityAir</span>[0]['aqi']."\n".
                                    "空气质量等级：".<span>$cityAir</span>[0]['quality']."\n".
                                    "细颗粒物(PM2.5)：".<span>$cityAir</span>[0]['pm2_5']."\n".
                                    "可吸入颗粒物(PM10)：".<span>$cityAir</span>[0]['pm10']."\n".
                                    "一氧化碳(CO)：".<span>$cityAir</span>[0]['co']."\n".
                                    "二氧化氮(NO2)：".<span>$cityAir</span>[0]['no2']."\n".
                                    "二氧化硫(SO2)：".<span>$cityAir</span>[0]['so2']."\n".
                                    "臭氧(O3)：".<span>$cityAir</span>[0]['o3']."\n".
                                    "更新时间：".<span>preg_replace</span>("/([a-zA-Z])/i", " ", <span>$cityAir</span>[0]['time_point'<span>]); 
                    </span>"PicUrl" =>"", 
                    "Url" =>"");
登录后复制

其效果如下所示。

可以看到，这时，由于没有图片，所以也不显示日期了，另外没有带链接，所以“查看全文”也不显示了。

多图文

多图文消息一个最大的特点就是：描述内容不会在返回中显示，所以没有必要定义描述了。

下面是一个基本的多图文消息的定义

 <span>$content</span> = <span>array</span><span>();
</span><span>$content</span>[] = <span>array</span>("Title"=>"多图文1标题", "Description"=>"", "PicUrl"=>"http://discuz.comli.com/weixin/weather/icon/cartoon.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
</span><span>$content</span>[] = <span>array</span>("Title"=>"多图文2标题", "Description"=>"", "PicUrl"=>"http://d.hiphotos.bdimg.com/wisegame/pic/item/f3529822720e0cf3ac9f1ada0846f21fbe09aaa3.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
</span><span>$content</span>[] = <span>array</span>("Title"=>"多图文3标题", "Description"=>"", "PicUrl"=>"http://g.hiphotos.bdimg.com/wisegame/pic/item/18cb0a46f21fbe090d338acc6a600c338644adfd.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958");
登录后复制

其实现效果如下

如果觉得首图太大，占地方，也可以不填写。

比如这样的代码

<span>$content</span> = <span>array</span><span>(); 
</span><span>$content</span>[] = <span>array</span>("Title" =>"微信公众平台开发教程", "Description" =>"", "PicUrl" =>"", "Url" =>""<span>);
</span><span>$content</span>[] = <span>array</span>("Title" =>"【基础入门】免费\n1. 申请服务器资源\n2. 启用开发模式\n3. 消息类型详解\n4. 获取接收消息\n5. 回复不同消息", "Description" =>"", "PicUrl" =>"http://e.hiphotos.bdimg.com/wisegame/pic/item/9e1f4134970a304e1e398c62d1c8a786c9175c0a.jpg", "Url" =>"http://m.cnblogs.com/99079/3153567.html?full=1"<span>);
</span><span>$content</span>[] = <span>array</span>("Title" =>"【初级教程】双11六折促销\n1.小黄鸡机器人\n2.英语类公众账号开发", "Description" =>"", "PicUrl" =>"http://g.hiphotos.bdimg.com/wisegame/pic/item/3166d0160924ab186196512537fae6cd7b890b24.jpg", "Url" =>"http://israel.duapp.com/taobao/index.php?id=1");
登录后复制

其效果如下所示

微信公众平台开发(97) 图文消息_PHP教程$content = array(); $content[] = array("Title" =>"欢迎关注方倍工作室","Description" =>"", "PicUrl" =>"", "Url" =>""); $content[] = array("Title" =>"【1】新闻 天气 空气 股票 彩票 星座\n". "【2】快递 人品 算命 解梦 附近 苹果\n". "【3】公交 火车 汽车 航班 路况 违章\n". "【4】翻译 百科 双语 听力 成语 历史\n". "【5】团购 充值 菜谱 贺卡 景点 冬吴\n". "【6】情侣相 夫妻相 亲子相 女人味\n". "【7】相册 游戏 笑话 答题 点歌 树洞\n". "【8】微社区 四六级 华强北 世界杯\n\n". "更多精彩，即将亮相，敬请期待！";, "Description" =>"", "PicUrl" =>"", "Url" =>""); $content[] = array("Title" =>"回复对应数字查看使用方法\n发送 0 返回本菜单", "Description" =>"", "PicUrl" =>"", "Url" =>"");

其效果如下所示

四、图文消息的回复

因为图文消息有更好的视觉效果，很多朋友都想要实现图文消息的回复。主要有以下几种情况

1. 关注时回复图文消息

放到订阅事件下就行了，代码如下

    <span>//</span><span>接收事件消息</span>
    <span>private</span> <span>function</span> receiveEvent(<span>$object</span><span>)
    {
        </span><span>$content</span> = ""<span>;
        </span><span>switch</span> (<span>$object</span>-><span>Event)
        {
            </span><span>case</span> "subscribe":
                <span>$content</span> = <span>array</span><span>();
                </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文1标题", "Description"=>"", "PicUrl"=>"http://discuz.comli.com/weixin/weather/icon/cartoon.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
                </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文2标题", "Description"=>"", "PicUrl"=>"http://d.hiphotos.bdimg.com/wisegame/pic/item/f3529822720e0cf3ac9f1ada0846f21fbe09aaa3.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
                </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文3标题", "Description"=>"", "PicUrl"=>"http://g.hiphotos.bdimg.com/wisegame/pic/item/18cb0a46f21fbe090d338acc6a600c338644adfd.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
                </span><span>break</span><span>;
            </span><span>case</span> "unsubscribe":
                <span>$content</span> = "取消关注"<span>;
                </span><span>break</span><span>;
        }
        </span><span>if</span>(<span>is_array</span>(<span>$content</span><span>)){
            </span><span>if</span> (<span>isset</span>(<span>$content</span>[0<span>])){
                </span><span>$result</span> = <span>$this</span>->transmitNews(<span>$object</span>, <span>$content</span><span>);
            }</span><span>else</span> <span>if</span> (<span>isset</span>(<span>$content</span>['MusicUrl'<span>])){
                </span><span>$result</span> = <span>$this</span>->transmitMusic(<span>$object</span>, <span>$content</span><span>);
            }
        }</span><span>else</span><span>{
            </span><span>$result</span> = <span>$this</span>->transmitText(<span>$object</span>, <span>$content</span><span>);
        }

        </span><span>return</span> <span>$result</span><span>;
    }</span>
登录后复制

2. 发送关键字回复图文消息

通过判断关键字既可实现，

<span>//</span><span>接收文本消息</span>
<span>private</span> <span>function</span> receiveText(<span>$object</span><span>)
{
    </span><span>$keyword</span> = <span>trim</span>(<span>$object</span>-><span>Content);
    </span><span>if</span> (<span>strstr</span>(<span>$keyword</span>, "单图文"<span>)){
        </span><span>$content</span> = <span>array</span><span>();
        </span><span>$content</span>[] = <span>array</span>("Title"=>"单图文标题",  "Description"=>"单图文内容", "PicUrl"=>"http://discuz.comli.com/weixin/weather/icon/cartoon.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
    }</span><span>else</span> <span>if</span> (<span>strstr</span>(<span>$keyword</span>, "图文") || <span>strstr</span>(<span>$keyword</span>, "多图文"<span>)){
        </span><span>$content</span> = <span>array</span><span>();
        </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文1标题", "Description"=>"", "PicUrl"=>"http://discuz.comli.com/weixin/weather/icon/cartoon.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
        </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文2标题", "Description"=>"", "PicUrl"=>"http://d.hiphotos.bdimg.com/wisegame/pic/item/f3529822720e0cf3ac9f1ada0846f21fbe09aaa3.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
        </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文3标题", "Description"=>"", "PicUrl"=>"http://g.hiphotos.bdimg.com/wisegame/pic/item/18cb0a46f21fbe090d338acc6a600c338644adfd.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
    }</span><span>else</span><span>{
        </span><span>$content</span> = <span>date</span>("Y-m-d H:i:s",<span>time</span>())."\n技术支持 方倍工作室"<span>;
    }

    </span><span>if</span>(<span>is_array</span>(<span>$content</span><span>)){
        </span><span>if</span> (<span>isset</span>(<span>$content</span>[0]['PicUrl'<span>])){
            </span><span>$result</span> = <span>$this</span>->transmitNews(<span>$object</span>, <span>$content</span><span>);
        }</span><span>else</span> <span>if</span> (<span>isset</span>(<span>$content</span>['MusicUrl'<span>])){
            </span><span>$result</span> = <span>$this</span>->transmitMusic(<span>$object</span>, <span>$content</span><span>);
        }
    }</span><span>else</span><span>{
        </span><span>$result</span> = <span>$this</span>->transmitText(<span>$object</span>, <span>$content</span><span>);
    }
}</span>
登录后复制

3. 点击菜单时回复图文消息

在菜单点击事件中响应即可

<span>//</span><span>接收事件消息</span>
<span>private</span> <span>function</span> receiveEvent(<span>$object</span><span>)
{
    </span><span>$content</span> = ""<span>;
    </span><span>switch</span> (<span>$object</span>-><span>Event)
    {
        </span><span>case</span> "subscribe":
            <span>$content</span> = "欢迎关注方倍工作室 "<span>;
            </span><span>break</span><span>;
        </span><span>case</span> "CLICK":
            <span>switch</span> (<span>$object</span>-><span>EventKey)
            {
                </span><span>case</span> "COMPANY":
                    <span>$content</span> = <span>array</span><span>();
                    </span><span>$content</span>[] = <span>array</span>("Title"=>"多图文1标题", "Description"=>"", "PicUrl"=>"http://discuz.comli.com/weixin/weather/icon/cartoon.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958"<span>);
                    </span><span>break</span><span>;
                </span><span>default</span>:
                    <span>$content</span> = "点击菜单：".<span>$object</span>-><span>EventKey;
                    </span><span>break</span><span>;
            }
            </span><span>break</span><span>;
    }
    </span><span>if</span>(<span>is_array</span>(<span>$content</span><span>)){
        </span><span>if</span> (<span>isset</span>(<span>$content</span>[0<span>])){
            </span><span>$result</span> = <span>$this</span>->transmitNews(<span>$object</span>, <span>$content</span><span>);
        }</span><span>else</span> <span>if</span> (<span>isset</span>(<span>$content</span>['MusicUrl'<span>])){
            </span><span>$result</span> = <span>$this</span>->transmitMusic(<span>$object</span>, <span>$content</span><span>);
        }
    }</span><span>else</span><span>{
        </span><span>$result</span> = <span>$this</span>->transmitText(<span>$object</span>, <span>$content</span><span>);
    }

    </span><span>return</span> <span>$result</span><span>;
}</span>
登录后复制

4. 回复多个图文消息

由于回复消息一次只能回复一条，因此要回复多个图文消息，就需要使用其他接口。这需要已经认证的服务号才能拥有权限。

可以回复图文消息的接口有客服接口及高级群发接口，如果被动回复不够，就可使用客服接口来发送。

 

 

 

 

 ===========================================================

方倍工作室微信公众平台账号关注方法：
1. 微信通讯录-添加朋友-查找公众号-搜索“方倍工作室”
2. 微信通讯录-添加朋友-搜号码-输入“pondbaystudio”
3. 使用微信扫描下面的二维码

www.bkjia.comtruehttp://www.bkjia.com/PHPjc/817469.htmlTechArticle关键字： 微信公众平台 开发模式 图文消息 作者：方倍工作室 原文：http://www.cnblogs.com/txw1958/p/weixin-97-news.html 在这篇微信公众平台开发教程...
相关标签：
开发教程 微信开发
来源：php.cn
上一篇：php防止伪造数据从URL提交解决方法_PHP教程 下一篇：PHP filemtime() 函数_PHP教程
本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
页面突然无法拉动 css 或 bootstrap 所以我正在开发一个页面，我昨天做了一部分，效果很好，今天我继续做剩下的部分，一切都很好。当我尝试将其作为普通html页面打开时，CSS或BOOTSTRAP不起作用，仅显示页面文本，...
来自于 2024-04-06 21:58:04
0
1
800
有没有办法强制弹性框中的文本垂直居中，无论我们有什么其他 CSS 代码？ 我有以下CSS代码，它是我正在开发的网站中使用的更大CSS代码的一部分：.cards-u{display:flex;flex-wrap:wrap;justify-content:c...
来自于 2024-04-06 20:41:51
0
1
518
在网络应用程序中显示版本信息的最佳实践是什么？ 我正在开发一个网络应用程序。在网络应用程序中显示版本信息的最佳实践是什么？我正在使用语义版本控制，并且我已经有了semver，例如1.2.0但我很好奇在哪里显示它的最佳方式以及如何...
来自于 2024-04-06 19:13:16
0
2
476
MERN stack搜索框和复选框的正则表达式过滤器 我正在尝试通过边做边学来了解MERN堆栈如何协同工作，并且我正在遵循bezcoder的这些教程：Node.js/Express/MongoDb（Github整个代码）和Reactj...
来自于 2024-04-06 14:53:12
0
1
425
我们是否应该使用 SSG 来部署使用 Nuxt.js 创建的仪表板？ 我们将使用Nuxt.js开发一个供内部使用的仪表板。由于这将是一个内部仪表板，因此不需要通用模式。一般大部分仪表板都是在SPA中开发的。但是SPA还需要服务器将初始HTML和js包...
来自于 2024-04-06 13:17:44
0
1
493
相关专题
更多>
热门推荐
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板