如何为你的Rails应用配置Devise和OmniAuth

简介

大多数 Ruby on Rails 应用程序都需要用户注册和身份验证机制。从头开始开发这些需要大量的时间和精力 - 幸运的是,有 Devise。使用 Devise gem,您可以在几分钟内设置一个完整的用户身份验证系统。

但是,您可以通过允许用户在不创建新帐户的情况下访问您的应用程序来让他们更加满意。他们可以简单地使用他们现有的 Facebook、Twitter、Amazon 或 DigitalOcean 帐户登录。事实上,您可以支持任何流行的 OAuth 服务提供商进行身份验证。OAuth 支持由 OmniAuth gem 提供。在本教程中,我们将创建一个简单的应用程序,该应用程序同时使用了 Devise 和 OmniAuth。

先决条件

在开始之前,请确保您的主机上安装了 RVM、Ruby 和 Rails 的最新版本。如果没有,请按照这里的说明操作:如何在 Ubuntu 12.04 LTS 上使用 RVM 安装 Ruby on Rails。

本教程已经在 Ruby 2.1.2 和 Rails 4.1.5 上进行了测试。

步骤 1 - 创建一个新的 Rails 应用程序

建议您将所有的 Rails 应用程序放在一个单独的目录中。

您现在应该创建一个。

mkdir rails_apps
cd rails_apps

在开始发出 Rails 命令之前,您必须初始化 RVM 环境。

如果您在跟随本教程时休息一下,请记住每次重新启动终端会话时都要这样做。

. ~/.rvm/scripts/rvm
rvm use ruby --default

让我们将新应用程序命名为 myapp。创建应用程序后,使用 cd 进入应用程序的基本目录。

rails new myapp
cd myapp

注意:所有 Rails 命令都应该在应用程序的目录内运行,本例中是 ~/rails_apps/myapp。

步骤 2 - 向 Gemfile 添加所需的 Gems

我们将需要 Devise 和 OmniAuth gems。此外,您还需要一个单独的 gem 来支持每个 OAuth 服务提供商。对于本教程,我们将支持使用 DigitalOcean 登录,因此我们需要 omniauth-digitalocean gem。

将以下行添加到文件 ~/rails_apps/myapp/Gemfile 的末尾。您可以使用 nano 作为您的文本编辑器。

gem 'therubyracer'
gem 'devise'
gem 'omniauth'
gem 'omniauth-digitalocean'

您将需要类似的 gems 来支持其他提供商。例如,要支持 Facebook,您将需要 omniauth-facebook。以下是一些供您参考的类似 gems:

  • Twitter - omniauth-twitter
  • Amazon - omniauth-amazon
  • Google - omniauth-google
  • Github - omniauth-github

安装新添加的 gems。

bundle install

步骤 3 - 向应用程序添加基本功能

让我们快速为这个应用程序添加一些页面进行测试。最终,这些页面将只能在登录后访问。

我们可以使用 Rails 的脚手架功能来实现这一点。使用 rails g scaffold 命令,我们只需指定有关模型的详细信息,Rails 就会生成完全功能的页面来执行该模型的 CRUD(创建、读取、更新、删除)操作。换句话说,所有相关的控制器和视图都会被生成,以及模型文件。

rails g scaffold Product name:string price:integer description:text
rake db:migrate

接下来,我们需要定义这个应用程序的根。

编辑 ~/rails_apps/myapp/config/routes.rb,并在现有的资源行下面添加一行 root 'products#index' 来指定应用程序的根。您可以忽略所有被注释掉的行。完成后,文件中的活动行将如下所示:

Rails.application.routes.draw do
  resources :products
  root 'products#index'
end

现在,测试您的应用程序。通过输入以下命令启动开发服务器:

rails s

在浏览器中访问 http://localhost:3000。如果您是远程开发,请用适当的 IP 地址或域名替换 localhost3000 是开发服务器的默认端口号。

目前,不需要登录。通过点击“New Product”添加一些产品。一旦您满意您的应用程序按预期工作,返回终端并按 Ctrl+C 停止服务器。

步骤 4 - 设置 Devise

输入以下命令以添加 Devise 身份验证支持。

rails generate devise:install
rails generate devise User
rake db:migrate

这将添加登录和注册表单以及所有相关的逻辑。

我们的应用程序现在具有基本的身份验证系统,用户可以注册自己,然后登录。然而,所有页面仍然是直接可访问的。为了改变这一点,编辑 ~/rails_apps/myapp/app/controllers/application_controller.rb,并将 authenticate_user! 添加为在提供任何页面之前执行的操作。

