ERROR WEBrick::HTTPStatus::RequestURITooLarge when adding more that 10 columns to a datatable

Question

I am trying to add 2 more hidden columns to my datatable but I keep on receiving the URI is too large error as well as "ERROR TypeError: can't convert nil into an exact number"

Started GET "/assets/datatables/emails_datatable.self-cd9ac92f42d16be45f44ff8a616bd1ed9ff6e16588934ecabaadfff5000e4db2.js?body=1" for ::1 at 2017-07-21 14:46:15 -0400 
[2017-07-21 14:46:15] ERROR WEBrick::HTTPStatus::RequestURITooLarge 
[2017-07-21 14:46:15] ERROR TypeError: can't convert nil into an exact number 
/Users/kristianquincosa/.rvm/gems/ruby-2.2.3/gems/activesupport-4.2.3/lib/active_support/core_ext/time/calculations.rb:226:in `-' 
/Users/kristianquincosa/.rvm/gems/ruby-2.2.3/gems/activesupport-4.2.3/lib/active_support/core_ext/time/calculations.rb:226:in `minus_with_duration' 
/Users/kristianquincosa/.rvm/gems/ruby-2.2.3/gems/activesupport-4.2.3/lib/active_support/core_ext/time/calculations.rb:237:in `minus_with_coercion' 
/Users/kristianquincosa/.rvm/rubies/ruby-2.2.3/lib/ruby/2.2.0/webrick/accesslog.rb:111:in `setup_params' 
/Users/kristianquincosa/.rvm/rubies/ruby-2.2.3/lib/ruby/2.2.0/webrick/httpserver.rb:219:in `access_log' 
/Users/kristianquincosa/.rvm/rubies/ruby-2.2.3/lib/ruby/2.2.0/webrick/httpserver.rb:111:in `run' 
/Users/kristianquincosa/.rvm/rubies/ruby-2.2.3/lib/ruby/2.2.0/webrick/server.rb:294:in `block in start_thread'

that is the entire error message

These are my columns specified in my email_broadcasts_datatable.rb (the commented column are the ones that trigger the error)

def data
  email_broadcasts.map do |broadcast|
    [
      broadcast.id,
      broadcast.email_clickthroughs_count,
      broadcast.email_abuse_reports_count,
      # broadcast.email_unsubscribes_count,
      # broadcast.email_opens_count,
      broadcast.status.titleize,
      broadcast.scheduled,
      broadcast.subject,
      broadcast.user.email,
      broadcast.updated_at.in_time_zone("Eastern Time (US & Canada)").strftime('%B %-d, %Y %l:%M%P'),
      link_to('', edit_email_broadcast_path(broadcast), class: "btn btn-primary fa fa-cog"),
      link_to('', email_broadcast_path(broadcast), method: :delete, data: {confirm: "Are you sure you want to delete this email broadcast?"}, :remote => true, class: "btn btn-danger fa fa-trash delete_email_broadcast")
    ]
  end
end

Also this is my javascript code for the datatable.

//Code for emails datatable

$(function() {

  $('#emails').DataTable({
    pageLength: 10,
    responsive: true,
    processing: true,
    serverSide: true,
    autoWidth: false,
    ajax: $('#emails').data('source'),
    dom: '<"html5buttons"B>lTfgitp',
    buttons: [
    { extend: 'copy'},
    {extend: 'csv'},
    {extend: 'excel', title: 'Emails'},
    {extend: 'pdf', title: 'Emails'},
    {extend: 'print',
    customize: function (win){
      $(win.document.body).addClass('white-bg');
      $(win.document.body).css('font-size', '10px');

      $(win.document.body).find('table')
      .addClass('compact')
      .css('font-size', 'inherit');
    }
  }
  ],
  columnDefs: [
  {
    render: function ( data, type, row ) {
      return data + ' ' + row[10] + ' ' + '<button type="button" class="btn btn-success" data-toggle="modal" data-target="#stats"><i class="fa fa-line-chart"></i></button>';
    },
    targets: 9
  },
    {
    targets: [ 0 ], //,9,10,11 
    visible: false,
    searchable: false
  },

  {
    render: function ( data, type, row ) {

      switch(data) {
        case "Draft":
        return "<span class='label label-primary'>" + data + "</span>"
        case "In Queue":
        return "<span class='label label-warning'>" + data + "</span>"
        case "Completed":
        return "<span class='label label-success'>" + data + "</span>"
        case "Processing":
        return "<span class='label label-info'>" + data + "</span>"
        default:
        break;
      }
    },
    targets: 4
  },
  {
    render: function ( data, type, row ) {

      if (data) {
                            //True
                            return "<span class='label label-success'>Yes</span>"
                          } else {
                            return "<span class='label label-danger'>No</span>"
                          }
                        },
                        targets: 5
                      },
                      {
                        orderable: false,
                        targets: [5,8,9]
                      }   
                      ],
                      order: [[0, 'desc' ]],
                      columns: [
                      { width: "0%" },
                      { width: "2%" },
                      { width: "2%" },
                      { width: "8%" },
                      { width: "8%" },
                      { width: "30%" },
                      { width: "18%" },
                      { width: "18%" },
                      { width: "12%" }
                      ]
                    });
});

And this is my table in HTML

<table id="emails" class="table table-striped table-bordered table-hover" data-source="<%= email_broadcasts_path(format: :json) %>">
  <thead>
    <tr>
      <th>Id</th>
      <th>Click Throughs</th>
      <th>Abuse</th>
    <!--  <th>Unsuscribes</th>
     <th>Opens</th> -->
      <th>Status</th>
      <th>Scheduled</th>
      <th>Subject</th>
      <th>Created By</th>
      <th>Updated</th>
      <th>Actions</th>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>

Answer 1

This is a problem with WEBrick itself. It has an internal limit to the URL length.

You should run another web server like Puma, Thin, or Unicorn.

Add the following to your Gemfile to run one of those locally

group :development do 
  gem 'puma'
end