teratail
回答率
85.48%
質問するログイン新規登録
トップAPIに関する質問InstagramのAccess_tokenを取得する

編集履歴

回答編集履歴

3

修正

2017/12/08 11:57

投稿

CHERRY
CHERRY

スコア25171

test CHANGED
@@ -42,7 +42,7 @@
42
42
 
43
43
 
44
44
 
45
- 2.Gemfiles の最後にに以下を追加
45
+ 2.Gemfile の最後にに以下を追加
46
46
 
47
47
  ```
48
48
 
@@ -52,7 +52,7 @@
52
52
 
53
53
 
54
54
 
55
- 3.ライブラリのインストール
55
+ 3.Gemのインストール
56
56
 
57
57
  ```
58
58
 
@@ -62,7 +62,7 @@
62
62
 
63
63
 
64
64
 
65
- 4.Instagram の Client_id / client_secret を設定
65
+ 4.Instagram の client_id / client_secret を設定
66
66
 
67
67
 
68
68
 
@@ -240,7 +240,7 @@
240
240
 
241
241
 
242
242
 
243
- 9.実行
243
+ 9.サーバを実行
244
244
 
245
245
  ```
246
246
 

2

rails で動作確認したソースコードを記載

2017/12/08 11:57

投稿

CHERRY
CHERRY

スコア25171

test CHANGED
@@ -11,3 +11,249 @@
11
11
 
12
12
 
13
13
  Sandbox Mode で使えない機能はダメですが、自分の画像は表示できました。
14
+
15
+
16
+
17
+ ----
18
+
19
+
20
+
21
+ (2017.12.08 20:50追記)
22
+
23
+
24
+
25
+ 質問に記載されている URL のサンプルがうまく動かなかったので、修正しようかと思ったのですが、書き直す方が早そうだったので、最低限の確認できるだけの内容で書き直してます。
26
+
27
+ rails 5.0.1 で動作確認しました。
28
+
29
+
30
+
31
+ index で、@a_token を使っていますが、アクセストークンを確認のために view に表示したいだけなので、確認が済んだら消してOKです。
32
+
33
+
34
+
35
+ 1.Rails プロジェクトを作成
36
+
37
+ ```
38
+
39
+ rails new app1
40
+
41
+ ```
42
+
43
+
44
+
45
+ 2.Gemfiles の最後にに以下を追加
46
+
47
+ ```
48
+
49
+ gem 'instagram'
50
+
51
+ ```
52
+
53
+
54
+
55
+ 3.ライブラリのインストール
56
+
57
+ ```
58
+
59
+ bundle install --path vendor/bundle/
60
+
61
+ ```
62
+
63
+
64
+
65
+ 4.Instagram の Client_id / client_secret を設定
66
+
67
+
68
+
69
+ config/initializers/instagram.rb
70
+
71
+ ```
72
+
73
+ require "instagram"
74
+
75
+
76
+
77
+ Instagram.configure do |config|
78
+
79
+ config.client_id = "INSTAGRAM_CLIENT_ID"
80
+
81
+ config.client_secret = "INSTAGRAM_CLIENT_SECRET"
82
+
83
+ end
84
+
85
+ ```
86
+
87
+
88
+
89
+ 5.Home Controller を作成
90
+
91
+ ```
92
+
93
+ rails g controller Home index
94
+
95
+ ```
96
+
97
+
98
+
99
+ 6.app/controllers/home_controller.rb を編集
100
+
101
+ ```
102
+
103
+ class HomeController < ApplicationController
104
+
105
+ require "instagram"
106
+
107
+
108
+
109
+ # Callback URL (環境に合わせて変える)
110
+
111
+ CALLBACK_URL = "http://example.com:3000/auth/instagram/callback"
112
+
113
+
114
+
115
+ def index
116
+
117
+ if session.key? :access_token
118
+
119
+ @a_token = session[:access_token]
120
+
121
+ end
122
+
123
+ end
124
+
125
+
126
+
127
+ # トークン発行URLへのリダイレクト
128
+
129
+ def token
130
+
131
+ redirect_to Instagram.authorize_url(:redirect_uri => CALLBACK_URL)
132
+
133
+ end
134
+
135
+
136
+
137
+ # access_tokenを取得 (コールバック)
138
+
139
+ def get_token
140
+
141
+ response = Instagram.get_access_token(params[:code], :redirect_uri => CALLBACK_URL)
142
+
143
+ session[:access_token] = response.access_token
144
+
145
+ redirect_to "/"
146
+
147
+ end
148
+
149
+
150
+
151
+ # メディアの表示
152
+
153
+ def user_recent_media
154
+
155
+ client = Instagram.client(:access_token => session[:access_token])
156
+
157
+ @medias = client.user_recent_media
158
+
159
+ end
160
+
161
+ end
162
+
163
+ ```
164
+
165
+
166
+
167
+ 7.ビューの作成
168
+
169
+
170
+
171
+ app/views/home/index.html.erb
172
+
173
+ ```
174
+
175
+ <p><%= link_to "instagramにサインイン", "/auth/instagram" %></p>
176
+
177
+ <p><%= link_to "User Recent Media", "/user_recent_media" %> - ユーザーのメディアを表示</p>
178
+
179
+
180
+
181
+ <% if @a_token.present? %>
182
+
183
+ <p>Instagram Access Token : <%= @a_token %> </p>
184
+
185
+ <% end %>
186
+
187
+ ```
188
+
189
+
190
+
191
+ app/views/home/user_recent_media.html.erb
192
+
193
+ ```
194
+
195
+ <p><%= link_to "Home", "/" %></p>
196
+
197
+
198
+
199
+ <% if @medias.present? %>
200
+
201
+ <% @medias.each do |media| %>
202
+
203
+ <%= link_to media.link, :target => "_blank" do %>
204
+
205
+ <%= image_tag(media.images.low_resolution.url) %>
206
+
207
+ <% end %>
208
+
209
+ <% end %>
210
+
211
+ <% end %>
212
+
213
+ ```
214
+
215
+
216
+
217
+ 8.ルート定義
218
+
219
+
220
+
221
+ config/routes.rb
222
+
223
+ ```
224
+
225
+ Rails.application.routes.draw do
226
+
227
+ root 'home#index'
228
+
229
+
230
+
231
+ get "/auth/instagram" => "home#token"
232
+
233
+ get "/auth/instagram/callback" => "home#get_token"
234
+
235
+ get "/user_recent_media" => "home#user_recent_media"
236
+
237
+ end
238
+
239
+ ```
240
+
241
+
242
+
243
+ 9.実行
244
+
245
+ ```
246
+
247
+ bundle exec rails s
248
+
249
+ ```
250
+
251
+
252
+
253
+ webブラウザで、RailsアプリのURL( http://example.com:3000/ )に接続すると 一番上に「instagramにサインイン」のリンクがあると思うので、クリックすると Instagram の画面になって、アプリへの許可画面になるので、許可をしてください。
254
+
255
+ callback に戻って、最下行に 取得できたアクセストークンが、「Instagram Access Token : xxxxxxxxx」と表示されると思います。
256
+
257
+
258
+
259
+ 「User Recent Media」のリンクをクリックすると　ユーザーの画像を表示できると思います。（エラーチェックとかしていないので、Instagram にサインインしていない状態で、User Recent Media をクリックするとエラー画面になります。）

1

修正

2017/12/08 11:55

投稿

CHERRY
CHERRY

スコア25171

test CHANGED
@@ -2,9 +2,11 @@
2
2
 
3
3
 
4
4
 
5
+ ----
5
6
 
6
7
 
7
- [facebookarchive/instagram-ruby-gem](https://github.com/facebookarchive/instagram-ruby-gem) のサンプルがほぼそのまま動きそうだったので、 CALLBACK_URL / client_id / client_secret あたりを変更して、実行してみた感じでは、問題なく access_token が、取得できています。
8
+
9
+ gem 'instagram' ということなので、ruby の ライブラリと判断して、[facebookarchive/instagram-ruby-gem](https://github.com/facebookarchive/instagram-ruby-gem) のサンプルが、ほぼそのまま動きそうな感じだったので、 CALLBACK_URL / client_id / client_secret あたりを変更して、実行してみた感じでは、問題なく access_token が、取得できています。
8
10
 
9
11
 
10
12