9 : 用户管理①

上章:作作看主页!

Header9

0 : 这个章的目的

 作作看做用户管理的会员制的网站吧。
在很多网页上,利用者登入网站之后使用那个网页。
我們在这里,想作作看这样做用戶管理的会员制的网站的设定。

在Ruby on Rails上,为了作「用户管理」的机能我們使用devise」的gem

先简单的解释用devise作的会员制的网页吧。
  • 登入机能

  • 要看post资料库的网页(0.0.0.0:3000/posts等等)的时候需要登入会员,如果沒有登入的利用者的话会移动到「登入」网页Chrome users sign in nav 登入之后, Chrome posts all nav after login 显示网页里面的內容。
  • 登入利用者的资料

  • 登入的会员的资料,会在「users」资料库「devise」会作资料)里保存。
    用这个「users」资料库,可以作会员资料的网页。 Chrome users 1 after
  • 用user资料库显示別的资料

  • 如果会员的资料设定好了的话,可以用这个users资料库区别,別的资料库的资料是谁作的 等等的设定。

在这个章做这个三个设定,但是作这个设定之前先导入这个「devise」的工具


1 : 导入devise

导入devise是有,
  • 安装gem "devise"
  • users资料库
  • devise的显示・作views(登入注册网页等等)
这个三个设定。那么一个一个做做看吧!

 ① : 安裝gem "devise"


首先用Sublime Text打开myapp吧。
※ 使用Sublime Text打开文件的方法请参考这里
 使用Windows的Sublime Text打开文件文件夾的方法请参考这里


gem的「devise」要在Gemfile里设定內容。

 Gemfile(「gem 'sprockets', '3.6.3'」后面追加「gem 'devise'」)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


26 27 28 29 30 31 gem 'therubyracer' gem 'less-rails' gem 'twitter-bootstrap-rails' gem 'sprockets', '3.6.3' gem 'devise'

Gemfile文件里设定好內容之后,在terminal上打入bundle install导入gem。
首先在terminal上,移动到myapp吧。


 使用Windows移动的方法,请参考这里


 terminal
1 2 3 cd Desktop cd rails_project cd myapp

之后打入bundle install

terminal
 使用Windows的话,用「命令提示符」吧。
1 bundle install

 不会动的话,删除「Gemfile.lock」之后再试试看吧。

有沒有显示下面图像一样的网页了吗? Terminal bundle install bootstrap
完了之后在网站上适用「gem」的內容,在terminal上打入

terminal
 使用Windows的话,用「命令提示符」吧。
1 rails g devise:install

这个內容吧。有沒有显示下面一样的网页吗? Rails g devise install 这样子devise的导入完成了。
可是要使用的话,还需要作资料库跟设定显示的內容。
先作作看资料库吧。


 ② : 作users资料库


接着作保存会员资料的资料库吧。
说要作资料库,不是从头到尾作users资料库,所以不要担心。电子邮件・密码・登入的时间等等的框子,「devise」会作。
在这里作「devise」不会做的「姓氏」「名字」「自我介绍」的框子
首先在terminal上打入

terminal
 使用Windows的话,用「命令提示符」吧。
1 rails g devise user

的命令吧。有沒有显示下面图像一样的画面吗? Rails g devise user 用这个打入作了,设定「devise」的会员资料库的「users」资料库的设定文件

如果资料库的名字,想用「customers」的话,打入
rails g devise customer
的命令。
画面上有沒有显示日子_devise_create_users.rb的文件吗?
devise作的设定「users」资料库的设定文件是这一个。

