CSC/ECE 517 Spring 2015/ch1b 22 SF: Difference between revisions

From Expertiza_Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
Line 1: Line 1:
<font size="6"><b>Simple Form</b></font><br>
<div class="md-section-divider"></div><div class="md-section-divider"></div>


[[File:Omniauth.jpg|frame|Source: https://raw.githubusercontent.com/plataformatec/simple_form/master/simple_form.png/|right]]
== CSC/ECE 517 Spring 2015/ch1b 22 JC ==
'''Simple Form''' is a Ruby authentication framework aimed to integrated with various types of authentication providers. It can be hooked up to any system, from social network to enterprise systems to simple username and password authentication <ref>https://github.com/intridea/omniauth/wiki</ref>. OmniAuth is designed to be a black box to which you can send users' requests in order to get authentication information back from the providers. For example, you can use OmniAuth Facebook strategies and send user's email and password to Facebook service, and then get information back to authenticate that user in your application. OmniAuth has the advantages of super simplicity and security. <br>


The topic writeup for this page can be found [https://docs.google.com/document/d/1Ay5OOUkcLMC-FH61fAm3cNvB3Uyk2hJ09vHnRgqwL-k/edit?pli=1 here].
<div class="md-section-divider"></div>


== Background ==
== Simple Form ==
=== Why Simple Form ===
With web application booming.....
Simple form has following advantages:
* Simple
* Powerful
* Flexible
* Secure
In order to use Omniauth for authentication, developers can create and leverage one or more [https://github.com/intridea/omniauth/wiki/List-of-Strategies strategies] released individually as RubyGems from different providers for OmniAuth. Each strategy is a Rack Middleware.


=== Rack Middleware ===
Rack provides a standard interface for developing web applications supporting Ruby and Ruby framework. And Rack middleware is a way to filter a request and response coming into your application<ref>http://railscasts.com/episodes/151-rack-middleware</ref>. Rack has quite simple architecture:
* An object that responds to the <code>call</code> method
* Taking the environment hash as a parameter
* Returning an Array with three elements: status code, environment hash and response body
We can install Rack with following command:
<pre>$ gem install rack</pre>
Then we're going to create a Rack configuration file with extension .ru in your Rails application's root directory. That tells <code>Rack::Builder</code> what middleware does it use and in which order. Or to say how to combine various internal and external middlewares to form a complete Rails Rack application<ref>http://guides.rubyonrails.org/rails_on_rack.html</ref>. <code>Rack::Builder</code> is Rails equivalent of <code>ActionDispatch::MiddlewareStack</code>. 
<pre>
#Rails.root/config.ru
require 'rack'
</pre>
To use <code>rackup</code> to start up your created app, you can put the following code inside config.ru<ref>http://guides.rubyonrails.org/rails_on_rack.html</ref>. And then run <code>rackup</code> command:


<pre>require ::File.expand_path('../config/environment', __FILE__)
Simple form is a Rails gem used for easily creating Rails forms.
use Rails::Rack::Debugger
use Rack::ContentLength
run Rails.application
</pre>
<pre>$ rackup config.ru</pre>
Creating a Middleware filter is just creating a Ruby class. Here is an simplest example:
<pre># ResponseTimer.rb
class ResponseTimer
  def initialize(app)
    @app = app     
  end               


  def call(env)     
The topic write up for this page can be found here.
    @app.call(env) 
  end               
end                 
</pre>
By binding HTTP requests and responses together in the simplest way, it unifies the API for web servers, web frameworks, and software into a single method <code>call</code>.


Rails also provides some simple configuration interface <code>config.middleware</code> for adding, modifying and removing middlewares in the middleware stack via application.rb or the environment configuration file <code>environments/<environment>.rb. </code>You can check out these methods by view Configuring Middleware Stack part of <ref>http://guides.rubyonrails.org/rails_on_rack.html</ref>.
<code>1 Introduction
    1.1 Background
2 Getting Start
    2.1 Installation
    2.2 Bootstrap
    2.3 Usage
3 Example applications
4 Other Rails forms framework
    4.1 Formtastic
5 Conclusion
6 References
</code>


===Supported Ruby Versions===
<div class="md-section-divider"></div>
OmniAuth is tested under 1.8.7, 1.9.3, 2.0.0, 2.1.0, JRuby, and Rubinius.


== Getting Start ==
== Introduction ==
Because each OmniAuth strategy is a Rack Middleware, this means it can be used the same way as other Rack middleware. Here we introduce some simple steps in order to illustrate how to use Twitter strategy for OmniAuth<ref>https://github.com/intridea/omniauth</ref>.
=== Installing ===
First start by adding this gem into your Gemfile:
<pre>gem 'omniauth-twitter'</pre>
If you need to use the latest HEAD version, you can do it with:
<pre>gem 'omniauth-twitter', :github => 'arunagw/omniauth-twitter'</pre>


=== Usage ===
<div class="md-section-divider"></div>
Because OmniAuth is built for multi-provider authentication, you need to build multiple strategies. For this, the Rack middleware  <code>OmniAuth::Builder</code> class gives an easy way to build up your list of OmniAuth strategies for use in your application.


Below is an example that you can put into a Rails initializer at <code> config/initializers/omniauth.rb </code> or add it to your middleware:
=== Background ===
<pre>
Rails.application.config.middleware.use OmniAuth::Builder do
  provider :developer unless Rails.env.production?
  provider :twitter, ENV['TWITTER_KEY'], ENV['TWITTER_SECRET']
end
</pre>
You can create your twitter application [https://apps.twitter.com/ here], after that, you can obtain <code>TWITTER_KEY</code> and <code>TWITTER_SECRET</code> as shown below:
[[File: twitter.png|center]]


=== Integrating OmniAuth into Rails Application ===
Rails forms made easy <br />'''Simple Form''' aims to be as flexible as possible while helping you with powerful components to create your forms . The basic goal of '''Simple Form''' is to not touch your way of defining the layout, letting you find the better design for your eyes. Most of the DSL was inherited from Formtastic.
To use OmniAuth, you need to redirect users to <code>/auth/:provider</code> , where <code>:provider</code> is the name of the strategy (for example, <code>facebook</code> or <code>twitter</code> ). From there, OmniAuth will take over and take the user through the necessary steps to authenticate them with the chosen strategy.


Once the user has authenticated, OmniAuth simply set a special hash called Authentication Hash on Rack environment of a request to <code>/auth/:provider/callback</code>. This hash includes information about the user that OmniAuth collects from the utilized strategy. You should set up an endpoint in your application that matches to the callback URL and then performs whatever steps are necessary for your application.
<div class="md-section-divider"></div>


For example, in a Rails app you can add a line in <code>routes.rb</code> file like this:
== Getting Start ==
<pre>get '/auth/:provider/callback', to: 'sessions#create'</pre>
Then you can add code in <code>SessionsController</code> with something like this:
<pre>class SessionsController < ApplicationController
  def create
    @user = User.find_or_create_from_auth_hash(auth_hash)
    self.current_user = @user
    redirect_to '/'
  end


  protected
<div class="md-section-divider"></div>


  def auth_hash
=== Installation ===
    request.env['omniauth.auth']
  end
end</pre>
The <code>omniauth.auth</code> key in the environment hash gives you the Authentication Hash which will contain information about the just authenticated user. The information includes a unique id, the strategy used for authentication, and personal details such as name and email address.


Note that OmniAuth does not perform any actions beyond setting some environment information on the callback request. It depends on how you want to implement the particulars of your application's authentication flow.
You can use the following code to install simple_form:


=== Logging ===
<div class="md-section-divider"></div>
OmniAuth supports a configurable logger. By default, OmniAuth will log to <code>STDOUT</code> but you can configure this using <code> OmniAuth.config.logger</code>:
<pre># Rails application example
OmniAuth.config.logger = Rails.logger</pre>


== Other Examples ==
# <code class="language-ruby"><span class="pln">gem install simple_form</span></code>
=== OmniAuth Facebook ===
   
==== Installing ====
To use Facebook OmniAuth Strateges<ref>https://github.com/mkdynamic/omniauth-facebook</ref>, first, add this gem into your Gemfile, and then run <code>bundle install</code>:
<pre>gem 'omniauth-facebook'</pre>
==== Usage====
Adding the middleware to a Rails app in <code>config/initializers/omniauth.rb</code>:
<pre>Rails.application.config.middleware.use OmniAuth::Builder do
  provider :facebook, ENV['FACEBOOK_KEY'], ENV['FACEBOOK_SECRET']
end</pre>
==== Configuring ====
You can configure several options, which you pass in to the <code>provider</code> method via a <code>Hash</code>:
{| class="wikitable" style="font-size: 100%; text-align: left; width: auto;"


|-
But I recommend you to use the following way: <br /> Add the following code to your Gemfile:
! Option name
! Default
! Explanation


|-
<div class="md-section-divider"></div>
| <code>scope</code>
| <code>email</code>          
| A comma-separated list of permissions you want to request from the user. See the [https://developers.facebook.com/docs/reference/login/ Facebook docs] for a full list of available permissions


|-
# <code class="language-ruby"><span class="pln">gem </span><span class="str">'simple_form'</span></code>
| <code>display</code>
| <code>page</code>
| The display context to show the authentication page. Options are: <code>page</code>, <code>popup</code> and <code>touch</code>. Read the [https://developers.facebook.com/docs/reference/dialogs/oauth/ Facebook docs] for more details


|-
And in your Rails application root directory, run the following command:
| <code>image_size</code>
| <code>square</code>
| Set the size for the returned image url in the auth hash. Valid options include <code>square</code> (50x50), <code>small</code> (50 pixels wide, variable height), <code>normal</code> (100 pixels wide, variable height), or <code>large</code> (about 200 pixels wide, variable height). Additionally, you can request a picture of a specific size by setting this option to a hash with <code>:width</code> and <code>:height</code> as keys. This will return an available profile picture closest to the requested size and requested aspect ratio. If only <code>:width</code> or <code>:height</code> is specified, we will return a picture whose width or height is closest to the requested size, respectively.


|-
<div class="md-section-divider"></div>
| <code>info_fields</code>
|
| Specify exactly which fields should be returned when getting the user's info.  Value should be a comma-separated string as per <ref>https://developers.facebook.com/docs/graph-api/reference/user/</ref>


|-
# <code class="language-ruby"><span class="pln">bundle install</span></code>
| <code>locale</code>
|
| Specify locale which should be used when getting the user's info. Value should be locale string as per <ref>https://developers.facebook.com/docs/reference/api/locale/</ref>


|-
Run the following code to generate the simple_form into your app:
| <code>auth_type</code>
|
| Optionally specifies the requested authentication features as a comma-separated list <ref>https://developers.facebook.com/docs/facebook-login/reauthentication/</ref>. Valid values are <code>https</code> (checks for the presence of the secure cookie and asks for re-authentication if it is not present), and <code>reauthenticate</code> (asks the user to re-authenticate unconditionally). Default is <code>nil</code>.


|-
<div class="md-section-divider"></div>
| <code>secure_image_url</code>
| <code>false</code>
| Set to <code>true</code> to use https for the avatar image url returned in the auth hash


|-
# <code class="language-ruby"><span class="pln">rails generate simple_form</span><span class="pun"><nowiki>:</nowiki></span><span class="pln">install</span></code>
| <code>callback_url /
callback_path</code>
|
| Specify a custom callback URL used during the server-side flow. Note this must be allowed by your app configuration on Facebook
|}
For example, to request <code>email</code>, <code>user_birthday</code> and <code>read_stream</code> permissions:
<pre>Rails.application.config.middleware.use OmniAuth::Builder do
  provider :facebook, ENV['FACEBOOK_KEY'], ENV['FACEBOOK_SECRET'],
          :scope => 'email,user_birthday,read_stream'
end</pre>


=== OmniAuth GitHub ===
<div class="md-section-divider"></div>
==== Install ====
To use GitHub OmniAuth Strateges<ref>https://github.com/intridea/omniauth-github</ref>, first, add this gem into your Gemfile, and then run <code>bundle install</code>:
<pre>gem 'omniauth-github'</pre>
==== Usage ====
Adding the middleware to a Rails app in <code>config/initializers/omniauth.rb</code>:
<pre>Rails.application.config.middleware.use OmniAuth::Builder do
  provider :github, ENV['GITHUB_KEY'], ENV['GITHUB_SECRET']
end</pre>
==== Scopes ====
GitHub API v3 lets you set scopes to provide granular access to different types of data:
<pre>use OmniAuth::Builder do
  provider :github, ENV['GITHUB_KEY'], ENV['GITHUB_SECRET'], scope: "user,repo,gist"
end</pre>
More scope info is shown below:
{| class="wikitable"  style="font-size: 100%; text-align: left; width: auto;"


|-
=== Work with Bootstrap ===
! Name
! Description


|-
Similar to [http://html5boilerplate.com H5BP] and [http://960.gs 960 Grid System], [http://getbootstrap.com/ Bootstrap] is a simple and very popular front-end framework.
| <code>(no scope)</code>     
| Grants read-only access to public information (includes public user profile info, public repository info, and gists)


|-
With the following code while installing Simple Form, you can integrate Simple Form to Bootstrap
| <code>user</code>
| Grants read/write access to profile info only. Note that this scope includes <code>user:email</code> and <code>user:follow</code>


|-
<div class="md-section-divider"></div>
| <code>user:email</code>
| Grants read access to a user’s email addresses


|-
# <code class="language-ruby"><span class="pln">rails generate simple_form</span><span class="pun"><nowiki>:</nowiki></span><span class="pln">install </span><span class="pun">--</span><span class="pln">bootstrap</span></code>
| <code>user:follow</code>
| Grants access to follow or unfollow other users
You have to be sure that you added a copy of the [http://getbootstrap.com/ Bootstrap] assets on your application.
 
|-
| <code>public_repo</code>
| Grants read/write access to code, commit statuses, and deployment statuses for public repositories and organizations
 
|-
| <code>repo</code>
| Grants read/write access to code, commit statuses, and deployment statuses for public and private repositories and organizations
 
|-
| <code>repo_deployment</code>
| Grants access to deployment statuses for public and private repositories. This scope is only necessary to grant other users or services access to deployment statuses, without granting access to the code
 
|-
| <code>repo:status</code>
| Grants read/write access to public and private repository commit statuses. This scope is only necessary to grant other users or services access to private repository commit statuses without granting access to the code
 
|-
| <code>delete_repo</code>
| Grants access to delete adminable repositories
 
|-
| <code>notifications</code>
| Grants read access to a user’s notifications. repo also provides this access
 
|-
| <code>gist</code>
| Grants write access to gists
 
|-
| <code>read:repo_hook</code>
| Grants read and ping access to hooks in public or private repositories
 
|-
| <code>write:repo_hook</code>
| Grants read, write, and ping access to hooks in public or private repositories
 
|-
| <code>admin:repo_hook</code>
| Grants read, write, ping, and delete access to hooks in public or private repositories
 
|-
| <code>admin:org_hook</code>
| Grants read, write, ping, and delete access to organization hooks. Note: OAuth tokens will only be able to perform these actions on organization hooks which were created by the OAuth application. Personal access tokens will only be able to perform these actions on organization hooks created by a user
 
|-
| <code>read:org</code>
| Read-only access to organization, teams, and membership
 
|-
| <code>write:org</code>
| Publicize and unpublicize organization membership
 
|-
| <code>admin:org</code>
| Fully manage organization, teams, and memberships
 
|-
| <code>read:public_key</code>
| List and view details for public keys
 
|-
| <code>write:public_key</code>
| Create, list, and view details for public keys


|-
For more information see the generator output, out example application code and the live example app.
| <code>admin:public_key</code>
| Fully manage public keys
|}


=== More Examples ===
<div class="md-section-divider"></div>
* [https://github.com/arunagw/omniauth-foursquare OmniAuth Foursquare ]
* [https://github.com/geoloqi/omniauth-geoloqi OmniAuth Geoloqi]
* [https://github.com/intridea/omniauth-identity OmniAuth Identity]
* [https://github.com/skorks/omniauth-linkedin OmniAuth Linkedin]
* [https://github.com/arunagw/omniauth-picplz OmniAuth Picplz]
* [https://github.com/intridea/omniauth-openid OmniAuth Openid]


== References ==
== References ==
<references/>
# https://github.com/plataformatec/simple_form
# http://getbootstrap.com/
# https://github.com/justinfrench/formtastic
#

Revision as of 21:20, 18 February 2015

CSC/ECE 517 Spring 2015/ch1b 22 JC

Simple Form

Simple form is a Rails gem used for easily creating Rails forms.

The topic write up for this page can be found here. 

1 Introduction
    1.1 Background
2 Getting Start
    2.1 Installation
    2.2 Bootstrap
    2.3 Usage
3 Example applications

4 Other Rails forms framework
    4.1 Formtastic
5 Conclusion
6 References

Introduction

Background

Rails forms made easy
Simple Form aims to be as flexible as possible while helping you with powerful components to create your forms . The basic goal of Simple Form is to not touch your way of defining the layout, letting you find the better design for your eyes. Most of the DSL was inherited from Formtastic.

Getting Start

Installation

You can use the following code to install simple_form: 

# gem install simple_form

But I recommend you to use the following way:
Add the following code to your Gemfile: 

# gem 'simple_form'

And in your Rails application root directory, run the following command: 

# bundle install

Run the following code to generate the simple_form into your app: 

# rails generate simple_form:install

Work with Bootstrap

Similar to H5BP and 960 Grid System, Bootstrap is a simple and very popular front-end framework.

With the following code while installing Simple Form, you can integrate Simple Form to Bootstrap 

# rails generate simple_form:install --bootstrap

You have to be sure that you added a copy of the Bootstrap assets on your application.

For more information see the generator output, out example application code and the live example app.

References

  1. https://github.com/plataformatec/simple_form
  2. http://getbootstrap.com/
  3. https://github.com/justinfrench/formtastic
Retrieved from "https://wiki.expertiza.ncsu.edu/index.php?title=CSC/ECE_517_Spring_2015/ch1b_22_SF&oldid=94252"