如何在Rails应用程序中使用OmniAuth-Twitter

最新推荐文章于 2024-09-11 07:32:39 发布

cunjie3951

最新推荐文章于 2024-09-11 07:32:39 发布

阅读量235

点赞数

文章标签： java python 安全数据库 git

在本教程中，您将学习如何允许应用程序的用户使用其Twitter帐户登录。使用OAuth等工具可以轻松做到这一点。

您将使用OmniAuth-Twitter ，其中包含OmniAuth的Twitter策略。

让我们潜入吧！

入门

首先生成您的Rails应用程序。在您的终端上，运行命令来这样做：

rails new Tuts-Social -T

打开您的Gemfile并添加引导程序gem。

#Gemfile
...

gem 'bootstrap-sass'

通过运行以下命令安装gem：

bundle install

将app/assets/stylesheets/application.css重命名为app/assets/stylesheets/application.scs 。

完成后，添加以下代码行以导入引导程序。

#app/assets/stylesheets/application.scss
...
@import 'bootstrap-sprockets';
@import 'bootstrap';

创建一个名为_navigation.html.erb的部分代码，以保存您的导航代码；部分内容应位于app/views/layouts目录中。

在IDE中输入以下代码。它使用Bootstrap为您的应用程序创建导航栏。

#app/views/layouts/_navigation.html.erb

<nav class="navbar navbar-inverse">
  <div class="container">
    <div class="navbar-header">
      <%= link_to 'Tuts Social', root_path, class: 'navbar-brand' %>
    </div>
    <div id="navbar">
 
    <ul class="nav navbar-nav pull-right">
      <li><%= link_to 'Home', root_path %></li>
  </ul>
    </div>
  </div>
</nav>

为了使用导航，您需要在应用程序布局中呈现它。调整您的应用程序布局，使其看起来像我下面的内容。

#app/views/layouts/application.html.erb

<!DOCTYPE html>
<html>
  <head>
    <title>Tuts Social</title>
    <%= csrf_meta_tags %>

    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
  </head>

  <body>
    <%= render "layouts/navigation" %>
    <div id="flash">
      <% flash.each do |key, value| %>
        <div class="flash <%= key %>"><%= value %></div>
      <% end %>
    </div>
    <div class="container-fluid">
      <%= yield %>
    </div>
  </body>
</html>

通过在您的终端中输入以下命令来生成带有索引操作的PagesController 。

rails generated controller Pages index

在生成的索引视图中，对其进行编辑，使其如下所示。

#app/views/pages/index.html.erb 

<div class="jumbotron">
  <h1>Welcome to Tuts Social!</h1>
  <p>Thanks for checking us out!</p>
</div>

在上面的代码中，我们使用了一个称为jumbotron的类-这是一个Bootstrap组件，它使我们能够扩展视口以展示营销信息。您可以从Bootstrap文档中找到有关它的更多信息。

打开路由文件以添加root_path 。

#config/routes.rb

Rails.application.routes.draw do
  # For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html

  root to: "pages#index"
end

设置OmniAuth-Twitter

您需要创建一个新的Twitter应用程序。转到Twitter开发人员页面中的此页面以创建一个页面。输入所有必要的详细信息，类似于下面的屏幕快照中的内容。

对于回调URL，输入您的网站地址以及“身份验证/转发/回调”。如果您恰巧在本地计算机上，则回调URL应为： http://127.0.0.1:3000/auth/twitter/callback : http://127.0.0.1:3000/auth/twitter/callback : http://127.0.0.1:3000/auth/twitter/callback callback。

您将被重定向到Twitter上该应用程序的信息页面。导航到“ 密钥和访问令牌”选项卡以获取密钥。复制“消费者密钥”和“消费者秘密”并将其粘贴在安全的地方-我们将在不久后使用它们。

回调URL是成功进行身份验证和批准的授权后，用户将重定向到应用内部的URL（请求还将包含用户的数据和令牌）。所有OmniAuth策略都希望回调URL等于“ / auth /：provider / callback”。 :provider采用策略的名称。在这种情况下，策略将是“ twitter”，因为您将在初始化程序中列出。

打开您的Gemfile ，添加omniauth - twiiter gem。

#Gemfile
...

gem 'omniauth-twitter'

现在，在config / initializers目录中为OmniAuth创建一个初始化程序。这将保存OmniAuth的配置。使它看起来像我下面的内容。

#config/initializers/omniauth.rb

Rails.application.config.middleware.use OmniAuth::Builder do
  provider :twitter, ENV['TWITTER_KEY'], ENV['TWITTER_SECRET']
end

此时，您需要使用密钥并访问安全存储的令牌。您需要确保这些文件的安全，因为您不想在提交代码时将其推送到公共存储库。

您将为此使用宝石。再次打开您的Gemfile并添加以下宝石。像这样将其添加到您的Gemfile中：

#Gemfile

...
group :development, :test do
  ...
  gem 'dotenv-rails'
...

要安装gem，请运行。

bundle install

在应用程序的主目录中，创建一个名为.env的文件。

打开它并添加您的密钥和令牌，如下所示：

#.env

TWITTER_KEY=xxxxxxxxxxxxxx
TWITTER_SECRET=xxxxxxxxxxxxxx