在这个设定文件里追加「姓氏」「名字」「自我介绍」的框子,之前看里面的內容吧!
用Sublime Text打开看db > migrate > 日子_devise_create_users.rb文件吧!
※ 使用Sublime Text打开文件的方法请参考这里
 使用Windows的Sublime Text打开文件文件夾的方法请参考这里


 日子_devise_create_users.rb
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 class DeviseCreateUsers < ActiveRecord::Migration def change create_table(:users) do |t| ## Database authenticatable t.string :email, null: false, default: "" t.string :encrypted_password, null: false, default: "" ## Recoverable t.string :reset_password_token t.datetime :reset_password_sent_at ## Rememberable t.datetime :remember_created_at ## Trackable t.integer :sign_in_count, default: 0, null: false t.datetime :current_sign_in_at t.datetime :last_sign_in_at t.string :current_sign_in_ip t.string :last_sign_in_ip ## Confirmable # t.string :confirmation_token # t.datetime :confirmed_at # t.datetime :confirmation_sent_at # t.string :unconfirmed_email # Only if using reconfirmable ## Lockable # t.integer :failed_attempts, default: 0, null: false # Only if lock strategy is :failed_attempts # t.string :unlock_token # Only if unlock strategy is :email or :both # t.datetime :locked_at t.timestamps null: false end add_index :users, :email, unique: true add_index :users, :reset_password_token, unique: true # add_index :users, :confirmation_token, unique: true # add_index :users, :unlock_token, unique: true end end

有沒有显示这样子的文件吗?
那么,追加「姓氏」「名字」「自我介绍」的框子的设定吧。

 三个框子
  • 放短的文章的「family_name(姓名)」
  • 放短的文章的「first_name(名字)」
  • 放长的文章的「self_introduction(自我介绍)」
要怎么设定呢?

※ 不知道的话,请参考这里


1 2 3 t.string :first_name t.string :family_name t.text :self_introduction

t.timestamps null: false的前面追加,这三行的设定吧。

有沒有打入跟下面一样內容了吗?

 日時_devise_create_users.rb(追加第33〜35行)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 class DeviseCreateUsers < ActiveRecord::Migration def change create_table(:users) do |t| ## Database authenticatable t.string :email, null: false, default: "" t.string :encrypted_password, null: false, default: "" ## Recoverable t.string :reset_password_token t.datetime :reset_password_sent_at ## Rememberable t.datetime :remember_created_at ## Trackable t.integer :sign_in_count, default: 0, null: false t.datetime :current_sign_in_at t.datetime :last_sign_in_at t.string :current_sign_in_ip t.string :last_sign_in_ip ## Confirmable # t.string :confirmation_token # t.datetime :confirmed_at # t.datetime :confirmation_sent_at # t.string :unconfirmed_email # Only if using reconfirmable ## Lockable # t.integer :failed_attempts, default: 0, null: false # Only if lock strategy is :failed_attempts # t.string :unlock_token # Only if unlock strategy is :email or :both # t.datetime :locked_at t.string :first_name t.string :family_name t.text :self_introduction t.timestamps null: false end add_index :users, :email, unique: true add_index :users, :reset_password_token, unique: true # add_index :users, :confirmation_token, unique: true # add_index :users, :unlock_token, unique: true end end

编辑好了之后,在terminal上

terminal
 使用Windows的话,请用「命令提示符」吧。
1 rake db:migrate

 不动的话,在命令的前面加「bundle exec」,打入「bundle exec rake db:migrate」吧。

打入这个內容吧。 Rake db migrate model users 显示这样子的画面之后,用Sequel Pro看看资料库吧!
※ 打开的方法,请参考Sequel 或者 SqliteBrowser
选择「myapp_development」之后,看看有沒有「users」资料库。 Sequel pro users 有「users」资料库的话,看看內容里面有沒有「family_name」「first_name」「self_introduction」的框子
※ 如果沒有的话,请参考这里追加框子吧。

这样子做好会员(user)的资料库的设定了。
接着设定「devise」的网页的导入吧。


 ③ : 导入devise的网页


接着导入在「devise」使用的网页吧。
devise 的网页的导入也是从terminal上的打入设定。
那么,在terminal上打入下面的命令吧。

terminal
 使用Windows的话,用「命令提示符」吧。
