(1)Adding a secure password
1)configuration
1.bcrypt-ruby install
$ vi Gemfile
gem 'bcrypt'
$ bundle install
2.add "password_digest" columns to the users table
$ rails generate migration add_password_digest_to_users password_digest:string
invoke active_record
create db/migrate/20150713044621_add_password_digest_to_users.rb
$ more db/migrate/20150713044621_add_password_digest_to_users.rb
class AddPasswordDigestToUsers < ActiveRecord::Migration def change add_column :users, :password_digest, :string end end
3.migration
$ bundle exec rake db:migrate
4.User model "has_secure_password" method
$ vi app/models/user.rb
class User < ActiveRecord::Base has_secure_password end
2)create test users
$ vi rails c
2.0.0p247 :004 > test = User.create(name: "testuser4", email: "test4@example.com", password: "test4pass", password_confirmation: "test4pass")
=> #<User id: 4, name: "testuser4", email: "test4@example.com", created_at: "2015-07-13 04:51:06", updated_at: "2015-07-13 04:51:06", password_digest: "$2a$…">
(2)AngularJS Signup form
1)AngularJS route
$ vi app/assets/javascripts/mymodule.js.erb
myModule = angular.module('myModule', ['ui.bootstrap','ngRoute','ngResource']); myModule.config(function($routeProvider, $locationProvider) { $locationProvider.html5Mode(true); $routeProvider ....... .when("/users/new", { templateUrl: "<%= asset_path('users/new.html.erb') %>" })
2)AngularJS template new view
$ vi app/assets/templates/users/new.html.erb
<div ng-controller="UsersNewCtrl" class="row"> <div class="col-md-6 col-md-offset-3"> <h1 class="text-center">Sign up</h1> <form name="userNewForm" novalidate> <div class="well"> <div class="form-group"> <label>name</label> <input name="name" class="form-control" ng-model="user.name" required /> </div> <div class="form-group"> <label>email</label> <input type="email" name="email" class="form-control" ng-model="user.email" required /> </div> <div class="form-group"> <label>password</label> <input type="password" name="password" class="form-control" ng-model="user.password" required /> </div> <div class="form-group"> <label>password_confirmation</label> <input type="password" name="password_confirmation" class="form-control" ng-model="user.password_confirmation" required /> </div> <button ng-click="submit()" class="btn btn-primary"> Create my account </button> </div> </form> </div> </div>
3)AngularJS controller "UsersNewCtrl"
$ vi app/assets/javascripts/mymodule.js.erb
myModule.controller("UsersNewCtrl", function($scope, userResource) { $scope.user = new userResource(); });
4)add a link to home view
$ vi app/assets/templates/static_pages/home.html.erb
<p class="text-center"> <a class="btn btn-large btn-primary" href="/users/new">Sign up now!</a> </p>
(3)AngularJS $resource POST
1)AngularJS $resource POST
$ vi app/assets/javascripts/mymodule.js.erb
myModule.factory("userResource", function($resource) { return $resource("/app/users/:id", { id: "@id" }, { 'create': { method: 'POST' }, .......... } ); }); mymodule.controller("UsersNewCtrl", function($scope, userResource, $location) { $scope.user = new userResource(); $scope.submit = function() { function success(response) { $location.path("/users/" + response.id); } function failure(response) { console.log("failure", response) } userResource.create($scope.user, success, failure); }; });
2)Rails controller create action
$ vi app/controllers/users_controller.rb
def create @user = User.new(user_params) if @user.save render json: @user, status: :created, location: @user else render json: @user.errors, status: :unprocessable_entity end end private def user_params params.permit(:name:email,:password,:password_confirmation) end
3)CSRF
*Problem
Can't verify CSRF token authenticity
Completed 422 Unprocessable Entity in 1ms
*Avoidance
$ vi app/assets/javascripts/mymodule.js.erb
myModule.config(function($httpProvider) { $httpProvider.defaults.headers.common['X-CSRF-Token'] = $('meta[name=csrf-token]').attr('content'); });
4)test operation
1.home view
2.click "Sign up now!"
3.user sign up
4.user's profile view