戻る

Rails6.0


動画学習サイトの構築 Rails6.0

  (0)
2,000円

タスク2-8   Google認証

このタスクについて


タスクの内容を一部抜粋します。
プロジェクトを購入していただくとこのタスクの内容の全てを読みやすい表示で見ることができます。
プログラムコードが色分けされて見やすくなります。
プログラムコードに行番号が付きます。
本文が色分けされて見やすくなります。
そしてこのアプリケーションのフルコードをダウンロードすることが可能になります。




Google Cloud PlatformにGoogleアカウントでログインしてAPIキーを取得してください。
手順は以下の通りにお願いします。
mrradiology.hatenablog.jp


GemFileに以下の記述を追加します。


記述追加 GemFile(63行目)
 gem 'omniauth' 
gem 'omniauth-google-oauth2' 



GemFile
 
source 'https://rubygems.org' 
git_source(:github) { |repo| "https://github.com/#{repo}.git" } 
ruby '2.6.6' 
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails' 
gem 'rails', '~> 6.0.3', '>= 6.0.3.1' 
# Use postgresql as the database for Active Record 
gem 'pg', '>= 0.18', '< 2.0' 
# Use Puma as the app server 
gem 'puma', '~> 4.1' 
# Use SCSS for stylesheets 
gem 'sass-rails', '>= 6' 
# Transpile app-like JavaScript. Read more: https://github.com/rails/webpacker 
gem 'webpacker', '~> 4.0' 
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks 
gem 'turbolinks', '~> 5' 
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder 
gem 'jbuilder', '~> 2.7' 
# Use Redis adapter to run Action Cable in production 
# gem 'redis', '~> 4.0' 
# Use Active Model has_secure_password 
# gem 'bcrypt', '~> 3.1.7' 
# Use Active Storage variant 
# gem 'image_processing', '~> 1.2' 
# Reduces boot times through caching; required in config/boot.rb 
gem 'bootsnap', '>= 1.4.2', require: false 
group :development, :test do 
  # Call 'byebug' anywhere in the code to stop execution and get a debugger console 
  gem 'byebug', platforms: [:mri, :mingw, :x64_mingw] 
end 
group :development do 
  # Access an interactive console on exception pages or by calling 'console' anywhere in the code. 
  gem 'web-console', '>= 3.3.0' 
end 
group :test do 
  # Adds support for Capybara system testing and selenium driver 
  gem 'capybara', '>= 2.15' 
  gem 'selenium-webdriver' 
  # Easy installation and use of web drivers to run system tests with browsers 
  gem 'webdrivers' 
end 
# Windows does not include zoneinfo files, so bundle the tzinfo-data gem 
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby] 

# Bulma 
gem 'bulma-rails', '~> 0.7.4' 
gem 'bulma-extensions-rails', '~> 1.0.30' 

#デバイス 
gem 'devise' 

# 日本語化 
gem 'rails-i18n' 

# google認証 
gem 'omniauth' 
gem 'omniauth-google-oauth2' 



コマンド
bundle


ユーザテーブルにプロバイダー認証のカラムを追加します。


コマンド(2つ)
rails g migration AddGoogleColumsToUser provider uid image


rails db:migrate


「config\initializers\devise.rb」に以下の記述を追加します。


記述追加 config\initializers\devise.rb(315行目)
「クライアントID」と「クライアントシークレット」はご自分のものを入れて下さい。
   #クライアントID 26192823466 
  #クライアントシークレット c2wzpwWF 
  config.omniauth :google_oauth2, 
    '261928234', 
    'c2wzpwW', 
    {access_type: "offline", approval_prompt: "", skip_jwt: true} 



config\initializers\devise.rb
 
