Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationEventAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
3
Help us understand the problem. What are the problem?

More than 1 year has passed since last update.

posted at

updated at

Organization

Twitterログイン 401 Authorization Required

概要

SorceryのExternalを使ってTwitterログイン機能を実装中のエラー解消。
とりあえずこの記事を参考に解消しようとしたけど無理だったのでデバッグしていくことにした。

ブラウザのエラー画面

ログインボタンでOauthsController/oauthへリクエスト、コールバックで401 Authorization Required
Image from Gyazo

ログをみる

log/development.log

Image from Gyazo

うまくリダイレクトできてないようだが原因がわからない

Unpermitted parameters: :oauth_token, :oauth_verifierがあるのでOauthsController/auth_paramsへ追加してみるもエラーは変わらず。

binding.pryで止めてみる

Image from Gyazo

login_from(provider)ここでtrueでもfalseでもnilでもなくエラーが入っている?
最終行にfrom/Users/...consumer.rb:236とあるのでgemの中を見に行く。

consumer.rbでpry

1回目
Twitter側に行く際の挙動?

Image from Gyazo

response 200
response.body oauth_tokenとoauth_token_secretが格納されている

問題なさそうなのでexitで抜ける

2回目
Twitter側で認証処理をする?

Image from Gyazo

response 200
response.body oauth_tokenとoauth_token_secretが格納されている

1回目と全く同じ
exitで抜ける

3回目
アプリ側に戻ってくる(コールバック)時の処理?

Image from Gyazo

response 401 Authorization Required
response.body Error processing your OAuth request: Invalid oauth_verifier parameter

やっと検索できそうなエラーメッセージが出てきたので検索。

Error processing your OAuth request: Invalid oauth_verifier parameter

片っ端から見ていったけどどれもうまくいかない。
コールバック処理っぽい時にエラー出てたのでそこら辺を見ていくことに。

コールバックあたりをごにょごにょ

[Twitter Developerに登録してるコールバックURL]
Image from Gyazo

[アプリケーション側で設定してるコールバックURL]
Image from Gyazo

クエリがついてるかついてないかだけでURLの整合性は取れている。
ここで詰みかける。
他のURLでも試そうと思いngrokなるものを使ってみた。

ngrokでローカル環境を外部に公開

この記事を参考にセットアップする。
一時的にドメインを取得できる?感じのツールだと認識している。

$ brew cask install ngrok
$ ngrok http 3000

ngrok by @inconshreveable                                                                                                                                         (Ctrl+C to quit)

Session Status                online
Session Expires               5 hours, 17 minutes
Version                       2.3.35
Region                        United States (us)
Web Interface                 http://127.0.0.1:4040
Forwarding                    http://377716c9.ngrok.io -> http://localhost:3000
Forwarding                    https://377716c9.ngrok.io -> http://localhost:3000

Twitter Developereを更新
Image from Gyazo

アプリケーションのコールバックURLも更新
Image from Gyazo

サーバー再起動を忘れずに

ctrl + c
$ rails s

http://377716c9.ngrok.ioへアクセス
ログインしてみると・・・成功した!!!!!!!!!!!!
なんで?

解決

2つの違いを比べてみるとコールバックURLが完全一致してるかどうかだけ。
試しにhttp://localhost:3000/ではなくhttp://127.0.0.1:3000/にアクセスしてログインすると成功した。

127.0.0.1はIPアドレスでそのドメインがlocalhostなので同じ意味だろうと高を括っていたのが原因でした。

※ SorceryのGithubだとコールバックURLがhttp://0.0.0.0:3000/oauth/callback?provider=facebookになってるから、この設定でhttp://localhost:3000にアクセスするとエラーでるから気をつけて。

Why not register and get more from Qiita?
  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
3
Help us understand the problem. What are the problem?