打开.gitignore并添加刚创建的文件。

#.gitignore

...
# Ignore .env used for storing keys and access tokens
.env

完成此操作后，您的密钥和访问令牌是安全的！要了解有关如何使用dotenv -rails ，请参阅GitHub页面。

是时候在您的路线上工作了。打开您的路线文件，然后在下面添加路线。

#config/routes.rb

...
  get '/auth/:provider/callback', to: 'sessions#create'

您需要将Twitter登录的链接添加到导航中。打开导航文件并对其进行调整，使其看起来像这样。

<nav class="navbar navbar-default">
    <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Tuts Social</a>
    </div>
    <div class="collapse navbar-collapse" id="navbar-collapse">
    	<ul class="nav navbar-nav navbar-right">
        <li><%= link_to 'Home', root_path %></li>
        <% if current_user %>
          <li>Signed in as <%= current_user.name %></li>
        <% else %>
          <li><%= link_to "Sign in with Twitter", "/auth/twitter" %></li>
        <% end %>
    	</ul>
    </div>
  </div>
</nav>

通过以上内容，您只想显示仅当用户未登录时才能使用Twitter登录的链接。

创建会议

您将需要一个会话控制器来处理用户的登录。在您的controllers目录中为该文件创建一个文件；这就是它的外观。

create操作有助于为用户创建会话，以便他们可以登录到您的应用程序。没有这个，用户将无法登录。

#app/controllers/sessions_controller.rb

class SessionsController < ApplicationController
  def create
    @user = User.find_or_create_from_auth_hash(auth_hash)
    session[:user_id] = @user.id
    redirect_to root_path
  end

  protected

  def auth_hash
    request.env['omniauth.auth']
  end
end

此时，您将需要一个current_user方法。这将帮助您检查用户是否已登录或注销。

打开app/controllers/application_controller.rb并添加以下内容。

#app/controllers/application_controller.rb

...
  def current_user
    @current_user ||= User.find(session[:user_id]) if session[:user_id]
  end
  helper_method :current_user
...

用户模型

现在为您的用户生成一个模型。运行命令来执行此操作。

rails generated modoel User provider:string uid:string name:string token:string secret:string profile_image:string

那应该生成一个看起来像这样的迁移文件。

#xxxxxx_create_users.rb

class CreateUsers < ActiveRecord::Migration[5.0]
  def change
    create_table :users do |t|
      t.string :provider
      t.string :uid
      t.string :name
      t.string :token
      t.string :secret
      t.string :profile_image

      t.timestamps
    end
  end
end

现在，通过运行以下命令迁移数据库：

rake db:migrate

打开您的用户模型，使其如下所示：

#app/models/user.rb

class User < ApplicationRecord
  def self.find_or_create_from_auth_hash(auth_hash)
    user = where(provider: auth_hash.provider, uid: auth_hash.uid).first_or_create
    user.update(
      name: auth_hash.info.nickname,
      profile_image: auth_hash.info.image,
      token: auth_hash.credentials.token,
      secret: auth_hash.credentials.secret
    )
    user
  end
end

上面的代码存储了属于用户的一些信息。这包括用户的名称，profile_image，令牌和秘密。如果您的应用程序需要的还不止此，您可以签出OmniAuth-Twitter页面。

删除工作阶段

在您的应用程序中，您想为用户提供注销的能力。您需要在SessionsController执行destroy操作才能使其工作。然后，链接将添加到您的导航中。

将destroy操作添加到您的SessionsController 。

#app/controllers/sessions_controller.rb

...
  def destroy
    if current_user
      session.delete(:user_id)
      flash[:success] = "Sucessfully logged out!"
    end
    redirect_to root_path
  end
...

然后添加此链接以注销到导航，因此导航如下所示。

#app/views/layouts/_navigation.html.erb

<nav class="navbar navbar-default">
    <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Tuts Social</a>
    </div>
    <div class="collapse navbar-collapse" id="navbar-collapse">
    	<ul class="nav navbar-nav navbar-right">
        <li><%= link_to 'Home', root_path %></li>
        <% if current_user %>
          <li>Signed in as <%= current_user.name %></li>
          <li><%= link_to 'Log Out', logout_path, method: :delete %></li>
        <% else %>
          <li><%= link_to "Sign in with Twitter", "/auth/twitter" %></li>
        <% end %>
    	</ul>
    </div>
  </div>
</nav>

打开您的config / routes.rb，以您刚刚创建的操作更新您的路由。

#config/routes.rb

...
  delete '/logout', to: 'sessions#destroy'
...

启动Rails服务器，然后将浏览器指向http：// localhost：3000，以查看所拥有的内容。

结论

在本教程中，您学习了如何在Rails应用程序中启用OmniAuth-Twitter。您已经了解了如何使用在用户模型中完成的OmniAuth-Twitter获取用户数据。您能够创建SessionControllers来处理从应用程序中登录和注销用户。

我希望你喜欢它。将来，您将了解如何对Facebook，Google和LinkedIn进行同样的操作。

翻译自: https://code.tutsplus.com/tutorials/twitter-sign-in-for-rails-application--cms-28097

cunjie3951

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