class ApplicationController < ActionController::Base
  protect_from_forgery with: :exception
  before_action :authenticate_user!
end

如果您愿意,您可以再次使用 rails s 命令启动开发服务器,并通过访问 http://localhost:3000/(同样,使用您自己的域名或 IP 地址)来查看这些新添加的页面。您应该会看到一个看起来像这样的页面:

!登录页面

您可以通过访问 http://localhost:3000/users/sign_up 注册为新用户。

第五步 - 更新用户模型以支持 OmniAuth

如果你重新启动了服务器,请使用 CTRL-C 停止它。向 Devise 生成的模型添加一个名为 uid 的新列。

rails g migration AddColumnsToUsers provider uid
rake db:migrate

第六步 - 从 OAuth 服务提供商获取客户端 ID 和客户端密钥

访问服务提供商的网站并在那里注册你的应用程序。所有的服务提供商都有不同的注册流程。对于 DigitalOcean,请参考这里的教程:如何作为用户或开发者使用 DigitalOcean 的 OAuth 认证

在注册过程中,你将被要求提供一个回调 URL。每个提供商都有一个单独的回调 URL。以下是一些流行服务提供商的回调 URL:

  • Digital Ocean: http://localhost:3000/users/auth/digitalocean/callback
  • Facebook: http://localhost:3000/users/auth/facebook/callback
  • Amazon: http://localhost:3000/users/auth/amazon/callback
  • Twitter: http://localhost:3000/users/auth/twitter/callback
  • Google: http://localhost:3000/users/auth/google/callback

请将 localhost 替换为解析到你的 Droplet 的 IP 地址或域名。在注册过程结束时,你将获得你的客户端 ID 和客户端密钥。你将在下一步中使用这些值。

第七步 - 更新 Devise 初始化器

编辑 ~/rails_apps/myapp/config/initializers/devise.rb,在文件底部的 end 行之前添加客户端 ID 和密钥。同时,将 mailer_sender 更新为你自己服务器的名称和用户。除了这两项之外,你不需要做任何其他更改。

编辑后,你的文件应该如下所示(文件中还会有很多注释行):

Devise.setup do |config|
  #Replace example.com with your own domain name
  config.mailer_sender = 'mailer@example.com'

  require 'devise/orm/active_record'
  config.case_insensitive_keys = [ :email ]
  config.strip_whitespace_keys = [ :email ]
  config.skip_session_storage = [:http_auth]
  config.stretches = Rails.env.test? ? 1 : 10
  config.reconfirmable = true
  config.expire_all_remember_me_on_sign_out = true
  config.password_length = 8..128
  config.reset_password_within = 6.hours
  config.sign_out_via = :delete

  #Add your ID and secret here
  #ID first, secret second
  config.omniauth :digitalocean, "db381dc9990be7e3bc42503d0", "5b0824c2722b65d29965f1a1df"
end

第八步 - 更新用户模型

Devise 生成的用户模型必须更改以指定我们想要使用的服务提供商。我们在现有列表中添加了三个项目(:omniauthable, :omniauth_providers => [:digitalocean],不要忘记额外的逗号!)。我们还创建了一个名为 from_omniauth 的新方法,用于提取认证后可用的信息。

编辑后,你的 ~/rails_apps/myapp/app/models/user.rb 应该如下所示:

class User < ActiveRecord::Base
  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :trackable, :validatable,
	 :omniauthable, :omniauth_providers => [:digitalocean]

  def self.from_omniauth(auth)
	  where(provider: auth.provider, uid: auth.uid).first_or_create do |user|
		user.provider = auth.provider
		user.uid = auth.uid
		user.email = auth.info.email
		user.password = Devise.friendly_token[0,20]
	  end
  end
end

保存文件。

第九步 - 添加一个控制器来处理回调 URL

首先,编辑 ~/rails_apps/myapp/config/routes.rb 并更新 devise_for 行以指定将处理回调的控制器的名称。我们简单地称之为 callbacks。你的文件现在应该如下所示(减去注释部分):

Rails.application.routes.draw do
  devise_for :users, :controllers => { :omniauth_callbacks => "callbacks" }
  resources :products
  root 'products#index'
end

然后,创建一个新文件 ~/rails_apps/myapp/app/controllers/callbacks_controller.rb

向其中添加以下代码:

class CallbacksController < Devise::OmniauthCallbacksController
	def digitalocean
		@user = User.from_omniauth(request.env["omniauth.auth"])
		sign_in_and_redirect @user
	end
end