1 rails g devise:views

有沒有显示下面一样的画面了吗? Rails g devise views 确认里面有沒有作好的文件文件夾。
app > views > devise文件夾吗? Sublime text devise 里面有很多文件,但是使用的是「registrations」的「new.html.erb」(登入的网页)「sessions」的「new.html.erb」(注册的网页)这个两个文件。
导入到这里。最后想总结。


 ④ : 总结


要导入「devise」的时候,
  • 设定Gemfile之后安裝
  • 导入devise
  • 导入users的框子
  • 导入显示网页的views
要准备这个四个文件。在这里一个一个解释吧。
  • 设定Gemfile之后安裝

  • 「devise」的gem要在,Gemfile里

     Gemfile
    1 gem 'devise'

    追加之后,在terminal上

     terminal
    1 bundle install

    打入这个內容,设定。
  • 导入devise

  • 安裝好「devise」的gem之后,在terminal上

     terminal
    1 rails g devise:install

    打入这个內容。
  • 导入users的框子

  • 打入

     terminal
    1 rails g devise user

    作「devise」的「users」资料库的设定文件

    自己更改內容之后,在terminal上打入

     terminal
    1 rake db:migrate

    作「users」资料库。
  • 显示的view的设定

  • 「devise」的网页也在用terminal的打入作。

     terminal
    1 rails g devise:views

    打入这个命令,作「devise」的网页。


2 : 登入机能

devise的导入也完了,接着设定登入机能吧!
一起点击「Command」跟「c」停止,用「rails s」打开的服务器之后,再打入「rails s」吧。
这样编辑好的內容会适用在网页上。


 使用Windows的话,
 一起点击「ctrl」跟「c」停止,用「rails s」打开的服务器之后,再打入「rails s」吧。


做完了之后,打开「0.0.0.0:3000/users/sign_up」吧!
 使用Windows的话打开「localhost:3000/users/sign_up」吧。

 这个是注册的网页。 Chrome users sign up before
接着打开「0.0.0.0:3000/users/sign_in」吧!
 使用Windows的话,打开「localhost:3000/users/sign_in」吧。

 这个是登入的网页。 Chrome users log in before

 ① : 装饰登入注册的网页


首先用Bootstrap,装饰登入注册的网页吧!

在这里 做这个两个设定。

 ⑴ : btn跟form-control


現在的网页,输入框跟按钮会不会有一点不好看呢?
在网页上追加btnform-control这个两个设定,把网页的显示的装饰的更漂亮吧。

首先看看注册的网页(0.0.0.0:3000/users/sign_up)吧。
打开「app > views > devise > registrations」的文件夾里的new.html.erb吧!
※ 使用Sublime Text打开文件的方法请参考这里
 使用Windows的Sublime Text打开文件文件夾的方法请参考这里


 new.html.erb(registrations文件夾)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 <h2>Sign up</h2> <%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %> <%= devise_error_messages! %> <div class="field"> <%= f.label :email %><br /> <%= f.email_field :email, autofocus: true %> </div> <div class="field"> <%= f.label :password %> <% if @minimum_password_length %> <em>(<%= @minimum_password_length %> characters minimum)</em> <% end %><br /> <%= f.password_field :password, autocomplete: "off" %> </div> <div class="field"> <%= f.label :password_confirmation %><br /> <%= f.password_field :password_confirmation, autocomplete: "off" %> </div> <br> <div class="actions"> <%= f.submit "Sign up" %> </div> <% end %> <%= render "devise/shared/links" %>

有沒有打开这样子的文件吗?
有「form_for」等等的內容,里面的內容也可以理解一些吧。
f.label :文字
在显示「文字」
f.email_field :email
在设定打入Email的输入框,
f.password_field :password
在设定打入密码的输入框。

 在new.html.erb的「f.email_field」上,追加Bootstrap的输入框的设定吧。
※ 不知道的话,请参考这里


 new.html.erb(第8行)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


