备案控制台
探索云世界
开发者社区 云计算 文章 正文

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

2014-06-24 1142
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 关键字：微信公众平台 开发模式 图文消息作者：方倍工作室原文：http://www.cnblogs.com/txw1958/p/weixin-97-news.html   在这篇微信公众平台开发教程中，我们将介绍如何灵活的使用图文消息功能。

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

 

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

本文分为以下四个部分：

  1. 图文消息的定义
  2. 图文消息的实现
  3. 图文消息的类型
  4. 图文消息的回复

 

一、图文消息的定义

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

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

其参数说明如下.

参数 是否必须 说明
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中的图片为小图。

 

二、图文消息的实现

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

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

        $result = sprintf($xmlTpl, $object->FromUserName, $object->ToUserName, time(), count($newsArray));
        return $result;
    }

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

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

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

if(is_array($content)){
    if (isset($content[0]['PicUrl'])){
        $result = $this->transmitNews($object, $content);
    }else if (isset($content['MusicUrl'])){
        $result = $this->transmitMusic($object, $content);
    }
}else{
    $result = $this->transmitText($object, $content);
}

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

 

三、图文消息的类型

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

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

单图文消息

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

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

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

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

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

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

其效果如下所示。

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

 

多图文

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

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

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

其实现效果如下

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

比如这样的代码

$content = array(); 
$content[] = array("Title" =>"微信公众平台开发教程", "Description" =>"", "PicUrl" =>"", "Url" =>"");
$content[] = array("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");
$content[] = array("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");

其效果如下所示

还可以所有的图片都不填，都用于来显示文字。

比如如下代码

$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. 关注时回复图文消息

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

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

        return $result;
    }

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

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

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

    if(is_array($content)){
        if (isset($content[0]['PicUrl'])){
            $result = $this->transmitNews($object, $content);
        }else if (isset($content['MusicUrl'])){
            $result = $this->transmitMusic($object, $content);
        }
    }else{
        $result = $this->transmitText($object, $content);
    }
}

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

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

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

    return $result;
}

4. 回复多个图文消息

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

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

 

关键词：
微信公众平台开发
方倍工作室
目录
相关文章
camellia。
|
4月前
|
小程序 PHP
微信公众号开发（一）打通服务器与微信之间的通信
说来惭愧PHP做了这么久，好像就没有从头开发过一个微信公众号，这次刚好有机会从头接入开发一个完整的公众号，也不能说完整，但是这些微信的接口我基本上都试一试~看看大概是什么情况。 首先：打通服务器与微信之间的通信。
camellia。
55 0
2019ab
|
1月前
|
开发者
微信公众平台开发基本配置
微信公众平台开发基本配置
2019ab
85 0
Boale_H
|
1月前
|
移动开发 JavaScript
微信公众号H5开发，在微信浏览器打开H5，无法一键下载图片
微信公众号H5开发，在微信浏览器打开H5，无法一键下载图片
Boale_H
31 0
七镜
|
3月前
|
XML Go 数据格式
【微信公众号开发】基于golang的公众号开发——接入消息自动回复接口
【微信公众号开发】基于golang的公众号开发——接入消息自动回复接口
七镜
125 0
camellia。
|
4月前
|
小程序 PHP 开发者
微信公众号开发（八）生成带参数二维码，以及将二维码下载至本地
微信的二维码真是个神奇的东西。在我们开发中，应用也是很多~ 用户扫描带场景值（参数）二维码时，可能推送以下两种事件：
camellia。
63 1
camellia。
|
4月前
|
XML 移动开发 小程序
微信公众号开发（七）微信h5跳转小程序及小游戏示例
最近公司做活动，需要从h5页面跳转至微信小游戏。 当时接到这个需求的时候，就在想，这玩意能相互跳转么？ 后来百度了一下，还真行。
camellia。
112 1
camellia。
|
4月前
|
小程序 PHP
微信公众号开发（六）微信支付（发红包、企业支付到零钱）需要证书请求示例
这里最主要的就是curlpost请求的时候需要带上证书。否则请求会失败。
camellia。
54 0
camellia。
|
4月前
|
XML JSON 小程序
微信公众号开发（四）获取用户信息
获取用户信息，微信公众号提供了两种方式：
camellia。
51 0
camellia。
|
4月前
|
JSON 小程序 前端开发
微信公众号开发（三）设置底部菜单
填写access_token值，关于如何获取accesstoken值，请参见《微信公众号开发（二）微信公众号的access_token》 最后，将想要设置菜单的json写入body中。
camellia。
108 0
camellia。
|
4月前
|
JSON 小程序 数据库
微信公众号开发（二）微信公众号的access_token
微信对用户使用开放了很多的功能，如：自定义菜单接口、客服接口、获取用户信息接口、用户分组接口、群发接口，但是为了保证用户访问这些功能相对安全，每次访问都需要带上一个秘钥去验证身份。那么这个秘钥就是access_token。
camellia。
65 0