如果你使用了更多的 OAuth 提供商,你将需要为每个提供商创建一个单独的方法。方法的名称应该与提供商的名称匹配。例如,要添加对 Facebook 的支持,你的方法将使用 def facebook 定义。

你的应用程序现在已经准备就绪。再次启动服务器:

rails s

访问你的主页。由于我们正在测试登录功能,你可能希望在没有存储数据的会话中进行,比如 Chrome 的隐身窗口。你应该会看到一个 使用 DigitalOcean 登录 的链接。点击它。你将被重定向到 DigitalOcean 的登录页面。成功登录后,你将被重定向回你自己的应用程序,并显示产品页面。

!使用 DigitalOcean 登录

结论

现在,您的应用程序拥有了一个现代化的用户身份验证系统,用户可以使用电子邮件地址、社交网络账户或其他流行的服务进行登录。

如果您决定将此应用程序部署到 Droplet 上进行生产环境使用,您可以参考这里的教程:如何使用 DigitalOcean 一键部署镜像启动您的 Ruby on Rails 应用程序。如果您将应用程序添加到新的 Droplet 上,请不要忘记返回到第 6 步,使用您生产服务器的回调 URL 更新您的 DigitalOcean API 设置。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/555905.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

学习笔记(4月18日)vector底层模拟实现(1)

1.迭代器 vector实际上是由迭代器进行维护的&#xff0c;关于迭代器是什么&#xff0c;为什么要叫这个名字&#xff0c;后面的学习会逐渐了解&#xff0c;现在先将迭代器是作为指针即可。 vector底层有三个迭代器&#xff0c;用来起到容量、数组头、元素个数的作用。 同时为…

数字零售力航母-看微软如何重塑媒体

数字零售力航母-看微软如何重塑媒体 - 从2024全美广播协会展会看微软如何整合营销媒体AI技术和AI平台公司 2024年&#xff0c;微软公司联合英伟达总司&#xff0c;赞助全美广播协会展会。本次展会微软通过搭建一个由全面的合作伙伴生态系统支持的可信和安全的平台&#xff0c;…

RIP最短路实验(华为)

思科设备参考&#xff1a;RIP最短路实验&#xff08;思科&#xff09; 一&#xff0c;技术简介 RIP&#xff08;Routing Information Protocol&#xff0c;路由信息协议&#xff09;是一种基于距离矢量的内部网关协议&#xff0c;工作原理是每个路由器周期性地向邻居路由器发…

【网站项目】新生报到系统小程序

&#x1f64a;作者简介&#xff1a;拥有多年开发工作经验&#xff0c;分享技术代码帮助学生学习&#xff0c;独立完成自己的项目或者毕业设计。 代码可以私聊博主获取。&#x1f339;赠送计算机毕业设计600个选题excel文件&#xff0c;帮助大学选题。赠送开题报告模板&#xff…

Spring Boot | Spring Boot “缓存管理“

目录: 一、Spring Boot 默认 "缓存" 管理 :1.1 基础环境搭建① 准备数据② 创建项目③ 编写 "数据库表" 对应的 "实体类"④ 编写 "操作数据库" 的 Repository接口文件⑤ 编写 "业务操作列" Service文件⑥ 编写 "applic…

Vue2进阶之Vue2高级用法

