Help us understand the problem. What is going on with this article?

rails TwitterAPI を使ったフォローリスト表示

はじめに

deviseomniauth-twitter を使いソーシャルログインを実装後の、ログインした各ユーザーのフォローリスト(ユーザー名、ユーザーアカウント名、プロフィール文、プロフィール画像)を表示させた手順を書いていきます。

deviseを使ったソーシャルログインの実装は下記の記事を参考にしました。

[Rails] deviseの使い方(rails5版)
https://qiita.com/cigalecigales/items/f4274088f20832252374

この記事を見てできること

twitterAPIを使ったフォローリストの表示。

開発環境

ruby 2.6.2

rails 5.1.1

手順

gem

gem 'twitter'

初期設定

https://apps.twitter.com
上記のサイトで必要となる四つのキーを取得。

Consumer Key
Consumer Secret
Access Token
Access Token Secret

キー取得に関しては以下の記事を参考に。
https://qiita.com/ayies128/items/80e1163caa2e1448ff9d

取得したキーを以下のように読み込ます。

client = Twitter::REST::Client.new do |config|

    config.consumer_key        = CONSUMER_KEY

    config.consumer_secret     = CONSUMER_SECRET

    config.access_token        = ACCESS_TOKEN

    config.access_token_secret = ACCESS_TOKEN_SECRET

end

色々な書き方がありますが、僕はこのように書きました。

users_controller.rb
class UsersController < ApplicationController
  before_action :twitter
  def index
  end

  def show
  end

  def follow
  end

  private
    def twitter
      client = Twitter::REST::Client.new do |config|
        config.consumer_key = "###"
        config.consumer_secret = "###"
        config.access_token = "###"
        config.access_token_secret ="###"
      end
    end
end

before_action :twitter を入れることを忘れないように。

⚠︎キーを直接コントローラに書くのはセキュリティ面であまりよろしくないというご指摘を受けました。
以下の記事を参考に、Twitterlから取得したキーを.envに保存しておく方がいいっぽいです。

環境によって変わる設定値はdotenvを使うと便利
https://qiita.com/closer/items/f8d8ba00ae86d7051764

Twitter APIを利用する

これでTwitter APIが使えるようになったので、実際に使ってみます。
今回の用途として、followビューでログインユーザーのフォローリストを表示させたいので以下のように記述します。

users_controller.rb
..
def follow
    @friends = twitter.friends(current_user).take(20)
end
..

@friendsは現在ログインしているユーザーのフォローユーザーを20件取得したものです。

これで表示させる準備が整いました。

ビューで表示

表示させたい項目は、

ユーザーの名前
ユーザーアカウント名
プロフィール文
プロフィール画像

なのでそれぞれ記述していきます。

follow.html.erb
<% @friends.each do |friend| %>
#ユーザー名
<a href="https://twitter.com/<%= friend.screen_name %>" target="_blank"><%= friend.name %></a>
#アカウント名
<p><%= friend.screen_name %></p>
#プロフィール文
<p><%= friend.description %></p>
#プロフィール画像
<p><%= image_tag "#{friend.profile_image_url}" %></p>
<hr>

<% end %>

一つ注意点としてimage_tagfriend.profile_image_urlは展開しないとエラーになってしまいます。
以下参照
https://teratail.com/questions/131100

ここまで完了すれば、ブラウザでいい感じのフォローリストができているはずです。

終わりに

omniauth系の記事はよく見かけますが、Twitter API系の記事はあまりなかったので是非、参考にしていただければと思います。

参考

ruby で twitter api を使用する
https://loumo.jp/wp/archive/20150916000032/
A Ruby interface to the Twitter API.
https://github.com/sferik/twitter
RailsアプリでTwitterから画像を取得する方法
https://teratail.com/questions/131100
TwitterのGemを使ってFollowした人の一覧を取ろうとしたらちょっとハマった件
https://qiita.com/ryonext/items/35546d53098240c330f3

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away