Facebook Messengerには、テキストや画像の送信以外にもいろいろなものを投稿できる機能がありますが、Messenger Platformの公式リファレンスのMessage-Received Callbackの項目では全てが説明されていないようなので、まとめてみました。
テキスト
{
mid: 'mid.1462160673187:97319ef1f3dfb56909',
seq: 3729,
text: 'Test'
}
絵文字
{
mid: 'mid.1462161694171:e32b926675695c4751',
seq: 3740,
text: '😁'
}
ポイント
- 通常テキストメッセージは吹き出しのような囲まれているUIであるのに対し、絵文字は絵文字がスタンプのように生でポストされるので、送信形式が違うのかと思い調べたが、普通にテキストとしておくられる。
画像
{
mid: 'mid.1462161747393:767d8682762e9c6c91',
seq: 3743,
attachments: [{
type: 'image',
payload: {
url: 'https://scontent.xx.fbcdn.net/v/t34.0-12/13149973_1057584607649689_146740965_n.jpg?oh=17c1586156fa070c33d156673283e4ac&oe=5729B28A'
}
}]
}
複数画像
{
mid: 'mid.1462161747393:767d8682762e9c6c91',
seq: 3743,
attachments: [{
type: 'image',
payload: {
url: 'https://scontent.xx.fbcdn.net/v/t34.0-12/13149973_1057584607649689_146740965_n.jpg?oh=17c1586156fa070c33d156673283e4ac&oe=5729B28A'
}
},
{
type: 'image',
payload: {
url: 'https://scontent.xx.fbcdn.net/v/t34.0-12/13149973_1057584607649689_146740965_n.jpg?oh=17c1586156fa070c33d156673283e4ac&oe=5729B28A'
}
}]
}
ポイント
- attachementsの中に配列として画像が並ぶ
- Messengerでは画像と動画を混ぜて複数選択したり、動画を複数選択したりすることはできないようなので（しようとするとアラートがポップアップする）現状ここに並ぶのはtype: imageのオブジェクトのみとなる
GIF（Giphyなどで投稿されるもの）
{
mid: 'mid.1462160694749:437851987c8eb7ca22',
seq: 3732,
attachments: [{
type: 'image',
payload: {
url: 'https://cdn.fbsbx.com/v/t59.2708-21/13068706_10156937759280249_1358572811_n.gif?oh=044addf0a2be092cb04b8edb26d806ab&oe=5728C3B4'
}
}]
}
ポイント
- 現状Giphyなどで投稿されるGifアニメーションと通常投稿画像の判別はつかないように見える。無理矢理判定するなら、通常、スマホから投稿される画像はjpgであると割り切って、payload.urlの中に".gif"という文字列がみつかったらgifアニメーションであると判定するぐらいしかない。
いいね！
{
mid: 'mid.1462160938191:cd6db17b8501ac0183',
seq: 3735,
sticker_id: 369239263222822,
attachments: [{
type: 'image',
payload: {
url: 'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xfa1/t39.1997-6/851557_369239266556155_759568595_n.png'
}
}]
}
ポイント
- ただのPNG画像として送られてきてしまう。
- 「sticker_id」という公式リファレンスには掲載されていないキーが存在する。
音声
{
mid: 'mid.1462161083654:7c93acc62bf7181519',
seq: 3736,
attachments: [
{
type: 'audio',
payload: {
url: 'https://cdn.fbsbx.com/hphotos-xpf1/v/t59.3654-21/13105144_1057581247650025_4287058_n.mp4/audioclip-1462161083000-1976.mp4?oh=b31fa25a63180d29b485b64c28d64806&oe=5729C200'
}
}
]
}
ポイント
- payload.urlがmp4形式のファイルのURLとなっている
動画
{
mid: 'mid.1462161181116:c889db218be9fd8455',
seq: 3737,
attachments: [{
type: 'video',
payload: {
url: 'https://video.xx.fbcdn.net/v/t42.3356-2/13154860_1057581767649973_2034607946_n.mp4/video-1462161180.mp4?vabr=519222&oh=fb87bce87fa6631fceeea730d4c34626&oe=5728BE67'
}
}]
}
ポイント
- payload.urlがmp4形式のファイルのURLとなっている
スタンプ
{
mid: 'mid.1462161319358:719bd120a075db0f48',
seq: 3738,
sticker_id: 126362100881920,
attachments: [{
type: 'image',
payload: {
url: 'https://fbcdn-dragon-a.akamaihd.net/hphotos-ak-xfa1/t39.1997-6/p100x100/851586_126362104215253_1651254063_n.png'
}
}]
}
ポイント
- ただのPNG画像として送られてきてしまう。
- 「sticker_id」という公式リファレンスには掲載されていないキーが存在する。
位置情報
{
mid: 'mid.1462161425797:0cb4853c813f67f157',
seq: 3739,
attachments:[{
title: 'Kensuke\'s Location',
url: 'https://www.facebook.com/l.php?u=https%3A%2F%2Fwww.bing.com%2Fmaps%2Fdefault.aspx%3Fv%3D2%26pc%3DFACEBK%26mid%3D8100%26where1%3D37.853892152233%252C%2B-122.27284387697%26FORM%3DFBKPL1%26mkt%3Den-US&h=GAQFDbq0p&s=1&enc=AZMFD3TrKmomukiQ-yZcDpHMLCU2VgfmlSQFV_K8nywElxrUh4_igid2GmshbuHV3ASvVLI1ewNONlYl8LNfzGBsVFQ6p6xGFqx_qHMmfKgqGw',
type: 'location',
payload: {
coordinates: {
lat: 37.853892152233,
long: -122.27284387697
}
}
}]
}
ポイント
- 公式リファレンスにはまだ掲載されていないtype: locationという形式となっている
- attachments[].urlはBing MapsへのリダイレクトURLとなっている
- payload.coordinatesから緯度経度を取得することができる
ちなみにtype: locationに関しては各ボットですでに活用されていて、例えばお天気ボットHi Ponchoでは、位置情報をポストするとその場所の天気を即座に教えてくれる。
面白かったポイント
- attachments[].typeにはimage, video, audio以外に「location」という要素が存在する。
- スタンプ、GIF（Giphyなど）、いいね！、はtype: imageで送信され画像のURLが送られてくるだけなので、判別が難しい
- スタンプ、いいね！にはsticker_idという公式リファレンスでは言及されていないキーが存在する
- 現状attachmentsの配列に複数の要素が入るのは、type: imageのものが並ぶケースしか存在しない（調査不足であればもうしわけないですが）