mozgás a CarrierWave-ről az ActiveStorage-ra egy Rails alkalmazásban

NJ Pearman
NJ Pearman

kövesse

Jun 20, 2018 * 9 perc olvasás

az általunk használt Ruby on Rails tanítani webes alkalmazások fejlesztése A EPFL Extension School. Ez egy nagyszerű keretrendszer, amely szilárd, kipróbált és megbízható,és könnyen követhető struktúrát mutat be, amikor megteszi az első lépéseket a webfejlesztésről.

de ez is egy folyamatosan fejlődő szoftver, fejlesztések és új funkciók jelennek meg minden évben. A Rails 5.2-es verziójának egyik legújabb kiegészítése az ActiveStorage funkció, amely először adja hozzá az egyszerű fájlfeltöltés-kezelést a core Rails keretrendszerhez.

webalkalmazás-fejlesztési programunk első iterációjában egy témát is belefoglalunk, hogy megtanuljuk, hogyan lehet fájlfeltöltéseket hozzáadni egy Rails alkalmazáshoz. A programban azonban a Rails 5.1-et használjuk, a fájlfeltöltés tárgya pedig az egyik széles körben használt harmadik féltől származó megoldást használja a fájlfeltöltések hozzáadásához, az úgynevezett CarrierWave. Ez egy szilárd harmadik fél gyöngyszeme, amely lehetővé teszi számunkra, hogy végre fájlfeltöltések egy Rails app és használatban van számos valós Ruby on Rails alkalmazások-beleértve a tanuló platform!

de az ActiveStorage bevezetésével ezek a harmadik féltől származó drágakövek kevésbé vonzóak, mint ez az új megoldás, amely a síneken belül van. Valójában a gemkapocs, a másik népszerű, harmadik féltől származó fájlfeltöltési drágakő, már bejelentette, hogy elavult az ActiveStorage javára. A gemkapocs fejlesztői felismerték, hogy az ActiveStorage jobb választás a fejlesztők számára, és abbahagyták a további munkát a saját drágakövükön.

tehát nézzük meg konkrétan, hogy mi kell ahhoz, hogy a CarrierWave-ről a Rails 5.1-ben az ActiveStorage-ra lépjünk a Rails 5.2-ben.

az alkalmazás

a webalkalmazás-fejlesztési programban a My Bucket List nevű webes alkalmazás felépítésén dolgozunk. Ez egy olyan alkalmazás, amely lehetővé teszi a felhasználók számára, hogy olyan élményeket hozzanak létre és kövessenek nyomon, amelyeket mindig is el akartak érni. A felhasználók láthatják, hogy mások mit hoztak létre, és nyomon követhetik azokat is. Az alkalmazás egyik funkciója lehetővé teszi a felhasználó számára, hogy feltöltse saját avatárját, és ezt a funkciót azért építjük fel, hogy megismerjük a fájlfeltöltéseket és mellékleteket a CarrierWave használatával.

a felhasználó feltölthet egy avatart ezzel az űrlappal, a CarrierWave

használatával tehát először nézzük meg gyorsan, mi jár egy egyszerű melléklet hozzáadásával a CarrierWave használatával.

CarrierWave configuration

annak érdekében, hogy a CarrierWave egy projektbe kerüljön, a következőket kell tennünk:

  • adja hozzá a CarrierWave drágakövet a Gemfile – hez.
  • tartalmazza az ActiveRecord CarrierWave adapterét egy konfigurációs inicializálón belül, config/initializers/carrierwave.rb.

majd egy képmelléklet hozzáadásához egy modellhez:

  • létrehoz egy feltöltő segítségével rails generate uploader UploaderName.
  • adjon hozzá egy attribútumot a modellhez, hogy tárolja a csatolt fájlnevet minden rekordhoz, a kapcsolódó adatbázis-migrációval együtt.
  • értékek szerkesztése a feltöltőben, például a tárolási hely feltöltése és az alapértelmezett kép.
  • használja a mount_uploader makrót a modellben az adott feltöltő felvételéhez.
  • adjon hozzá egy fájl űrlapmezőt, ahol egy kép feltölthető.
  • adja hozzá a modellattribútumot a fájlmezőt tartalmazó űrlapot kezelő vezérlő erős paramétereinek listájához.

