GET statuses/oembed - ツイートの埋め込み用HTMLを取得する
公開日:
statuses/oembed(GETメソッド)は、対象ツイートを、ウェブページで表示するための埋め込み用コードを取得するエンドポイントです。
- GET statuses/oembed
- Twitterの公式リファレンス(英語)。statuses/oembedに関する説明があります。
リソース
エンドポイント
GET https://publish.twitter.com/oembed
条件
項目 | ユーザー認証 | アプリケーション認証 |
---|---|---|
利用 | ● | ● |
パーミッション | Read | - |
レートリミット | 制限なし | 制限なし |
パラメータ
url
指定例: https://twitter.com/SyncerJP/status/818277537176391680
対象ツイートのURL。
maxwidth
指定例: 220
フレームの最大横幅をピクセル値で指定する。pxは不要。220px〜550pxの間で指定可。
hide_media
指定例: true
ツイートの、画像や動画などのメディアを隠すか否か。true
なら隠す、false
なら隠さない。
hide_thread
指定例: true
リプライが存在する場合、スレッドを隠してツイートを個別表示にするか否か。true
なら個別表示、false
ならリプライ先を含めて表示。
omit_script
指定例: true
htmlプロパティに、ウィジェット用のscript要素を追加するか否か。他の場所でウィジェットのライブラリを読み込んでいる場合は不要なのでfalse
を推奨。
align
指定例: center
フレームを寄せる方向を指定する。
- left
- 左寄せ。
- center
- 中央寄せ。
- right
- 右寄せ。
related
指定例: arayutw
スクリーンネームを指定すると、ユーザーがアクション後の画面に関連ユーザー(フォロー推奨)として表示される。表示されるのは、埋め込みウェジェットからリプライ、リツイート、お気に入り登録をした後の画面。複数指定する場合は,で区切る。
lang
指定例: ja
UIの言語を、言語コードで指定する。
theme
指定例: light
ウィジェットの色。
- light
- 白系。
- dark
- 黒系。
link_color
指定例: #d36015
リンクの色。
widget_type
指定例: video
ツイートに動画が添付されている場合、video
を指定すると、動画のみが表示される。動画がないツイートに適用した場合、ウィジェットが機能しないので注意が必要。
hide_tweet
指定例: true
widget_typeプロパティを利用して、動画専用表示にしている場合に、右下のTwitterバードをクリックした時に、ツイートの個別ページに移動するか否か。false
を指定した場合、移動せずに、オーバーレイ表示になる。
レスポンス
アクセストークン(OAuth1.0)でリクエストをした場合の例です。
リクエストURL
https://publish.twitter.com/oembed?url=https%3A%2F%2Ftwitter.com%2FSyncerJP%2Fstatus%2F818277537176391680&hide_media=false&omit_script=true&align=left&theme=light
リクエストヘッダー
Authorization: OAuth align=left,hide_media=false,oauth_consumer_key=:consumer_key,oauth_nonce=0.14345100+1484722069,oauth_signature_method=HMAC-SHA1,oauth_timestamp=1484722069,oauth_token=:access_token,oauth_version=1.0,omit_script=true,theme=light,url=https%3A%2F%2Ftwitter.com%2FSyncerJP%2Fstatus%2F818277537176391680,oauth_signature=l%2FhZMwnEqCRSkwMtFecI3NjNOn4%3D
レスポンスボディ (JSON)
JSON
{"url":"https:\/\/twitter.com\/SyncerJP\/status\/818277537176391680","author_name":"SYNCER","author_url":"https:\/\/twitter.com\/SyncerJP","html":"\u003Cblockquote class=\"twitter-tweet\" align=\"left\" data-theme=\"light\"\u003E\u003Cp lang=\"ja\" dir=\"ltr\"\u003ETwitterのトレンドビューアを更新。2016年9月12日からのトレンドを、ランキング形式で確認できるコンテンツに生まれ変わりました!どのように流行ったのか当時のタイムラインを確認できます\uD83D\uDE00\u003Cbr\u003E\u003Cbr\u003ETwitterのトレンドワードまとめ\u003Ca href=\"https:\/\/t.co\/v6xrbUVeK4\"\u003Ehttps:\/\/t.co\/v6xrbUVeK4\u003C\/a\u003E\u003C\/p\u003E— SYNCER (@SyncerJP) \u003Ca href=\"https:\/\/twitter.com\/SyncerJP\/status\/818277537176391680\"\u003EJanuary 9, 2017\u003C\/a\u003E\u003C\/blockquote\u003E\n","width":550,"height":null,"type":"rich","cache_age":"3153600000","provider_name":"Twitter","provider_url":"https:\/\/twitter.com","version":"1.0"}
レスポンスヘッダー
HTTP/1.1 200 OK
cache-control: must-revalidate, max-age=3153600000
content-disposition: attachment; filename=json.json
content-length: 1021
content-type: application/json; charset=utf-8
date: Wed, 18 Jan 2017 06:47:49 GMT
expires: Fri, 25 Dec 2116 06:47:49 GMT
last-modified: Wed, 18 Jan 2017 06:47:49 GMT
server: tsa_m
set-cookie: guest_id=v1%3A148472206924305628; Domain=.twitter.com; Path=/; Expires=Fri, 18-Jan-2019 06:47:49 UTC
strict-transport-security: max-age=631138519
x-connection-hash: 4c4dec004785f97a41d1a23ef942eaa6
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
x-response-time: 160
x-xss-protection: 1; mode=block
デモ
statuses/oembedのリクエストを試すことができます。ユーザー認証のデモを試す場合は、アプリケーション(読取権限)の連携を許可する必要があります。利用後、お手数ですが連携の解除をお願いします。連携を解除し忘れたとしても、当アプリケーションが許可なくデータにアクセスすることはありません。
サンプルコード
statuses/oembedのエンドポイントを利用するためのサンプルプログラムです。各種トークンの情報をセットしてからPHPで起動して下さい。リクエストに成功すると、$json
という変数に目的のデータが代入されます。このデータを整形するなり保存するなり、活用して下さい。
ベアラートークン
PHP (OAuth2.0)
<?php
/**************************************************
[GET statuses/oembed]のお試しプログラム
認証方式: ベアラートークン
配布: SYNCER
公式ドキュメント: https://dev.twitter.com/rest/reference/get/statuses/oembed
日本語解説ページ: https://syncer.jp/Web/API/Twitter/REST_API/GET/statuses/oembed/
**************************************************/
// 設定
$bearer_token = '' ; // ベアラートークン
$request_url = 'https://publish.twitter.com/oembed' ; // エンドポイント
// パラメータ (オプション)
$params = array(
"url" => "https://twitter.com/SyncerJP/status/818277537176391680",
// "maxwidth" => "220",
// "hide_media" => "true",
// "hide_thread" => "true",
// "omit_script" => "true",
// "align" => "center",
// "related" => "arayutw",
// "lang" => "ja",
// "theme" => "light",
// "link_color" => "#d36015",
// "widget_type" => "video",
// "hide_tweet" => "true",
) ;
// パラメータがある場合
if( $params ) {
$request_url .= '?' . http_build_query( $params ) ;
}
// リクエスト用のコンテキスト
$context = array(
'http' => array(
'method' => 'GET' , // リクエストメソッド
'header' => array( // ヘッダー
'Authorization: Bearer ' . $bearer_token ,
) ,
) ,
) ;
// cURLを使ってリクエスト
$curl = curl_init() ;
curl_setopt( $curl , CURLOPT_URL , $request_url ) ;
curl_setopt( $curl , CURLOPT_HEADER, 1 ) ;
curl_setopt( $curl , CURLOPT_CUSTOMREQUEST , $context['http']['method'] ) ; // メソッド
curl_setopt( $curl , CURLOPT_SSL_VERIFYPEER , false ) ; // 証明書の検証を行わない
curl_setopt( $curl , CURLOPT_RETURNTRANSFER , true ) ; // curl_execの結果を文字列で返す
curl_setopt( $curl , CURLOPT_HTTPHEADER , $context['http']['header'] ) ; // ヘッダー
curl_setopt( $curl , CURLOPT_TIMEOUT , 5 ) ; // タイムアウトの秒数
$res1 = curl_exec( $curl ) ;
$res2 = curl_getinfo( $curl ) ;
curl_close( $curl ) ;
// 取得したデータ
$json = substr( $res1, $res2['header_size'] ) ; // 取得したデータ(JSONなど)
$header = substr( $res1, 0, $res2['header_size'] ) ; // レスポンスヘッダー (検証に利用したい場合にどうぞ)
// [cURL]ではなく、[file_get_contents()]を使うには下記の通りです…
// $json = @file_get_contents( $request_url , false , stream_context_create( $context ) ) ;
// JSONをオブジェクトに変換 (処理をする場合)
// $obj = json_decode( $json ) ;
// HTML用
$html = '' ;
// タイトル
$html .= '<h1 style="text-align:center; border-bottom:1px solid #555; padding-bottom:12px; margin-bottom:48px; color:#D36015;">GET statuses/oembed</h1>' ;
// 検証用
$html .= '<h2>取得したデータ</h2>' ;
$html .= '<p>下記のデータを取得できました。</p>' ;
$html .= '<h3>ボディ(JSON)</h3>' ;
$html .= '<p><textarea style="width:80%" rows="8">' . $json . '</textarea></p>' ;
$html .= '<h3>レスポンスヘッダー</h3>' ;
$html .= '<p><textarea style="width:80%" rows="8">' . $header . '</textarea></p>' ;
// 検証用
$html .= '<h2>リクエストしたデータ</h2>' ;
$html .= '<p>下記内容でリクエストをしました。</p>' ;
$html .= '<h3>URL</h3>' ;
$html .= '<p><textarea style="width:80%" rows="8">' . $context['http']['method'] . ' ' . $request_url . '</textarea></p>' ;
$html .= '<h3>ヘッダー</h3>' ;
$html .= '<p><textarea style="width:80%" rows="8">' . implode( "\r\n" , $context['http']['header'] ) . '</textarea></p>' ;
// フッター
$html .= '<small style="display:block; border-top:1px solid #555; padding-top:12px; margin-top:72px; text-align:center; font-weight:700;">プログラムの説明: <a href="https://syncer.jp/Web/API/Twitter/REST_API/GET/statuses/oembed/" target="_blank">SYNCER</a></small>' ;
// 出力 (本稼働時はHTMLのヘッダー、フッターを付けよう)
echo $html ;
アクセストークン
PHP (OAuth1.0)
<?php
/**************************************************
[GET statuses/oembed]のお試しプログラム
認証方式: アクセストークン
配布: SYNCER
公式ドキュメント: https://dev.twitter.com/rest/reference/get/statuses/oembed
日本語解説ページ: https://syncer.jp/Web/API/Twitter/REST_API/GET/statuses/oembed/
**************************************************/
// 設定
$api_key = '' ; // APIキー
$api_secret = '' ; // APIシークレット
$access_token = '' ; // アクセストークン
$access_token_secret = '' ; // アクセストークンシークレット
$request_url = 'https://publish.twitter.com/oembed' ; // エンドポイント
$request_method = 'GET' ;
// パラメータA (オプション)
$params_a = array(
"url" => "https://twitter.com/SyncerJP/status/818277537176391680",
// "maxwidth" => "220",
// "hide_media" => "true",
// "hide_thread" => "true",
// "omit_script" => "true",
// "align" => "center",
// "related" => "arayutw",
// "lang" => "ja",
// "theme" => "light",
// "link_color" => "#d36015",
// "widget_type" => "video",
// "hide_tweet" => "true",
) ;
// キーを作成する (URLエンコードする)
$signature_key = rawurlencode( $api_secret ) . '&' . rawurlencode( $access_token_secret ) ;
// パラメータB (署名の材料用)
$params_b = array(
'oauth_token' => $access_token ,
'oauth_consumer_key' => $api_key ,
'oauth_signature_method' => 'HMAC-SHA1' ,
'oauth_timestamp' => time() ,
'oauth_nonce' => microtime() ,
'oauth_version' => '1.0' ,
) ;
// パラメータAとパラメータBを合成してパラメータCを作る
$params_c = array_merge( $params_a , $params_b ) ;
// 連想配列をアルファベット順に並び替える
ksort( $params_c ) ;
// パラメータの連想配列を[キー=値&キー=値...]の文字列に変換する
$request_params = http_build_query( $params_c , '' , '&' ) ;
// 一部の文字列をフォロー
$request_params = str_replace( array( '+' , '%7E' ) , array( '%20' , '~' ) , $request_params ) ;
// 変換した文字列をURLエンコードする
$request_params = rawurlencode( $request_params ) ;
// リクエストメソッドをURLエンコードする
// ここでは、URL末尾の[?]以下は付けないこと
$encoded_request_method = rawurlencode( $request_method ) ;
// リクエストURLをURLエンコードする
$encoded_request_url = rawurlencode( $request_url ) ;
// リクエストメソッド、リクエストURL、パラメータを[&]で繋ぐ
$signature_data = $encoded_request_method . '&' . $encoded_request_url . '&' . $request_params ;
// キー[$signature_key]とデータ[$signature_data]を利用して、HMAC-SHA1方式のハッシュ値に変換する
$hash = hash_hmac( 'sha1' , $signature_data , $signature_key , TRUE ) ;
// base64エンコードして、署名[$signature]が完成する
$signature = base64_encode( $hash ) ;
// パラメータの連想配列、[$params]に、作成した署名を加える
$params_c['oauth_signature'] = $signature ;
// パラメータの連想配列を[キー=値,キー=値,...]の文字列に変換する
$header_params = http_build_query( $params_c , '' , ',' ) ;
// リクエスト用のコンテキスト
$context = array(
'http' => array(
'method' => $request_method , // リクエストメソッド
'header' => array( // ヘッダー
'Authorization: OAuth ' . $header_params ,
) ,
) ,
) ;
// パラメータがある場合、URLの末尾に追加
if( $params_a ) {
$request_url .= '?' . http_build_query( $params_a ) ;
}
// オプションがある場合、コンテキストにPOSTフィールドを作成する (GETの場合は不要)
// if( $params_a ) {
// $context['http']['content'] = http_build_query( $params_a ) ;
// }
// cURLを使ってリクエスト
$curl = curl_init() ;
curl_setopt( $curl, CURLOPT_URL , $request_url ) ;
curl_setopt( $curl, CURLOPT_HEADER, 1 ) ;
curl_setopt( $curl, CURLOPT_CUSTOMREQUEST , $context['http']['method'] ) ; // メソッド
curl_setopt( $curl, CURLOPT_SSL_VERIFYPEER , false ) ; // 証明書の検証を行わない
curl_setopt( $curl, CURLOPT_RETURNTRANSFER , true ) ; // curl_execの結果を文字列で返す
curl_setopt( $curl, CURLOPT_HTTPHEADER , $context['http']['header'] ) ; // ヘッダー
// if( isset( $context['http']['content'] ) && !empty( $context['http']['content'] ) ) { // GETの場合は不要
// curl_setopt( $curl , CURLOPT_POSTFIELDS , $context['http']['content'] ) ; // リクエストボディ
// }
curl_setopt( $curl , CURLOPT_TIMEOUT , 5 ) ; // タイムアウトの秒数
$res1 = curl_exec( $curl ) ;
$res2 = curl_getinfo( $curl ) ;
curl_close( $curl ) ;
// 取得したデータ
$json = substr( $res1, $res2['header_size'] ) ; // 取得したデータ(JSONなど)
$header = substr( $res1, 0, $res2['header_size'] ) ; // レスポンスヘッダー (検証に利用したい場合にどうぞ)
// [cURL]ではなく、[file_get_contents()]を使うには下記の通りです…
// $json = file_get_contents( $request_url , false , stream_context_create( $context ) ) ;
// JSONをオブジェクトに変換
$obj = json_decode( $json ) ;
// HTML用
$html = '' ;
// タイトル
$html .= '<h1 style="text-align:center; border-bottom:1px solid #555; padding-bottom:12px; margin-bottom:48px; color:#D36015;">GET statuses/oembed</h1>' ;
// エラー判定
if( !$json || !$obj ) {
$html .= '<h2>エラー内容</h2>' ;
$html .= '<p>データを取得することができませんでした…。設定を見直して下さい。</p>' ;
}
// 検証用
$html .= '<h2>取得したデータ</h2>' ;
$html .= '<p>下記のデータを取得できました。</p>' ;
$html .= '<h3>ボディ(JSON)</h3>' ;
$html .= '<p><textarea style="width:80%" rows="8">' . $json . '</textarea></p>' ;
$html .= '<h3>レスポンスヘッダー</h3>' ;
$html .= '<p><textarea style="width:80%" rows="8">' . $header . '</textarea></p>' ;
// 検証用
$html .= '<h2>リクエストしたデータ</h2>' ;
$html .= '<p>下記内容でリクエストをしました。</p>' ;
$html .= '<h3>URL</h3>' ;
$html .= '<p><textarea style="width:80%" rows="8">' . $context['http']['method'] . ' ' . $request_url . '</textarea></p>' ;
$html .= '<h3>ヘッダー</h3>' ;
$html .= '<p><textarea style="width:80%" rows="8">' . implode( "\r\n" , $context['http']['header'] ) . '</textarea></p>' ;
// フッター
$html .= '<small style="display:block; border-top:1px solid #555; padding-top:12px; margin-top:72px; text-align:center; font-weight:700;">プログラムの説明: <a href="https://syncer.jp/Web/API/Twitter/REST_API/GET/statuses/oembed/" target="_blank">SYNCER</a></small>' ;
// 出力 (本稼働時はHTMLのヘッダー、フッターを付けよう)
echo $html ;