Vue2高级用法 mixin示例一示例二 plugin插件自定义指令vue-element-admin slot插槽filter过滤器 mixin 示例一 App.vue <template><div id"app"></div> </template><script> const mixin2{created(){console.log("mixin creat…

美团财务科技后端一面:如何保证数据一致性?延时双删第二次失败如何解决?

更多大厂面试内容可见 -> http://11come.cn 美团财务科技后端一面&#xff1a;项目内容拷打 美团财务科技后端一面&#xff1a;项目相关面试题&#xff0c;主要包含 Zset、延时双删失败重试、热点数据解决、ThreadLocal 这几个方面相关的内容 由于前几个问题是对个人项目的…

展览展会媒体媒体邀约执行应该怎么做?

传媒如春雨&#xff0c;润物细无声&#xff0c;大家好&#xff0c;我是51媒体网胡老师。 展览展会邀请媒体跟其他活动邀请媒体流程大致相同&#xff0c;包括 制定媒体邀约计划&#xff0c;准备新闻稿&#xff0c;发送邀请函&#xff0c;确认媒体参会&#xff0c;现场媒体接待及…

神经网络中正则化和正则化率的含义

在神经网络中&#xff0c;正则化是一种用于防止模型过拟合的技术。过拟合是指模型在训练数据上表现得很好&#xff0c;但是对于未见过的新数据&#xff0c;其泛化能力却很差。正则化通过在损失函数中添加一个额外的项来惩罚模型的复杂度&#xff0c;从而鼓励模型学习更加简单、…

OpenHarmony UI动画-lottie

简介 lottie是一个适用于OpenHarmony的动画库&#xff0c;它可以解析Adobe After Effects软件通过Bodymovin插件导出的json格式的动画&#xff0c;并在移动设备上进行本地渲染。 下载安裝 ohpm install ohos/lottieOpenHarmony ohpm 环境配置等更多内容&#xff0c;请参考如何…

浅写个登录(无js文件)

全部代码如下&#xff0c;无需编写wxss文件&#xff0c;渲染都在style里面&#xff1a; <view style"height: 250rpx;width: 100%;"> <!-- 背景图片 --><view style"position: absolute; background-color: antiquewhite; height: 250rpx;width…

Java学习-Module的概念和使用、IDEA的常用设置及常用快捷键

Module的概念和使用 【1】在Eclipse中我们有Workspace (工作空间)和Project (工程)的概念&#xff0c;在IDEA中只有Project (工程)和Module (模块)的概念。 这里的对应关系为: IDEA官网说明: An Eclipse workspace is similar to a project in IntelliJ IDEA An Eclipse pr…

2、MATLAB入门常用命令

一、退出和中断 exit和quit&#xff1a;结束MATLAB会话。程序完成&#xff0c;如果没有明确保存&#xff0c;则变量中的数据丢失。 Ctrl c&#xff1a;中断一个MATLAB任务。例如&#xff0c;当MATLAB正在计算或打印时&#xff0c;中断一个任务&#xff0c;但会话并没有结束。…

TensorFlow 1.x的学习

.为什么还有很多人都选择使用TensorFlow 1.x 兼容性问题: TensorFlow 1.x在一些旧项目中已经得到了广泛应用&#xff0c;这些项目可能依赖于1.x版本的特定API或行为。升级到2.x可能需要大量的代码修改和测试工作&#xff0c;对于一些已经稳定运行的项目&#xff0c;维护者可能…

【观察】容器化部署“再简化”,云原生体验“再升级”

自2013年云原生概念被提出以来&#xff0c;云原生技术和架构在过去十多年得到了迅速的发展&#xff0c;并对数字基础设施、应用架构和应用构建模式带来了深刻的变革。根据IDC预测&#xff0c;到2024年&#xff0c;新增的生产级云原生应用在新应用的占比将从2020年的10%增加到60…

HTML5+JavaScript实现本地视频/音频播放器

HTML5JavaScript实现本地视频/音频播放器 HTML5 提供了本地视频和音频播放器的支持&#xff0c;通过 <video> 和 <audio> 标签&#xff0c;这些标签支持多种媒体格式&#xff0c;并且可以通过 JavaScript 进行控制&#xff0c;实现功能比较完整的本地视频音频播放器…

车载终端丨车载平板丨车载平板电脑丨提升车队管理水平

随着电商、互联网和智能制造等行业的快速发展&#xff0c;物流需求不断增加&#xff0c;车载终端作为物流企业管理的重要工具&#xff0c;具有广泛的市场需求。车载平板是一种集成了计算机和显示屏的设备&#xff0c;可以用于车辆管理、车队调度、运输监控等方面&#xff0c;可…

探索Java世界中的七大排序算法(上)

文章目录 排序的概念直接插入排序希尔排序( 缩小增量排序)选择排序堆排序冒泡排序 在计算机科学中&#xff0c;排序算法是一类重要的算法&#xff0c;它们用于将一组元素按照一定的顺序进行排列。在Java编程中&#xff0c;我们经常需要对数组或集合进行排序操作。本文将介绍Jav…

React Ant Design 简单实现如何选中图片

效果&#xff1a; 代码&#xff1a; 定义的初始值和方法 const [selected, setSelected] useState(0); // 表示当前选中的图片索引const handleClick (index) > {if (selected index) {setSelected(null); // 如果点击的是已选中的图片&#xff0c;则取消选中状态} else…

单节锂离子/锂聚合物电池保护IC SDG3JX

SDG3JX内置高精度电压检测电路和延迟电路&#xff0c;适用于锂离子/锂聚合物可充电电池的保护IC。SDG3JX 最适合于对单节锂离子/锂聚合物可充电电池组的过充电、过放电和过电流的保护。 特点  内置高精度电压检测电路 * 过充电检测电压:4.28V0.025V&#xff1b; * 过充电解除…
最新文章