tekintsük tovább az alábbi pontok egyikét: a CarrierWave-ben minden olyan modellhez speciális attribútumokat kell hozzáadni, amelyhez csatolt fájl szükséges. Például egy User modellhez ,amelyhez avatar képet kell csatolni, szüksége lesz egy :avatar nevű attribútumra, amely String. Ehhez adatbázis-áttelepítésre van szükség az alapul szolgáló adatbázis-oszlop hozzáadásához, valamint egy Uploader osztály létrehozásához és felszereléséhez a modellben található attribútumhoz.

ez nem különösebben fáradságos, de mint látni fogjuk, az ActiveStorage eseti alapon sokkal kevesebb kódot igényel.

még egy kiemelendő pont az, hogy a My app — ban — a My Bucket List alkalmazásban-a CarrierWave avatar feltöltő az alapértelmezett egyszerű fájltárolóval van beállítva. A sorrendben a feltöltött képeket az alkalmazás public/ mappájában tárolják. Ez a pontos útvonal az avatar Uploader osztályán belül van meghatározva, és "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"értékre van állítva. Ez egy elérési út a public/ mappához képest, így a feltöltött képek közvetlenül elérhetők a webszerveren keresztül. Ez lehetővé teszi a közvetlen hozzáférést a mellékletfájlokhoz, amelyeket később ellentétben állhatunk az ActiveStorage-val.

frissítés Rails

mielőtt megnézné ActiveStorage, szükséges frissíteni Rails 5.2. Ez egy olyan feladat, amely meglehetősen részt vehet, az alkalmazás összetettségétől függően. Az itt használt alkalmazást, amelyet a WAD programunkba építünk, nem különösebben nehéz frissíteni, de még mindig szüksége van némi gondosságra és figyelemre.

Íme, mit tettem, hogy frissítsem a saját bakancslista alkalmazást a Rails 5.1-ről a Rails 5.2-re.

először létrehoztam egy új ágat a Git repository — ban a frissítés elkülönítéséhez-fontos, hogy visszatérhessünk az alkalmazás előző működő verziójához, ha valami rosszul megy a frissítési folyamat során!

az új ágon megváltoztattam a Rails verzióját a Gemfile — ben '~> 5.1.2' – ről '~> 5.2.0' – re, majd futtattam bin/bundle update rails – ez a parancs letölti a rails új verzióját és az alkalmazás összes kapcsolódó gyöngyszemét. Az alkalmazásomhoz nem voltak drágakő-konfliktusok, de ha harmadik féltől származó drágaköveket használ, előfordulhat, hogy ezen a ponton meg kell oldania a különböző drágakő verziók közötti konfliktusokat!

az új Rails gem telepítése és a függőségek telepítése után frissíteni kell az alkalmazást. Ezt a bin/bundle exec rails app:update használatával tettem. Ez a parancs programozottan frissíti az alkalmazás összes szükséges fájlját a Rails 5.2 használatához.

de… ez a parancs felülírja az alkalmazásban végrehajtott módosításokat, például config/routes.rb. Szerencsére a parancs megkérdezi, hogy felülírja-e az egyes fájlokat, és lehetőség van a diff bármelyik fájlra a folyamat során, hogy ellenőrizze, mi lenne felülírva. Az egyes felülírások parancssora , ami azt jelenti:

  • Y a “Yes, overwrite my file” (igen, felülírja a fájlomat) beállítás Az alapértelmezett beállítás, Ha csak megnyomja a Entergombot.
  • n a “nem, ne írja felül a fájlomat”
  • a az ” Igen, írja felül ezt a fájlt, és felülírja az összes többi fájlt is!”. (Az Általános szabályom az, hogy soha ne használj a – et).
  • q a “Quit this process”
  • d a “Mutasd meg a fájl és a felülírás közötti különbségeket”
  • h mert ” mutasd meg nekem egy listát arról, hogy mit jelent a Ynaqdh