# frozen_string_literal: true 
# Assuming you have not yet modified this file, each configuration option below 
# is set to its default value. Note that some are commented out while others 
# are not: uncommented lines are intended to protect your configuration from 
# breaking changes in upgrades (i.e., in the event that future versions of 
# Devise change the default values for those options). 
# 
# Use this hook to configure devise mailer, warden hooks and so forth. 
# Many of these configuration options can be set straight in your model. 
Devise.setup do |config| 
  # The secret key used by Devise. Devise uses this key to generate 
  # random tokens. Changing this key will render invalid all existing 
  # confirmation, reset password and unlock tokens in the database. 
  # Devise will use the `secret_key_base` as its `secret_key` 
  # by default. You can change it below and use your own secret key. 
  # config.secret_key = '021fcdf799403ffc608a9db54959edb40479b73c6bf88d3395059250137a06c6f9589a55af498f56fe2f9946dcf35ada8ae506f1fc14ad4316bcc3018e69a374' 
  # ==> Controller configuration 
  # Configure the parent class to the devise controllers. 
  # config.parent_controller = 'DeviseController' 
  # ==> Mailer Configuration 
  # Configure the e-mail address which will be shown in Devise::Mailer, 
  # note that it will be overwritten if you use your own mailer class 
  # with default "from" parameter. 
  # config.mailer_sender = 'please-change-me-at-config-initializers-devise@example.com' 
  config.mailer_sender = 'win.rails.learn@gmail.com' 
  # Configure the class responsible to send e-mails. 
  # config.mailer = 'Devise::Mailer' 
  # Configure the parent class responsible to send e-mails. 
  # config.parent_mailer = 'ActionMailer::Base' 
  # ==> ORM configuration 
  # Load and configure the ORM. Supports :active_record (default) and 
  # :mongoid (bson_ext recommended) by default. Other ORMs may be 
  # available as additional gems. 
  require 'devise/orm/active_record' 
  # ==> Configuration for any authentication mechanism 
  # Configure which keys are used when authenticating a user. The default is 
  # just :email. You can configure it to use [:username, :subdomain], so for 
  # authenticating a user, both parameters are required. Remember that those 
  # parameters are used only when authenticating and not when retrieving from 
  # session. If you need permissions, you should implement that in a before filter. 
  # You can also supply a hash where the value is a boolean determining whether 
  # or not authentication should be aborted when the value is not present. 
  # config.authentication_keys = [:email] 
  # Configure parameters from the request object used for authentication. Each entry 
  # given should be a request method and it will automatically be passed to the 
  # find_for_authentication method and considered in your model lookup. For instance, 
  # if you set :request_keys to [:subdomain], :subdomain will be used on authentication. 
  # The same considerations mentioned for authentication_keys also apply to request_keys. 
  # config.request_keys = [] 
  # Configure which authentication keys should be case-insensitive. 
  # These keys will be downcased upon creating or modifying a user and when used 
  # to authenticate or find a user. Default is :email. 
  config.case_insensitive_keys = [:email] 
  # Configure which authentication keys should have whitespace stripped. 
  # These keys will have whitespace before and after removed upon creating or 
  # modifying a user and when used to authenticate or find a user. Default is :email. 
  config.strip_whitespace_keys = [:email] 
  # Tell if authentication through request.params is enabled. True by default. 
  # It can be set to an array that will enable params authentication only for the 
  # given strategies, for example, `config.params_authenticatable = [:database]` will 
  # enable it only for database (email + password) authentication. 
  # config.params_authenticatable = true 
  # Tell if authentication through HTTP Auth is enabled. False by default. 
  # It can be set to an array that will enable http authentication only for the 
  # given strategies, for example, `config.http_authenticatable = [:database]` will 
  # enable it only for database authentication. 
  # For API-only applications to support authentication "out-of-the-box", you will likely want to 
  # enable this with :database unless you are using a custom strategy. 
  # The supported strategies are: 
  # :database      = Support basic authentication with authentication key + password 
  # config.http_authenticatable = false 
  # If 401 status code should be returned for AJAX requests. True by default. 
  # config.http_authenticatable_on_xhr = true 
  # The realm used in Http Basic Authentication. 'Application' by default. 
  # config.http_authentication_realm = 'Application' 
  # It will change confirmation, password recovery and other workflows 
  # to behave the same regardless if the e-mail provided was right or wrong. 
  # Does not affect registerable. 
  # config.paranoid = true 
  # By default Devise will store the user in session. You can skip storage for 
  # particular strategies by setting this option. 
  # Notice that if you are skipping storage for all authentication paths, you 
  # may want to disable generating routes to Devise's sessions controller by 
  # passing skip: :sessions to `devise_for` in your config/routes.rb 
  config.skip_session_storage = [:http_auth] 
  # By default, Devise cleans up the CSRF token on authentication to 
  # avoid CSRF token fixation attacks. This means that, when using AJAX 
  # requests for sign in and sign up, you need to get a new CSRF token 
  # from the server. You can disable this option at your own risk. 
  # config.clean_up_csrf_token_on_authentication = true 
  # When false, Devise will not attempt to reload routes on eager load. 
  # This can reduce the time taken to boot the app but if your application 
  # requires the Devise mappings to be loaded during boot time the application 
  # won't boot properly. 
  # config.reload_routes = true 
  # ==> Configuration for :database_authenticatable 
  # For bcrypt, this is the cost for hashing the password and defaults to 12. If 
  # using other algorithms, it sets how many times you want the password to be hashed. 
  # The number of stretches used for generating the hashed password are stored 
  # with the hashed password. This allows you to change the stretches without 
  # invalidating existing passwords. 
  # 
  # Limiting the stretches to just one in testing will increase the performance of 
  # your test suite dramatically. However, it is STRONGLY RECOMMENDED to not use 
  # a value less than 10 in other environments. Note that, for bcrypt (the default 
  # algorithm), the cost increases exponentially with the number of stretches (e.g. 
  # a value of 20 is already extremely slow: approx. 60 seconds for 1 calculation). 
  config.stretches = Rails.env.test? ? 1 : 12 
  # Set up a pepper to generate the hashed password. 
  # config.pepper = '9d6bb92cd546cc92f8c24b81fa358657992af958e2a47ce130476a9949e81a7bd142e9c13d6de21dd5c7e8e6d87e83110cf8771d01c8d8a4a767a64a6e6c1bb3' 
  # Send a notification to the original email when the user's email is changed. 
  # config.send_email_changed_notification = false 
  # Send a notification email when the user's password is changed. 
  # config.send_password_change_notification = false 
  # ==> Configuration for :confirmable 
  # A period that the user is allowed to access the website even without 
  # confirming their account. For instance, if set to 2.days, the user will be 
  # able to access the website for two days without confirming their account, 
  # access will be blocked just in the third day. 
  # You can also set it to nil, which will allow the user to access the website 
  # without confirming their account. 
  # Default is 0.days, meaning the user cannot access the website without 
  # confirming their account. 
  # config.allow_unconfirmed_access_for = 2.days 
  # A period that the user is allowed to confirm their account before their 
  # token becomes invalid. For example, if set to 3.days, the user can confirm 
  # their account within 3 days after the mail was sent, but on the fourth day 
  # their account can't be confirmed with the token any more. 
  # Default is nil, meaning there is no restriction on how long a user can take 
  # before confirming their account. 
  # config.confirm_within = 3.days 
  # If true, requires any email changes to be confirmed (exactly the same way as 
  # initial account confirmation) to be applied. Requires additional unconfirmed_email 
  # db field (see migrations). Until confirmed, new email is stored in 
  # unconfirmed_email column, and copied to email column on successful confirmation. 
  config.reconfirmable = false 
  # Defines which key will be used when confirming an account 
  # config.confirmation_keys = [:email] 
  # ==> Configuration for :rememberable 
  # The time the user will be remembered without asking for credentials again. 
  # config.remember_for = 2.weeks 
  # Invalidates all the remember me tokens when the user signs out. 
  config.expire_all_remember_me_on_sign_out = true 
  # If true, extends the user's remember period when remembered via cookie. 
  # config.extend_remember_period = false 
  # Options to be passed to the created cookie. For instance, you can set 
  # secure: true in order to force SSL only cookies. 
  # config.rememberable_options = {} 
  # ==> Configuration for :validatable 
  # Range for password length. 
  config.password_length = 6..128 
  # Email regex used to validate email formats. It simply asserts that 
  # one (and only one) @ exists in the given string. This is mainly 
  # to give user feedback and not to assert the e-mail validity. 
  config.email_regexp = /\A[^@\s]+@[^@\s]+\z/ 
  # ==> Configuration for :timeoutable 
  # The time you want to timeout the user session without activity. After this 
  # time the user will be asked for credentials again. Default is 30 minutes. 
  # config.timeout_in = 30.minutes 
  # ==> Configuration for :lockable 
  # Defines which strategy will be used to lock an account. 
  # :failed_attempts = Locks an account after a number of failed attempts to sign in. 
  # :none            = No lock strategy. You should handle locking by yourself. 
  # config.lock_strategy = :failed_attempts 
  # Defines which key will be used when locking and unlocking an account 
  # config.unlock_keys = [:email] 
  # Defines which strategy will be used to unlock an account. 
  # :email = Sends an unlock link to the user email 
  # :time  = Re-enables login after a certain amount of time (see :unlock_in below) 
  # :both  = Enables both strategies 
  # :none  = No unlock strategy. You should handle unlocking by yourself. 
  # config.unlock_strategy = :both 
  # Number of authentication tries before locking an account if lock_strategy 
  # is failed attempts. 
  # config.maximum_attempts = 20 
  # Time interval to unlock the account if :time is enabled as unlock_strategy. 
  # config.unlock_in = 1.hour 
  # Warn on the last attempt before the account is locked. 
  # config.last_attempt_warning = true 
  # ==> Configuration for :recoverable 
  # 
  # Defines which key will be used when recovering the password for an account 
  # config.reset_password_keys = [:email] 
  # Time interval you can reset your password with a reset password key. 
  # Don't put a too small interval or your users won't have the time to 
  # change their passwords. 
  config.reset_password_within = 6.hours 
  # When set to false, does not sign a user in automatically after their password is 
  # reset. Defaults to true, so a user is signed in automatically after a reset. 
  # config.sign_in_after_reset_password = true 
  # ==> Configuration for :encryptable 
  # Allow you to use another hashing or encryption algorithm besides bcrypt (default). 
  # You can use :sha1, :sha512 or algorithms from others authentication tools as 
  # :clearance_sha1, :authlogic_sha512 (then you should set stretches above to 20 
  # for default behavior) and :restful_authentication_sha1 (then you should set 
  # stretches to 10, and copy REST_AUTH_SITE_KEY to pepper). 
  # 
  # Require the `devise-encryptable` gem when using anything other than bcrypt 
  # config.encryptor = :sha512 
  # ==> Scopes configuration 
  # Turn scoped views on. Before rendering "sessions/new", it will first check for 
  # "users/sessions/new". It's turned off by default because it's slower if you 
  # are using only default views. 
  # config.scoped_views = false 
  # Configure the default scope given to Warden. By default it's the first 
  # devise role declared in your routes (usually :user). 
  # config.default_scope = :user 
  # Set this configuration to false if you want /users/sign_out to sign out 
  # only the current scope. By default, Devise signs out all scopes. 
  # config.sign_out_all_scopes = true 
  # ==> Navigation configuration 
  # Lists the formats that should be treated as navigational. Formats like 
  # :html, should redirect to the sign in page when the user does not have 
  # access, but formats like :xml or :json, should return 401. 
  # 
  # If you have any extra navigational formats, like :iphone or :mobile, you 
  # should add them to the navigational formats lists. 
  # 
  # The "*/*" below is required to match Internet Explorer requests. 
  # config.navigational_formats = ['*/*', :html] 
  # The default HTTP method used to sign out a resource. Default is :delete. 
  config.sign_out_via = :delete 
  # ==> OmniAuth 
  # Add a new OmniAuth provider. Check the wiki for more information on setting 
  # up on your models and hooks. 
  # config.omniauth :github, 'APP_ID', 'APP_SECRET', scope: 'user,public_repo' 
  # ==> Warden configuration 
  # If you want to use other strategies, that are not supported by Devise, or 
  # change the failure app, you can configure them inside the config.warden block. 
  # 
  # config.warden do |manager| 
  #   manager.intercept_401 = false 
  #   manager.default_strategies(scope: :user).unshift :some_external_strategy 
  # end 
  # ==> Mountable engine configurations 
  # When using Devise inside an engine, let's call it `MyEngine`, and this engine 
  # is mountable, there are some extra configurations to be taken into account. 
  # The following options are available, assuming the engine is mounted as: 
  # 
  #     mount MyEngine, at: '/my_engine' 
  # 
  # The router that invoked `devise_for`, in the example above, would be: 
  # config.router_name = :my_engine 
  # 
  # When using OmniAuth, Devise cannot automatically set OmniAuth path, 
  # so you need to do it manually. For the users scope, it would be: 
  # config.omniauth_path_prefix = '/my_engine/users/auth' 
  # ==> Turbolinks configuration 
  # If your app is using Turbolinks, Turbolinks::Controller needs to be included to make redirection work correctly: 
  # 
  # ActiveSupport.on_load(:devise_failure_app) do 
  #   include Turbolinks::Controller 
  # end 
  # ==> Configuration for :registerable 
  # When set to false, does not sign a user in automatically after their password is 
  # changed. Defaults to true, so a user is signed in automatically after changing a password. 
  # config.sign_in_after_change_password = true 

  #クライアントID 2619282346 
  #クライアントシークレット c2wzpwW 
  config.omniauth :google_oauth2, 
    '26192823466m', 
    'c2wzpwW', 
    {access_type: "offline", approval_prompt: "", skip_jwt: true} 