8 <%= f.email_field :email, autofocus: true, :class => "form-control" %>

这样打入也可以设定Bootstrap的输入框的设定,但是这样子设定的输入框太长了所以用之前作的「my-form」把框子设定的短一点吧。

「f.email_field」的设定完了之后,
  • 在「f.password_field」里面设定输入框
  • 在「f.submit」里面设定按钮
追加这个內容吧。

 new.html.erb(编辑第8、16、21、23、25行)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 <h2>Sign up</h2> <%= form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %> <%= devise_error_messages! %> <div class="field"> <%= f.label :email %><br /> <%= f.email_field :email, autofocus: true, :class => "form-control my-form" %> </div> <div class="field"> <%= f.label :password %> <% if @minimum_password_length %> <em>(<%= @minimum_password_length %> characters minimum)</em> <% end %><br /> <%= f.password_field :password, autocomplete: "off", :class => "form-control my-form" %> </div> <div class="field"> <%= f.label :password_confirmation %><br /> <%= f.password_field :password_confirmation, autocomplete: "off", :class => "form-control my-form" %> </div> <br> <div class="actions"> <%= f.submit "Sign up", :class => "btn btn-primary" %> </div> <% end %> <%= render "devise/shared/links" %>

※ 一起点击「Command」跟「c」停止,用rails s打开的服务器之后,再打入「rails s」吧。


 使用Windows的话,
 一起点击「ctrl」跟「c」停止,用「rails s」打开的服务器之后,再打入「rails s」吧。


做完之后,打开「0.0.0.0:3000/users/sign_up」吧!
 使用Windows的话,打开「localhost:3000/users/sign_up」吧。

有沒有显示下面图像一样的画面吗? Chrome users sign up bootstrap
注册网页的设定也好了,接着作登入网页的设定吧。
登入的网页要设定在app > views > devise > sessions文件夾里的new.html.erb文件里。

那么
  • 在输入框里「form-control」跟「my-form
  • 在按钮里「btn」跟「btn-primary
追加显示的內容吧!

 new.html.erb(sessions文件夾)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 <h2>Log in</h2> <%= form_for(resource, as: resource_name, url: session_path(resource_name)) do |f| %> <div class="field"> <%= f.label :email %><br /> <%= f.email_field :email, autofocus: true, :class => "form-control my-form" %> </div> <div class="field"> <%= f.label :password %><br /> <%= f.password_field :password, autocomplete: "off", :class => "form-control my-form" %> </div> <% if devise_mapping.rememberable? -%> <div class="field"> <%= f.check_box :remember_me %> <%= f.label :remember_me %> </div> <% end -%> <br> <div class="actions"> <%= f.submit "Log in", :class => "btn btn-primary" %> </div> <% end %> <%= render "devise/shared/links" %>

※ 一起点击「Command」跟「c」停止,用rails s打开的服务器之后,再打入「rails s」吧。


 使用Windows的话,
 一起点击「ctrl」跟「c」停止,用「rails s」打开的服务器之后,再打入「rails s」吧。


做好了之后,打开「0.0.0.0:3000/users/sign_in」吧!
 使用Windows的话,打开「localhost:3000/users/sign_in」吧。

有沒有显示下面一样子的网页了吗? Chrome users log in bootstrap 做好了按钮跟输入框的设定,接着追加navigation-bar的內容吧。


 ⑵ : navigation-bar


在navigation-bar注册登入的连接吧!
这一次在navigation-bar,游览列的右边加两个连接吧。

 设定看移动到,注册的网页「0.0.0.0:3000/users/sign_up」的连接
※ 移动到「0.0.0.0:3000」的连接可以省略,打入「/」这样也可以设定。


1 <a href="/users/sign_up">注册</a>

同样的移动到0.0.0.0:3000/users/sign_in的「登入」的连接,

1 <a href="/users/sign_in">登入</a>

