JavaScriptでリロードを禁止する機能の実装～ChatGPTと一緒に一問一答アプリを開発した話⑦～

window.addEventListener("beforeunload", function(event) {
  event.preventDefault();
  event.returnValue = "";
  const confirmationMessage = "再読み込みすすると、問題を再度作成することになります。よろしいですか？";
  event.returnValue = confirmationMessage;
  return confirmationMessage;
});

Rails.application.routes.draw do
（省略）
    collection do
      get 'choose'
      get 'ask'
      post 'ask'
      get 'next_question'
      post 'next_question'
      post 'check'
      get 'print'
      post 'print'
      get 'score'
      get 'retry'
      post 'retry'
    end
（省略）
end

class QuestionsController < ApplicationController
  def ask
    if request.get?
      render html: '<script>alert("選択内容が解除されトップページに戻ります。");window.location.href = "/";</script>'.html_safe
    elsif request.post?

      # まずはセッション変数を取得する
      # next_questionメソッドで使うため
      # session[:asked_question_ids] ||= [] でセッションが未定義なら新しく作るという意味になる
      session[:asked_question_ids] ||= []
      （省略）

        redirect_to root_path, alert: "出題できる問題がありません。"
      end
    end
  end


  def next_question
    if request.get?
      render html: '<script>alert("選択内容が解除されトップページに戻ります。");window.location.href = "/";</script>'.html_safe
    elsif request.post?
      if session[:question_range] != nil
        @question = Question.where(id: session[:question_range]).where.not(id: session[:asked_question_ids]).order("RAND()").first
      else
        #当メソッドを呼び出す際には最低1回はask~resultメソッドを実行している。そのため、セッションを参考にして分野を指定しながら出題済みの問題を避けて次の問題（インスタンス）を取得できる。
        @question = Question.where(genre_id: session[:selected_genre_ids],level_id: session[:selected_level_ids]).where.not(id: session[:asked_question_ids]).order("RAND()").first
      end
        # session[:asked_question_ids]に取得したインスタンスの問題idを追加格納する。
        if @question.present?
          session[:asked_question_ids] << @question.id
          @choices = @question.choices.includes(:question) #questionとアソシエーション関係なので（）の中にはカラム名ではなく関係のあるモデル名にする「_id」は不要
          @answer = Answer.find(@question.id)

          if session[:question_nums].present?
            @question_nums = session[:question_nums]
          end
          
          # -1は出題数を調整するため
          @asked_question_count = (session[:asked_question_ids].length - 1)
          @correct_counts = session[:correct_answers].length

          # to_fは浮動小数（float）への変換
          @correct_rate = ((@correct_counts.to_f / @asked_question_count.to_f) * 100).round(1)
          # 呼び出すビューファイルはaskアクションのビューファイル
          render :ask
      else
          redirect_to score_questions_path
      end 
    end
  end

  def retry
    if request.get?
      render html: '<script>alert("選択内容が解除されトップページに戻ります。");window.location.href = "/";</script>'.html_safe
    elsif request.post?
      # いくつかのセッションをリセットする
      session[:asked_question_ids] = []
　　（省略）
      if @question.present?
          # 不正解問題のidを出題済みセッションに格納する
          session[:asked_question_ids] << @question.id
          @choices = @question.choices.includes(:question) #questionとアソシエーション関係なので（）の中にはカラム名ではなく関係のあるモデル名にする「_id」は不要
          @answer = Answer.find(@question.id)
          render :ask
      else
        redirect_to score_questions_path
      end 
    end
  end

  def print
    if request.get?
      render html: '<script>alert("選択内容が解除されトップページに戻ります。");window.location.href = "/";</script>'.html_safe
    elsif request.post?
      # 出題数をパラムスより取得する
      question_count = params[:question_count].to_i
  (省略)
    end

end