end 



「app\models\user.rb」ファイルに以下の記述を追加します。


1.6行目に「, :omniauthable」の記述を追加
   devise :database_authenticatable, :registerable, 
         :recoverable, :rememberable, :validatable, 
         :confirmable, :omniauthable 



2.記述追加 app\models\user.rb(11行目)
 
  def self.from_omniauth(auth) 
    user = User.where(email: auth.info.email).first 
    if user 
      return user 
    else 
      where(provider: auth.provider, uid: auth.uid).first_or_create do |user| 
        user.email = auth.info.email 
        user.password = Devise.friendly_token[0, 20] 
        user.full_name = auth.info.name   # ユーザーモデルに名前があると仮定 
        user.image = auth.info.image # ユーザーモデルに画像があると仮定 
        user.uid = auth.uid 
        user.provider = auth.provider 
      end 
    end 
  end 


記述追加 app\models\user.rb
 
class User < ApplicationRecord 

  # Include default devise modules. Others available are: 
  # :confirmable, :lockable, :timeoutable, :trackable and :omniauthable 
  devise :database_authenticatable, :registerable, 
         :recoverable, :rememberable, :validatable, 
         :confirmable, :omniauthable 

  #長さ50文字以下 入力必須 
  validates :full_name, presence: true, length: {maximum: 50} 

  def self.from_omniauth(auth) 
    user = User.where(email: auth.info.email).first 
    if user 
      return user 
    else 
      where(provider: auth.provider, uid: auth.uid).first_or_create do |user| 
        user.email = auth.info.email 
        user.password = Devise.friendly_token[0, 20] 
        user.full_name = auth.info.name   # ユーザーモデルに名前があると仮定 
        user.image = auth.info.image # ユーザーモデルに画像があると仮定 
        user.uid = auth.uid 
        user.provider = auth.provider 
      end 
    end 
  end  
