Aperçu

Dans ce tutoriel, vous apprendrez à implémenter une authentification basée sur les cookies avec Rails 8. Rails propose de nombreuses méthodes d’authentification, mais les cookies sont sécurisés, faciles à utiliser et gérés automatiquement par les navigateurs.

Alors que de nombreux tutoriels utilisent JWT, celui-ci présente un inconvénient majeur : où le stocker ? Le stockage local n’est pas sécurisé. Si votre principal consommateur d’API est le navigateur, l’authentification par cookie est plus sûre et plus simple.

Prérequis

Créer une nouvelle application Rails API avec PostgreSQL

rails new my-api --api -d=postgresql

Configuration de la connexion PostgreSQL

Modifier config/database.yml :

development:
  <<: *default
  database: my_api_development
  username: <%= ENV.fetch("DB_USER") %>
  password: <%= ENV.fetch("DB_PASSWORD") %>

Générer le modèle et le contrôleur User

rails generate model User username:string email:string password_digest:string
rails generate controller Users

Ajouter has_secure_password au modèle User

class User < ApplicationRecord
  has_secure_password
  validates :email, presence: true, uniqueness: true
  normalizes :email, with: -> e { e.strip.downcase }
end

Configuration du middleware pour les cookies de session

Dans config/application.rb :

config.middleware.use ActionController::Cookies
config.middleware.use ActionDispatch::Session::CookieStore, key: '_my_api_session', expire_after: 5.years

helpers d’authentification dans ApplicationController

class ApplicationController < ActionController::API
  before_action :authenticate_user

  private

  def authenticate_user
    render json: { error: "Non autorisé" }, status: :unauthorized unless current_user
  end

  def current_user
    @current_user ||= User.find_by(id: session[:user_id])
  end
end

Configuration du projet React avec Vite

npm create vite@latest my-react-app -- --template react-ts

Proxy du Frontend React

Dans vite.config.ts :

export default defineConfig({
  plugins: [react()],
  server: {
    proxy: {
      '/api': {
        target: 'http://localhost:3000',
        changeOrigin: true,
        secure: false,
      },
    },
  },
})

Conclusion

Vous avez appris à implémenter l’authentification par cookies, la méthode la plus stable pour les applications basées sur le navigateur. Mais la sécurité ne s’arrête pas là :

  • CSRF : La prévention de la falsification de requête intersite est cruciale.
  • Politiques de mots de passe plus fortes ou connexions OAuth.
  • Expiration des sessions et déconnexion.