az alkalmazásomban minden felülírást elfogadtam Y – vel, kivéve config/routes.rb és config/locales/en.yml. Ez a két fájl olyan fájlok voltak, amelyeket megváltoztattam, ezért meg akartam tartani a verziómat, ezért a n – et választottam.

ez a frissítési folyamat jobban részt vehet, ha összetettebb alkalmazással rendelkezik, különösen akkor, ha sok egyéni konfiguráció van a környezeti konfigurációs fájlokban, pl. config/environments/production.rb, config/environments/test.rbés config/environments/development.rb. A frissítés fontos beállításokat ad ezekhez a fájlokhoz, de meg akarja tartani a saját egyéni konfigurációját is — ez az, ahol az alkalmazás eredeti verziója külön git ágban segít. Ezután lehetséges, hogy a régi ág kódja ellenőrizze, hogy az összes alkalmazáskód és konfiguráció még mindig a helyén van-e a frissítés után.

a bin/bundle exec rails app:update futtatása után szükséges volt, hogy hozzáadjam a bootsnapdrágakövet a Gemfile – hez. Ez egy új drágakő, amelyet a Rails 5.2-ben használnak, de nem adják hozzá a app:upgrade parancs részeként. Tehát csak hozzáadtam a gem 'bootsnap' – ot a Gemfile – hez, majd futtattam a bin/bundle install – et.

ezt követően a bakancslista alkalmazás elindult, mint a rails server használata előtt.

a CarrierWave cseréje ActiveStorage-ra

tehát, mivel az alkalmazás most a Rails 5.2-en fut, elkezdhettem a CarrierWave cseréjét ActiveStorage-ra.

az ActiveStorage esetén szükségtelen modellspecifikus attribútumokat hozzáadni a CarrierWave-hez szükséges mellékletfájlnevek tárolásához. Az ActiveStorage ugyanazzal a két társított táblával működik az összes melléklethez.

a két tábla beállításához a bin/bundle exec rails active_storage:installparancsot futtattam, majd a rails db:migrate parancsot. A két tábla active_storage_blobs és active_storage_attachments; az első a csatolt fájl részleteit tartalmazza, a második pedig a polimorf illesztési táblázatot, amely a csatolt fájlt egy modellrekordhoz kapcsolja.

és itt van a fontos pont: miután létrehoztuk ezt a két táblát, nem kell más migrációt létrehoznunk ahhoz, hogy a mellékleteket belefoglaljuk a modellekbe! Ez teszi ActiveStorage könnyű dolgozni egy adatbázis szempontjából.

ezután megvizsgáltam a :avatar melléklet implementációjának cseréjét ActiveStorage-ra a CarrierWave helyett. Az én app, minden User van egy :avatar. Mivel korábban a CarrierWave-et használtam, egy :avatar attribútumot csatoltam a CarrierWave Uploader – hez a User modellben, így deklarálva:

class User < ApplicationRecord
# ... various codez mount_uploader :avatar, AvatarUploader # ... other codez
end

a CarrierWave :avatar mellékletet ActiveSupport Mellékletre lehet cserélni a has_one_attached :avatar használatával, így:

class User < ApplicationRecord
# ... various codez # commented old uploader for reference
# mount_uploader :avatar, AvatarUploader
has_one_attached :avatar # ... other codez
end

ez egy kódsor megváltoztatása. Ezen a ponton mit kell még tenni? Például hogyan van beállítva a feltöltési tárolási hely? Ne feledje, hogy az alkalmazásomban a CarrierWave avatar feltöltő az alapértelmezett egyszerű fájltárolóval van beállítva, ennek helyét pedig kifejezetten a avatar_uploader.rb fájl határozza meg. Az egyszerű Fájltárolás az alapértelmezett az ActiveStorage-ban is. A hely a config/storage.yml fájlban van beállítva, a helyi feltöltések alapértelmezett értékével.