end 



「app\controllers」フォルダに「omniauth_callbacks_controller.rb」ファイルを新規作成して下さい。


app\controllers\omniauth_callbacks_controller.rb(新規作成したファイル)
 
class OmniauthCallbacksController < Devise::OmniauthCallbacksController 

    def google_oauth2 
      # 以下のメソッドをモデルに実装する必要があります(app/models/user.rb) 
      @user = User.from_omniauth(request.env['omniauth.auth']) 
  
      if @user.persisted? 
        flash[:notice] = I18n.t 'devise.omniauth_callbacks.success', kind: 'Google' 
        sign_in_and_redirect @user, event: :authentication 
      else 
        session['devise.google_data'] = request.env['omniauth.auth'].except(:extra) 
        redirect_to new_user_registration_url, alert: @user.errors.full_messages.join("\n") 
      end 
    end 
  
    def failure 
      redirect_to root_path 
    end 
end 
  



「Googleでログイン」ボタンをつけます。


「app\views\devise\sessions\new.html.erb」ファイルに以下の記述を追加します。


記述追加 app\views\devise\sessions\new.html.erb(31行目)
<%= link_to "Googleでログイン", user_google_oauth2_omniauth_authorize_path, class: "button is-primary is-fullwidth" %>



app\views\devise\sessions\new.html.erb
 
