[RUBY] [Rails] Comment résoudre le problème d'écrasement de l'image par défaut lors de l'édition sans télécharger l'image [Active Storage]

J'ai trouvé un nouveau bogue alors que mon application développée personnellement est presque terminée ... (je suis content de l'avoir remarqué avant sa sortie)

L'introduction est longue, donc si vous voulez connaître la solution rapidement, veuillez sauter cette zone! !!

J'ai implémenté la fonction de téléchargement d'image telle que l'image de profil en utilisant ActiveStorage, mais les bogues suivants ont été trouvés. Par exemple, supposons qu'un utilisateur définit une image sur une page d'édition utilisateur. Et puis supposons que vous vouliez changer votre mot de passe. Naturellement, l'utilisateur n'entre que le nouveau mot de passe et cette valeur est publiée à partir du formulaire sur la page d'édition. À ce stade, l'image précédemment téléchargée n'est pas définie dans la zone de sélection de fichier (champ_fichier) du formulaire, donc si l'action de mise à jour est exécutée dans cet état, l'image précédemment téléchargée disparaîtra et elle est définie dans l'application. Il sera écrasé par l'image par défaut.

En d'autres termes, il fournit à l'utilisateur le pire UX que l'image change ne peut pas être maintenue à moins que l'image ne soit téléchargée à chaque fois que l'image est modifiée. Cela doit être fait, alors je vais écrire une solution!

Solution (super facile)

Ajoutez ce qui suit au contrôleur.

users_controller.rb

def update
    @user = User.find(params[:id])
    @user.avatar.attach(params[:avatar]) if @user.avatar.blank?
    if @user.update(user_params)
      flash[:success] = 'J'ai mis à jour mon profil'
      redirect_to @user
    else
      render 'edit'
    end
  end

Ajoutez simplement ** if @ user.avatar.blank? **! En fait, je ne savais pas comment créer un cache d'images déjà définies dans Active Storage, que j'aie googlé ou Google, donc en réfléchissant par moi-même et en vérifiant diverses hypothèses, j'ai pu trouver cette phrase et la résoudre. J'ai fait. (Il est sorti avec CarrierWave) J'ai confirmé que le test avait également réussi. (Il a été confirmé que le test échouera correctement si cette phrase est effacée)

Mais avec ça

** Si vous voulez changer l'image déjà définie normalement, @ user.avatar.bkank? '' Devient faux et @ user.avatar.attach (params [: avatar]) ` N'est-il pas possible de changer l'image sans exécuter? ** **

Tu ne penses pas? Je pense. .. Même avec w, l'image réelle est mise à jour et le test réussit, donc je vais l'utiliser pour le moment.

** Si quelqu'un comprend le principe ici, je vous serais reconnaissant si vous pouviez commenter. ** **

Code de test

En complément, le code de test qui a réellement réussi est affiché ici (seule la partie pertinente est extraite).

upload_image_spec.rb

require 'rails_helper'

RSpec.describe 'Télécharger l'image', type: :system do
  let(:user) { FactoryBot.create(:user) }

  before do
    valid_login(user)
  end

  #Télécharger et enregistrer des images
  def upload_user_avatar(user)
    visit edit_user_path(user)
    attach_file 'user_avatar', "#{Rails.root}/spec/fixtures/images/test.jpg "
    click_on 'enregistrer'
  end

  it 'L'image téléchargée par l'utilisateur s'affiche sur Ma page' do
    upload_user_avatar(user)
    expect(page).to have_selector("img[src$='test.jpg']")
  end

  it "L'utilisateur réussit à mettre à jour l'image" do
    visit edit_user_path(user)
    attach_file 'user_avatar', "#{Rails.root}/spec/fixtures/images/updated_test.jpg "
    click_on 'enregistrer'
    expect(page).to have_selector("img[src$='updated_test.jpg']")
  end

  it "Lors de l'édition sans télécharger une image, elle ne doit pas être écrasée par les données d'image par défaut" do
    upload_user_avatar(user)
    visit edit_user_path(user)
    click_on 'enregistrer'
    expect(page).to have_selector("img[src$='test.jpg']")
  end
end

Merci d'avoir lu jusqu'au bout!

Je sort ce que j'ai appris tous les jours! Si vous avez des suggestions, je vous serais reconnaissant de bien vouloir commenter! !!