missing required keys: [:filename]を解決したい

Question

解決したいこと

現在ポートフォリオ作成中のプログラミング入門者です。ポートフォリオの中で wavesurfer.jsというライブラリを利用して音声の波形をだそうと考えています。
具体的には、form_withで値を受け取る＝＞データベースに保存＝＞保存した値を取り出して、 wavesurfer.jsに読み込んでもらう、ということをしたいです。

https://railshero.pw/665/using-wavesurfer-js-with-ruby-on-rails-waveform-spectrum/

こちらの記事を参考にさせていただき、Active Storageを利用しました。

しかし、私の場合、railsのform_withで受け取った値を上手くjavascriptに渡せていないようです。

発生している問題・エラー

ActionController::UrlGenerationError in Gogakus#show
Showing /app/app/views/gogakus/show.html.erb where line #50 raised:

No route matches {:action=>"show", :controller=>"active_storage/blobs/redirect", :id=>"4",
 :signed_id=>#<ActiveStorage::Attached::One:0x00007f765816e808 @name="file", 
@record=#<Gogaku id: 4, subject: "英語", body: "旅行先での英会話", file: nil, answer: "ここに答えを書きます", 
dictum_user_id: 1, created_at: "2022-03-14 10:04:35.893484000 +0000", 
updated_at: "2022-03-14 10:04:35.893484000 +0000">>}, missing required keys: [:filename]
Did you mean?  rails_service_blob_url
               rails_service_blob_proxy_url
               rails_service_blob_proxy_path
Extracted source (around line #50):
50
51
52
53
              
    </div>
    <script>
        wavesurfer.load('<%= rails_service_blob_path(@gogaku.file) %>');
    </script>

show.html.erb

<div id="waveform"> </div>

    <div style="text-align: center">
        <div id="menu">
            <button id="btnStartPause" class="menubutton">start/pause</button>

        </div>
        <p class="row">
            <div class="col-xs-1">
                <i class="glyphicon glyphicon-zoom-in"></i>
            </div>

            <div class="col-xs-10">
                <input id="slider" type="range" min="1" max="200" value="1" style="width: 100%" />
            </div>

            <div class="col-xs-1">
                <i class="glyphicon glyphicon-zoom-out"></i>
            </div>
        </p>
    </div>
    <script>
        wavesurfer.load('<%= rails_service_blob_path(@gogaku.file) %>');
    </script>
        <%= javascript_pack_tag 'gogakus/show'%>
    



    <tr>
        <th>答え</th>
        <td><%= @gogaku.answer%></td>
        
    </tr>
</table>
<textarea rows="10" cols="50" placeholder="ここに文字を入力出来ます"></textarea>

<%= link_to "戻る", root_url, class:"btn btn-link" %>

new.html.erb

<%= form_with model: @gogaku,name:"GogakuForm" do |f| %>
<%# ,name: "GogakuForm",id:"G_id" %>


    <div class = "form-group">
        <label>教科</label>
        <%= f.text_field :subject, class:"form-control"%>
    </div>

    <div class = "form-group">
        <label>内容</label>
        <%= f.text_field :body, class:"form-control"%>
    </div>

    <div class = "form-group">
        <label>音声</label>
        <%= f.file_field :file,name:"g_file",class:"form-control" %>
    </div>
<%# ,id:"audio_file", type:"file" ,accept:"audio/*", name:"title" %>

    <div class = "form-group">
        <label>答え</label>
        <%= f.text_field :answer, class:"form-control"%>
    </div>

    
    <%= f.submit"登録",class:"btn btn-danger"%>
    <%= link_to "戻る", root_url ,class:"btn btn-info"%>
    
    
<% end %>

show.js

var wavesurfer = WaveSurfer.create({
    container: '#waveform',
    waveColor: 'hotpink',
    progressColor: 'orange',
    scrollParent: true
});
#(長いのと今回のエラーとは関係ないと思われる部分は省略)

コントローラー

  def show
        @gogaku = Gogaku.find(params[:id])  
  end

    def new
        @gogaku = Gogaku.new
    end

    def create
        @gogaku = current_user.gogakus.build(gogaku_params)
        
        if @gogaku.save
            flash[:success] = "登録完了!"
            redirect_to root_url
        else
            @feed_items = current_user.feed.paginate(page: params[:page])
            flash[:danger] = @gogaku.errors.full_messages if @gogaku.errors.any?
            redirect_to new_gogaku_path
        end
    end

        def gogaku_params
            params.require(:gogaku).permit(:subject, :body, :file, :answer)
        end

自分で試したことなど

もともとjavascriptとrailsのみで機能を作ろうとしたが上手く行かなかったので今回参考にさせて頂いた記事を参考にActiveStorageを導入
・エラーによると:filenameがないらしいが、そのようなカラムはつくっていないので恐らくActiveStorageによってつけられたもの？
・とりあえずform_withにname属性をつけて見たが変わらずエラー
・did you mean?はすべて試しましたが、すべて同じエラーになってしまいました。
何かしらアドバイスがあればよろしくお願いいたします。

Answer 1

コントローラーのcreateに
@gogaku.file = params[:gogaku][:file]
を記述
showを
wavesurfer.load('<%= rails_blob_path(@gogaku.file) %>');
に変更したところうまく動きました。
ご協力ありがとうございました。