这样子设定(上面放鼠标,可以看到答案)。

application.html.erb里面的navigation-bar追加这个连接吧。
首先用Sublime Text打开app > views > layouts文件夾之后打开「application.html.erb」,追加下面的內容吧。
※ 使用Sublime Text打开文件的方法请参考这里
 使用Windows的Sublime Text打开文件文件夾的方法请参考这里


 application.html.erb(追加第23、24行)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 <nav id="mainNav" class="navbar navbar-default navbar-fixed-top"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a href="/posts" class="navbar-brand">myapp</a> </div> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav navbar-right"> <li><a href="/users/sign_up">注册</a></li> <li><a href="/users/sign_in">登入</a></li> <li><a href="/posts/new">作新的投稿</a></li> </ul> </div> </div> </nav>

※ 使用navigation-bar的方法,请参考这里
※ 一起点击「Command」跟「c」停止,用rails s打开的服务器之后,再打入「rails s」吧。


 使用Windows的话,
 一起点击「ctrl」跟「c」停止,用「rails s」打开的服务器之后,再打入「rails s」吧。


做完了之后,打开「0.0.0.0:3000/posts」吧!
 使用Windows的话,打开「localhost:3000/posts」吧。

有沒有显示下面一样子的网页了吗? Chrome posts nav add log in
装饰也不是那么难吧?

 接着作登入机能,不要让沒有登入的利用者利用「posts」的网页吧。


 ② : 设定登入机能


在这里做做看登入机能吧!

在这里设定的是
  • 只让登入的会员,显示投稿(posts)的网页的设定
  • Chrome posts sign in before alert
  • 登入成功的时候・错的时候要显示的通知的设定
  • Chrome users log in after Chrome posts fail to sign in
这个两个设定吧。

 ⑴ : 对登入的会员显示「posts」的网页


那么在这里,设定不要让登入的会员以外的利用者显示「posts」的网页吧。
方法很简单。在不想被看的「controller」文件上,打入下面的设定就OK。

1 before_action :authenticate_user!

用这个设定检查利用者有沒有登入。

那么,开始做吧。
编辑「posts_controller.rb」的內容吧。

 posts_controler.rb(追加第3行)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


1 2 3 4 5 6 7 8 9 10 class PostsController < ApplicationController before_action :authenticate_user! def show @post = Post.find(params[:id]) end def index #以下省略

※ 一起点击「Command」跟「c」停止,用rails s打开的服务器之后,再打入「rails s」吧。


 使用Windows的话,
 一起点击「ctrl」跟「c」停止,用「rails s」打开的服务器之后,再打入「rails s」吧。


做完了之后,打开「0.0.0.0:3000/posts」吧!
 使用Windows的话,打开「localhost:3000/posts」吧。

 現在还沒登入,应该会显示登入网页吧? Chrome posts sign in before alert0.0.0.0:3000/posts/1等等別的网页试试看吧。
 使用Windows的话,打开「localhost:3000/posts/1」等等吧。


现在的状况,沒有登入的利用者不能打开「posts」网页。但是也可以设定让全部的利用者打开「show」「index」这个两个网页

设定,可以谁都可以看「show」跟「index」这个两个网页的內容吧!
编辑刚才的「posts_controller」文件的设定。


 posts_controller.rb(编辑第3行)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


1 2 3 4 5 6 7 8 9 10 class PostsController < ApplicationController before_action :authenticate_user!, :only => [:new, :create, :edit, :update, :destroy] def show @post = Post.find(params[:id]) end def index #以下省略

追加了后面的only => [...]的设定了。
这个设定的方法,跟routes.rb一样,应该可以推测內容吧。

这一次在 这个五个网页上,检查利用者有沒有登入。

 在「controller」文件里追加设定「new」跟「create」的网页里检查利用者有沒有登入的內容的时候要怎么设定呢?


1 before_action :authenticate_user!, :only => [:new, :create]


 ⑵ : 设定登入的通知