热门文章

最新文章

  • 1
    【微信公众平台对接】有关【上传图文消息内的图片获取URL】调用示例
  • 2
    基于springboot的微信公众号管理系统（支持多公众号接入）
  • 3
    java发送微信公众号模板消息
  • 4
    【微信公众平台对接】有关【创建发票卡券模板】调用示例
  • 5
    微信公众平台开发基本配置
  • 6
    Python爬虫-使用代理获取微信公众号文章
  • 7
    微信公众号H5开发，在微信浏览器打开H5，无法一键下载图片
  • 8
    Java网络爬虫实践：解析微信公众号页面的技巧
  • 9
    Python开发微信公众号后台（系列一）
  • 10
    微信公众平台群发规则说明
  • 1
    java发送微信公众号模板消息
    12
  • 2
    【微信公众平台对接】有关【创建发票卡券模板】调用示例
    9
  • 3
    【微信公众平台对接】有关【上传图文消息内的图片获取URL】调用示例
    36
  • 4
    基于springboot的微信公众号管理系统（支持多公众号接入）
    33
  • 5
    Python爬虫-使用代理获取微信公众号文章
    50
  • 6
    微信公众号H5开发，在微信浏览器打开H5，无法一键下载图片
    31
  • 7
    Java网络爬虫实践：解析微信公众号页面的技巧
    24
  • 8
    微信公众平台开发基本配置
    85
  • 9
    自己动手做一个Server酱-cloudflare workers实现通过微信公众号发送消息
    90
  • 10
    C#微信公众号HIS预约挂号系统源码
    87

    • 相关电子书

    更多
  • 微信PaxosStore简介
  • 微信 H5 视频播放器在海量业务下的实践
  • 微信H5视频播放器在海量业务下的实践

    • 相关实验场景

    更多
  • 收银台的场景化界面实践
  • 星轨-钉钉APP分发实训
    • 下一篇
    阿里云oss简介和使用流程
    为什么选择阿里云什么是云计算全球基础设施技术领先稳定可靠安全合规分析师报告
    产品和定价全部产品免费试用产品动态产品定价价格计算器云上成本管理
    解决方案技术解决方案
    文档与社区文档开发者社区天池大赛培训与认证
    权益中心免费试用高校计划企业扶持计划推荐返现计划
    支持与服务基础服务企业增值服务迁云服务官网公告健康看板信任中心
    关注阿里云
    关注阿里云公众号或下载阿里云APP，关注云资讯，随时随地运维管控云服务
    阿里云APP阿里云微信
    联系我们：4008013260
    法律声明Cookies政策廉正举报安全举报联系我们加入我们
    阿里巴巴集团淘宝网天猫全球速卖通阿里巴巴国际交易市场1688阿里妈妈飞猪阿里云计算AliOS万网高德UC友盟优酷钉钉支付宝达摩院淘宝海外阿里云盘饿了么
    © 2009-2024 Aliyun.com 版权所有 增值电信业务经营许可证： 浙B2-20080101 域名注册服务机构许可： 浙D3-20210002 京D3-20220015
    浙公网安备 33010602009975号浙B2-20080101-4