<section class="hero is-light is-fullheight"> 
  <div class="hero-body"> 
    <div class="container"> 
      <div class="columns is-centered"> 
        <div class="column is-6-table is-6-desktop is-6-widescreen"> 
          <div class="box"> 
            
            <div class="field has-text-centered"> 
              <strong>ログイン</strong> 
            </div> 
            <%= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %> 
              <div class="field"> 
                <%= f.label :メールアドレス, class: "label" %> 
                <%= f.email_field :email, autofocus: true, autocomplete: "email", class: "input" %> 
              </div> 
              <div class="field"> 
                <%= f.label :パスワード, class: "label" %> 
                <%= f.password_field :password, autocomplete: "current-password", class: "input" %> 
              </div> 
              <% if devise_mapping.rememberable? %> 
                <div class="field"> 
                  <%= f.check_box :remember_me %> 
                  <%= f.label :ログインを保持する %> 
                </div> 
              <% end %> 
              <div class="field"> 
                <%= f.submit "ログインする", class: "button is-danger is-fullwidth m-t-10 m-b-10" %> 
              </div> 
            <% end %> 
            <%= link_to "Googleでログイン", user_google_oauth2_omniauth_authorize_path, class: "button is-primary is-fullwidth" %> 
            <%= render "devise/shared/links" %> 
          </div> 
        </div> 
      </div> 
    </div> 
  </div> 
</section> 





この続きはプロジェクトを購入していただくことで見ることができます。
プロジェクトを購入していただくとこのタスクの内容の全てを読みやすい表示で見ることができます。
プログラムコードが色分けされて見やすくなります。
プログラムコードに行番号が付きます。
本文が色分けされて見やすくなります。
そしてプロジェクトを購入するとこのアプリケーションのフルコードをダウンロードすることができます。

まだレビューはありません。

動画学習サイトの構築 Rails6.0

2,000円

Rails6.0で作成しています。
動画で学べるサイトを構築するプロジェクトです。
プロジェクトを登録し、そのプロジェクトに動画を登録できます。
プロジェクトはクレジットカードで購入でき、購入後すぐに動画を見ることができます。
写真の複数アップロード、レビュー機能の実装、Google認証、アマゾンS3の利用方法も解説。
管理ダッシュボードtrestleの実装、Gメールの設定、 HEROKUへのデプロイ方法を解説。
質問があればメッセージを送ることができ、リアルタイムで会話表示することができます。
フルコードのダウンロード可能。

タスク数: 128