Livello dello stack Errore troppo profondo per Google Maps

Question

Ho ricevuto un errore troppo profondo di questo livello di stack e non sono sicuro da dove provenga. Ecco l'errore:

Sto usando l'API JavaScript di Google Maps per visualizzare gli elementi. Ecco il modello:

 class Item < ApplicationRecord
  belongs_to :user
  has_one_attached :photo

  validates :price, presence: true, if: :available_for_rent?
  #address validations
  validates :street, presence: true
  validates :city, presence: true
  validates :state, presence: true
  validates :zip, presence: true

  scope :rentable, -> { where(available_for_rent: true) }

  #google maps
  geocoded_by :address
  after_validation :geocode

  def address
    [street, city, zip, state].compact.join(", ")
  end

  #validate size of photo uploads
  validate :photo_validation
  def photo_validation
    if photo.attached?
      if photo.blob.byte_size > 3000000
        photo.purge
        errors[:base] << 'The file uploaded was too big. Jubal Talents only allows photo uploads under 3 MB.'
      elsif !photo.blob.content_type.starts_with?('image/')
        photo.purge
        errors[:base] << 'Wrong format. Please ensure file is jpg or png.'
      end
    end
  end
  
end

Ecco l'html in cui viene attivato l'errore:

  <div class="column">
      <%= tag.div nil, id:'map', data: {items: @items.to_json(methods: [:address])}%>
      <div class="notification">
        <p class="title is-6">Addresses are not exact. You must contact the owner to recieve a pickup address.</p>
      </div>
  </div>
</div>

ed ecco il javascript:

document.addEventListener("turbolinks:load", function() {
    var map = new GMaps({
        div: '#map',
        lat: 38.5816,
        lng: -121.4944
      });
      window.map = map;

      var items = JSON.parse(document.querySelector("#map").dataset.items);
      window.items = items;

      var bounds = new google.maps.LatLngBounds();

      items.forEach(function(item) {
        if (item.latitude && item.longitude) {
            var marker = map.addMarker({
                lat: (item.latitude - Math.random()*.1),
                lng: (item.longitude - Math.random()*.1),
                title: item.address,
                infoWindow: {
                    content: `<p><a href="/items/${item.id}">${item.name}</a></p>`
                }
            })
        bounds.extend(marker.position);
        }
      });
    map.fitBounds(bounds);

});

Sono abbastanza certo che l'errore provenga dal modello, ma sono ancora un po 'nuovo a tutto. Qualsiasi aiuto sarebbe molto apprezzato! :)

Answer 1

Si scopre che il metodo "to_json" stava causando il problema.

La causa principale di questo problema nel mio caso era avere un campo con lo stesso nome nel mio modello (colonna nella tabella) come allegato, che non è necessario, poiché Active Storage utilizza tabelle separate. E quando to_json viene chiamato su un tale oggetto modello, causa un errore troppo profondo a livello di Stack. Dopo aver rimosso la colonna dal database, il problema scompare.

Questo post ha davvero aiutato il mio problema