到这里,用检查利用者有沒有登入的设定,不让沒有登入的利用者看「posts」的网页的內容。
現在就可以注册会员登入网站了。但是注册登入之前,咱們设定利用者登入之后等等的时候显示的通知吧。 Chrome users log in after Chrome posts fail to sign in 这个通知也加几个內容就可以设定,做做看吧。
首先编辑「app > views > layouts > application.html.erb」<div class="container main-page">里的內容吧。

 application.html.erb(<div class="container main-page">之后追加內容)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


36 37 38 39 40 41 42 43 44 45 46 47 </nav> <div class="container main-page"> <% if notice %> <br> <p class="alert alert-success"><%= notice %></p> <% end %> <% if alert %> <br> <p class="alert alert-danger"><%= alert %></p> <% end %> <%= yield %> </div>

※ 一起点击「Command」跟「c」停止,用rails s打开的服务器之后,再打入「rails s」吧。


 使用Windows的话,
 一起点击「ctrl」跟「c」停止,用「rails s」打开的服务器之后,再打入「rails s」吧。


编辑好了之后,打开「0.0.0.0:3000/posts/new」吧!
 使用Windows的话,打开「localhost:3000/posts/new」吧。

有沒有显示下面图像一样的画面了吗? Chrome posts fail to sign in
 在这里解释设定的內容吧。

在这里的设定中,新追加

1 <% if notice %>
1 <% if alert %>

的设定。这个设定在做什么呢?

在这一些跟

1 <% end %>

之间的地方设定条件判别,然后在各个条件上显示各个显示的內容。

条件用
<% if 条件 %>
指定,如果条件成立的时候
<% end %>
显示到这里的內容。

这一次,

<% if notice %>
在设定有通知过來的时候的条件,
<% if alert %>
在设定有错误的通知过來的时候的条件。
<% if notice %>」(通知來的时候:notice)是,

1 2 <br> <p class="alert alert-success"><%= notice %></p>

<% if alert %>」(错误的通知來的时候:alert)是,

1 2 <br> <p class="alert alert-danger"><%= alert %></p>

显示各个內容。

如果是notice的话显示

Signed in successfuly.


如果是alert的话显示

You need to sign in or sign up before continuing.


这样的通知的內容,放在
<%= notice %> <%= alert %>
里面显示。
在这里显示的有颜色的文字是怎么样设定呢?
这个其实也是「Bootstrap」显示有颜色文字的设定。在文字class里指定「alert」跟「alert-success」「alert-danger」设定装饰的內容。

2 <p class="alert alert-success"><%= notice %></p>

2 <p class="alert alert-danger"><%= alert %></p>


绿色的通知在显示

<p class="alert alert-success">显示的文字</p>

红色的通知在显示

<p class="alert alert-danger">显示的文字</p>

各个內容。

总括一下在这里设定的內容吧。
  • 「<% if notice %>」跟「<% end %>」之间设定有通知來的时候
  • 「<% if alert %>」跟「<% end %>」之间设定有错误的通知來的时候
显示的內容。

各个通知在「<%= notice %>」「<%= alert %>」里显示內容。
这个通知是从哪里來的呢?
其实说这个通知可以自己作作看,在这里作作看通知吧。


通知在controller」文件里设定
  • 通知(notice)的话
  • flash[:notice] = "显示的內容"
    
  • 错误的通知(alert)的话
  • flash[:alert] = "显示的內容"
    
各个內容可以在网页上显示。

controller」文件里设定的各个通知的內容会显示在
<%= notice %>  <%= alert %>
里面。

show」的网页「0.0.0.0:3000/posts/1里显示自己设定的通知吧。

 posts_controller.rb(追加第7行)
※ 用半母字母数字打入。一起点击「Command」跟「s」可以保存內容。
 使用Windows的话,点击「ctrl」跟「s」可以保存內容。


