Twitter API についてメモ 3

昨日行き詰まってたところが乗り越えられた気がする！！
以下、調べたことログ。

そもそもRailsプロジェクトからAPIを呼ぶには

「Make api calls in Rails」で検索して Making API Calls in Rails
rest-client gem の代わりに twitter gem を使った方が Authenticate が簡単そうなのでできればそうしたい
response で帰ってきたJSONに関しては、RubyのJSONモジュールがあって、それでparseできそう
Module: JSON (Ruby 2.0.0)
→twitter gem を使って、tweet id を配列で取得することに成功
そこから埋め込みツイートにするには？

Tweet ID → 埋め込みツイートで表示

oEmbed API
GET statuses/oembed — Twitter Developers
これを使おうと思ったら結局自前でAPIコールできるようにしないとダメ…？
twitter gem にはなさそう

と思ったら

Requires authentication? No

→この oEmbed APIは認証なしでいける？！

なのでこっちは rest-client gem を使って
　Making API Calls in Rails
の内容に従って、まずはコンソールで試してみる。

For now, we'll make the API call in the Rails console.

2.4.0 :010 > response = RestClient::Request.execute(
2.4.0 :011 >     method: :get,
2.4.0 :012 >     url: 'https://publish.twitter.com/oembed?url=https%3a%2f%2ftwitter%2ecom%2fInterior%2fstatus%2f1036046485006118912'
2.4.0 :013?>   )
 => <RestClient::Response 200 "{\"url\":\"htt..."> 
2.4.0 :014 > JSON.parse(response)
 => {"url"=>"https://twitter.com/siideemt/status/1036046485006118912", "author_name"=>"sidemt", "author_url"=>"https://twitter.com/siideemt", "html"=>"<blockquote class=\"twitter-tweet\"><p lang=\"ja\" dir=\"ltr\">Day12: 引き続きTwitter API の使い方を調査。あまり進展がなく…。検索タイムラインの埋め込みが最近廃止されたらしく、それに近いことをやろうとしていたので、果たしてそれが自前でできるものなのか…？と不安に思いつつ。もう少し手を動かせる段階に行きたい…  <a href=\"https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw\">#100DaysOfCode</a></p>&mdash; sidemt (@siideemt) <a href=\"https://twitter.com/siideemt/status/1036046485006118912?ref_src=twsrc%5Etfw\">September 2, 2018</a></blockquote>\n<script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n", "width"=>550, "height"=>nil, "type"=>"rich", "cache_age"=>"3153600000", "provider_name"=>"Twitter", "provider_url"=>"https://twitter.com", "version"=>"1.0"} 
2.4.0 :015 >

できてそう！！

コンソール上でできたので、そのコードをRailsのプロジェクト内でどこに書けばいいか

まだ全部読み切れてないのですが、上で挙げたページの続き、このページが私の疑問に超答えてくれてる気がします…
Plain Old Ruby Objects

Sometimes it’s not always clear where our code should go in a Rails application.

そうなの。それなの。

結論

In this case, we should create a plain old Ruby object (or PORO). We'll create a new Weather class and call the method there.

おそらくこれと同じく、classを作って書くのが良さそう。
一旦ここは飛ばして、取れたJSONの内容をどうにかしたらちゃんと表示できるのかの方を先に試す。

oEmbed API でとれたJSONをどうする

このJSONを
JavaScript API — Twitter Developers
で何とかすればいいのかな？

Set up Twitter for Websites — Twitter Developers

If you use the oEmbed API to include Tweets in your content, you can generate embed codes that don’t include the <script> element by passing omit_script=true in the query string.

つまり、こう？↓

response = RestClient::Request.execute(
method: :get,
url: 'https://publish.twitter.com/oembed?url=https%3a%2f%2ftwitter%2ecom%2fInterior%2fstatus%2f1036046485006118912&omit_script=true'
)

結果

2.4.0 :015 > response = RestClient::Request.execute(
2.4.0 :016 >     method: :get,
2.4.0 :017 >     url: 'https://publish.twitter.com/oembed?url=https%3a%2f%2ftwitter%2ecom%2fInterior%2fstatus%2f1036046485006118912&omit_script=true'
2.4.0 :018?>   )
 => <RestClient::Response 200 "{\"url\":\"htt..."> 
2.4.0 :019 > JSON.parse(response)
 => {"url"=>"https://twitter.com/siideemt/status/1036046485006118912", "author_name"=>"sidemt", "author_url"=>"https://twitter.com/siideemt", "html"=>"<blockquote class=\"twitter-tweet\"><p lang=\"ja\" dir=\"ltr\">Day12: 引き続きTwitter API の使い方を調査。あまり進展がなく…。検索タイムラインの埋め込みが最近廃止されたらしく、それに近いことをやろうとしていたので、果たしてそれが自前でできるものなのか…？と不安に思いつつ。もう少し手を動かせる段階に行きたい…  <a href=\"https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw\">#100DaysOfCode</a></p>&mdash; sidemt (@siideemt) <a href=\"https://twitter.com/siideemt/status/1036046485006118912?ref_src=twsrc%5Etfw\">September 2, 2018</a></blockquote>\n", "width"=>550, "height"=>nil, "type"=>"rich", "cache_age"=>"3153600000", "provider_name"=>"Twitter", "provider_url"=>"https://twitter.com", "version"=>"1.0"} 
2.4.0 :020 >

できてるっぽい。
<script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>
の部分が無くなってる。

GET statuses/oembed — Twitter Developers より

>The returned HTML snippet will be automatically recognized as an Embedded Tweet when Twitter’s widget JavaScript is included on the page.

"html"=>"<blockquote class=\"twitter-tweet\"><p lang=\"ja\" dir=\"ltr\">Day12: 引き続きTwitter API の使い方を調査。あまり進展がなく…。検索タイムラインの埋め込みが最近廃止されたらしく、それに近いことをやろうとしていたので、果たしてそれが自前でできるものなのか…？と不安に思いつつ。もう少し手を動かせる段階に行きたい…  <a href=\"https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw\">#100DaysOfCode</a></p>&mdash; sidemt (@siideemt) <a href=\"https://twitter.com/siideemt/status/1036046485006118912?ref_src=twsrc%5Etfw\">September 2, 2018</a></blockquote>\n",

ここか！
とりあえずこのJSONで返ってきたコードを、エスケープ記号を抜いてペタッと貼り付けると、埋め込みツイートとして表示できることまで確認。


<!-- widgets.js -->
<script>window.twttr = (function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0],
    t = window.twttr || {};
  if (d.getElementById(id)) return t;
  js = d.createElement(s);
  js.id = id;
  js.src = "https://platform.twitter.com/widgets.js";
  fjs.parentNode.insertBefore(js, fjs);

  t._e = [];
  t.ready = function(f) {
    t._e.push(f);
  };

  return t;
}(document, "script", "twitter-wjs"));</script>

<!-- 埋め込みツイート -->
<blockquote class="twitter-tweet">
  <p lang="ja" dir="ltr">
    Day12: 引き続きTwitter API の使い方を調査。あまり進展がなく…。検索タイムラインの埋め込みが最近廃止されたらしく、それに近いことをやろうとしていたので、果たしてそれが自前でできるものなのか…？と不安に思いつつ。もう少し手を動かせる段階に行きたい…  
    <a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a>
    </p>
    &mdash; sidemt (@siideemt) 
    <a href="https://twitter.com/siideemt/status/1036046485006118912?ref_src=twsrc%5Etfw">September 2, 2018</a>
    </blockquote>

やっと道筋が見えてきた気がします…！

New Orbit

2018年9月3日月曜日