Authentication failure! invalid_credentials: OAuth::Unauthorized, 401 Authorization Required Process

Question

Ruby初学者です。
現在ポートフォリオのTwitterログイン機能を実装しています。

Twitterログインボタンを押すことで、Twitter承認画面が表示されるのですが、
結果的にログインができないです。

エラー

Authentication failure! invalid_credentials: OAuth::Unauthorized, 401 Authorization Required
Processing by Users::OmniauthCallbacksController#failure as HTML
  Parameters: {"oauth_token"=>"hogehogehogehogehogehogehogehoge", "oauth_verifier"=>"gehogehogehogehogehogehogehogehogehogehogehogeho"

ご教授頂けますと幸いです。
よろしくお願い致します。

initializers/devise.rb

config.omniauth :twitter, ENV['TWITTER_API_KEY'], ENV['TWITTER_API_SECRET'], scope: 'email', oauth_callback: "#{ENV['HOST']}/users/auth/twitter/callback"

user.rb

class User < ApplicationRecord
  devise :omniauthable, omniauth_providers: %i[facebook twitter google_oauth2]
  # omniauthのコールバック時に呼ばれるメソッド
  def self.from_omniauth(auth)
    where(provider: auth.provider, uid: auth.uid).first_or_create do |user|
      user.email = auth.info.email
      user.password = Devise.friendly_token[0,20]
    end
  end
end

controllers/users/omniauth_callbacks_controller.rb

class Users::OmniauthCallbacksController < Devise::OmniauthCallbacksController

  # callback for twitter
  def twitter
    callback_for(:twitter)
  end

  def callback_for(provider)
    @user = User.from_omniauth(request.env["omniauth.auth"])
    if @user.persisted?
      sign_in_and_redirect @user, event: :authentication #this will throw if @user is not activated
      set_flash_message(:notice, :success, kind: "#{provider}".capitalize) if is_navigational_format?
    else
      session["devise.#{provider}_data"] = request.env["omniauth.auth"].except("extra")
      redirect_to new_user_registration_url
    end
  end

  def failure
    redirect_to root_path
  end
end

initializa/omniauth.rb

Rails.application.config.middleware.use OmniAuth::Builder do
  provider :twitter, 'fkokoskjdjgfjkjdjgfjsKAiq', 'fkokoskjdjgfjBfkokfkokoskjdjgfj'
end

API keyは適当に書いています。

【参考にした記事】
https://qiita.com/kazuooooo/items/47e7d426cbb33355590e#omniauth

Answer 1

Twitter側のコールバックURLを適切に設定してください。

http://localhost:3000/users/auth/twitter/callback
http://localhost:3000/