5 6 7 8 def show @post = Post.find(params[:id]) flash[:notice] = "投稿" end

※ 一起点击「Command」跟「c」停止,用rails s打开的服务器之后,再打入「rails s」吧。


 使用Windows的话,
 一起点击「ctrl」跟「c」停止,用「rails s」打开的服务器之后,再打入「rails s」吧。


编辑完了之后,打开「0.0.0.0:3000/posts/1」吧!
 使用Windows的话,打开「localhost:3000/posts/1」吧。

有沒有显示下面图像一样的画面吗? Chrome posts 1 flash 这样设定好通知了!
这一次设定的通知是试试看的而已,所以这一次设定的內容就除掉吧。
「devise」的通知也是用这个设定。
通知的內容「devise」会自动作,所以简单的理解內容就OK。

 「posts_controller.rb」的edit」网页里,显示「@post」的「content」的通知要怎么样设定呢?
※ 在上面放鼠标,答案会显示。


1 2 3 4 def edit @post = Post.find(params[:id]) flash[:notice] = @post.content end


 ⑶ : 登入


到这里做完了限制看「posts」网页的设定跟通知的设定,咱們注册登入吧!
打开注册的网页「0.0.0.0:3000/users/sign_up之后,注册会员吧。

 使用Windows的话,打开localhost:3000/users/sign_up之后注册会员吧! Chrome users sign up bootstrap 登入之后会出现下面图像一样的画面吧。 Chrome posts root after sign up 这样子,会员注册好了。
注册完了之后,打开new」网页「0.0.0.0:3000/posts/new吧。沒有显示登入网页,显示作作投稿的网页的话OK。

 使用Windows的话,打开localhost:3000/posts/new吧。
会员登录也完了,用Sequel Pro看看保存好的会员资料吧。
※ 打开Sequel Pro的方法请参考这里,打开SqliteBrowser的方法请参考这里

像下面的图像一样,有沒有追加了保存的资料了吗? Sequel pro users 1


 ③ : 总结


到这里设定了登入机能的內容了(虽然很多是「devise」作的・・・)。

在这里设定了
  • 注册登入网页的设定
  • 网页上检查利用者有沒有登入的设定
  • 通知的设定
这个三个內容。

设定的內容请参考这里吧。

  • 注册登入网页的设定

  • 注册网页(「0.0.0.0:3000/users/sign_up」)

    app > views > devise > registrations文件夾里的new.html.erb文件里追加设定的內容。 Chrome users sign up bootstrap
    登入网页(「0.0.0.0:3000/users/sign_in」)

    app > views > devise > sessions文件夾里的new.html.erb文件里追加设定的內容。 Chrome users log in bootstrap
  • 网页上检查利用者有沒有登入的设定

  • 要限制显示网页的內容的话,想检查利用者的网页的资料库的「controller」文件里追加下面的设定。

    1 before_action :authenticate_user!

    这样子在全部的网页上检查利用者了。
    如果要指定检查的网页的話,设定像下面的內容。

    1 before_action :authenticate_user!, :only => [:new, :create, :edit, :update, :destroy]

  • 通知的內容

  • 在「devise」里,可以设定显示注册登入网页上的通知的內容。
    设定通知要追加下面的內容。

    1 2 3 4 5 6 7 8 <% if notice %> <br> <p class="alert alert-success"><%= notice %></p> <% end %> <% if alert %> <br> <p class="alert alert-danger"><%= alert %></p> <% end %>

    內容使用
    <% if 条件 %>
      内容
    <% end %>
    
    判别通知,在各个通知上显示设定的內容。

    设定的內容请参考这里

到这里辛苦你了。作的网站也更像会员制的网站吧。
 看「users」资料库里面,应该看到
  • 「family_name」
  • 「first_name」
  • 「self_introduction」
的框子裡沒有保存的资料,应为注册的时候沒有打入。

接着在这个资料库里保存资料,作「users」资料库的网页吧。