az activestorage alapértelmezett konfigurációja azt jelenti, hogy nem kell több kódot írnom a feltöltéseimhez, hogy az alkalmazásomban a módosított :avatar attribútum működjön. Teljesen megváltoztattam a feltöltési mechanizmust a CarrierWave-ről az ActiveStorage-ra, és nem kell többet tennem: Nem kell változtatnom a feltöltést kezelő vezérlőn, mert a :avatar már erős paraméterként van deklarálva. Nem kell megváltoztatnom a fájl űrlap mezőjét abban a nézetben, amely lehetővé teszi a felhasználók számára, hogy kiválasszanak egy feltöltendő képet, mert ezt a :avatar “attribútum”támogatja.

de van még egy változtatás, amelyet el kell végeznem a CarrierWave-ről az ActiveStorage-ra való áttéréshez, vagyis a csatolt kép nézetekben történő használatához. A CarierWave segítségével a avatar_url metódust használtam a teljes kép elérési útjának megjelenítéséhez. ActiveStorage esetén a fájl URL-címe nem a melléklet attribútumából, hanem az attribútum átadásával jelenik meg segítő módszerek. Tehát a teljes melléklet URL-je a url_for(user.avatar) vagy közvetlenül a image_taghasználatával jeleníthető meg.

azt is kifejezetten ellenőrizni kell, hogy a melléklet jelen van-e, így a nézet teljes használata így néz ki:

<% if current_user.avatar.attached? %>
<%= image_tag current_user.avatar, class: 'avatar' %>
<% else %>
<%= image_tag 'default-avatar', class: 'avatar' %>
<% end %>

miután frissítettem a user.avatar_url hivatkozásokat a nézeteimben a fenti részletekkel, teljesen átköltöztem a CarrierWave-ről az ActiveStorage-ra az összes új feltöltéshez.

a régi CarrierWave kódot rendbe kell hozni, és felmerül a kérdés, hogy mi legyen a meglévő feltöltésekkel, amelyeket a CarrierWave-vel végeztek. De lásd alább erről…

bonyolultabb forgatókönyvek

szinte minden gyártási forgatókönyv összetettebb lesz, mint a fent vázolt. Figyelembe kell venni olyan dolgokat, mint például a CDN-Eken vagy távoli szervereken tárolt feltöltések, például az AWS S3, valamint a miniatűrök átméretezése stb. Az ActiveStorage lehetővé teszi számunkra, hogy ezeket a dolgokat a dobozból is elvégezzük, és úgy tűnik, hogy nagyon jól tervezték a fejlesztők igényeit. Ahogy várható volt, jó dokumentáció található a sínek útmutatójában.

ami a meglévő feltöltések CarrierWave-ről ActiveStorage-ra történő áttelepítését illeti, ez minden bizonnyal lehetséges lenne egy viszonylag kis rake szkript segítségével. Arra fogok törekedni, hogy ezt egy jövőbeli posztban lefedjem.

ez egy egyszerű forgatókönyv volt, de összességében nagyon elégedett voltam az ActiveStorage használatával és a CarrierWave cseréjével. Tetszik az a gondolat is, amely az ActiveStorage különböző részeibe került, mivel úgy tűnik, hogy minden olyan fájlokban és mappákban van, amelyek szépen illeszkednek a Rails többi részéhez. Határozottan úgy gondolom, hogy érdemes bejutni a Rails 5.2-be annak érdekében, hogy az ActiveStorage fájlt feltölthessen az Ön alkalmazásaiban!

Tudjon meg többet!

szeretne többet megtudni a Ruby-ról és a Ruby on Rails-ről? Webalkalmazás-fejlesztést tanítok az EPFL Extension School-ban, egy tanúsított online tanulási platformon, amely digitális készségeket tanít az adattudományban, a webes alkalmazások fejlesztésében és így tovább. Az EPFL a világ egyik vezető egyeteme, és a Times Higher Education rangsorában az “1.számú fiatal Egyetem”.



+