[Rails] Fonction de publication vocale ~ Cloudinary, CarrierWave
introduction
Cet article implémente la fonction de publication de fichier audio.
Utilisez Cloudinary (stockage externe). Vous pouvez utiliser jusqu'à 1 Go par mois avec un plan gratuit.
supposition
Dans le modèle Tweet, la fonction de publication de texte est terminée.
Première, ...
Enregistrez votre compte avec Cloudinary! N'oubliez pas de vous inscrire à l'annonce!
https://cloudinary.com/
Après avoir acquis le compte ci-dessus, veuillez commencer le travail suivant!
Ajouter une colonne audio
Ajoutez une colonne audio de type string à la table des tweets.
Terminal
$ rails generate migration AddAudioToTweets audio:string
Terminal
$ rails db:migrate
L'URL (adresse) du fichier audio est écrite dans cette colonne audio. Le fichier audio lui-même est enregistré dans un emplacement différent.
Index.html.erb
Écrivez le code pour lire le fichier audio
erb:app/views/tweets/index.html.erb
<% @tweets.each do |t| %>
<%= audio_tag t.audio_url, :controls => true if t.audio? %>
<% end %>
controls =>true affiche le panneau du contrôleur.
De plus, audio_tag propose les options suivantes.
``: autoplay`` Autoplay
``: loop`` Lecture en boucle
### Paramètres forts
Décrivez dans le paramètre fort pour que le paramètre audio puisse être reçu.
#### **`tweets_controller.rb`**
```ruby
#Omis
private
def tweet_params
params.require(:tweet).permit(:body, :audio)
end
new.html.erb
Écrivez le code pour télécharger le fichier.
erb:app/views/tweets/new.html.erb
<%= form_for @tweet do |f| %>
<div class="field">
<%= f.label :audio %>
<%= f.file_field :audio %>
</div>
<%= f.submit "Tweet" %>
<% end %>
Ajouter un bijou
Cette fois, nous utiliserons cloudinary et une gemme appelée carrierwave. Ajoutez ce qui suit au bas de votre Gemfile:
Gemfile
gem 'carrierwave'
gem 'cloudinary'
Terminal
$ bundle install
Pour expliquer brièvement chaque bijou carrierwave: un bijou qui vous permet de télécharger des fichiers avec des rails cloudinary: gem pour rendre le cloudinary du service de stockage externe disponible
Créer un uploader
Créez un uploader avec le générateur CarrierWave. Tapez la commande suivante dans le terminal.
Terminal
$ rails g uploader Audio
Modification du modèle
Modifiez app / models / tweet.rb comme suit.
app/models/tweet.rb
class Tweet < ApplicationRecord
#Post-scriptum d'ici
mount_uploader :audio, AudioUploader
#Postscript jusqu'à ici
end
audio,Audio Uploader signifie enregistrer le fichier audio à l'emplacement spécifié.
Viennent ensuite les paramètres de téléchargement qui spécifient l'emplacement d'enregistrement.
Modifions les 6e à 8e lignes de app / uploaders / image_uploader.rb.
#### **`app/uploaders/audio_uploader.rb`**
```ruby
# Choose what kind of storage to use for this uploader:
storage :file
# storage :fog
Modifiez ce qui précède comme indiqué dans la figure ci-dessous.
app/uploader/audio_uploader.rb
# Choose what kind of storage to use for this uploader:
if Rails.env.production?
include Cloudinary::CarrierWave
CarrierWave.configure do |config|
config.cache_storage = :file
end
else
storage :file
end
# storage :fog
cloudinary est un service de stockage externe. Dans l'environnement de production (après release = production), l'image est enregistrée dans cloudinary, et dans d'autres cas (environnement de développement = local), elle est enregistrée dans votre propre PC. (Enregistré dans un dossier public)
Clé API privée
Chaque compte Cloudinary reçoit un «nom de cloud», une «clé API» et un «secret API».
Renforcez la sécurité pour empêcher la fuite du compte Cloudinary vers l'extérieur.
Ici, nous utiliserons une gemme appelée dotenv-rails. Ajoutez ce qui suit au bas de votre Gemfile:
Gemfile
gem 'dotenv-rails'
Terminal
$ bundle install
À installer.
Créez ensuite vous-même un fichier appelé .env dans le répertoire ** de l'application (le répertoire où se trouvent app, db et Gemfile) **.
Si cela ressemble à la figure ci-dessous, ça va.
- Veuillez noter qu'il ne se trouve pas dans le dossier du fournisseur.
Entrez ensuite ce qui suit dans le fichier .env que vous avez créé.
.env
CLOUD_NAME=q0w9e8r7t6yu5 #← Cette valeur varie d'une personne à l'autre! !!
CLOUDINARY_API_KEY=123456789012345 #← Cette valeur varie d'une personne à l'autre! !!
CLOUDINARY_API_SECRET=1a2s3d4f5g6h7j8k9l0a1s2d4f5g6h1q #← Cette valeur varie d'une personne à l'autre! !!
Ici, réécrivez chaque valeur après "=" avec la clé obtenue dans Cloudinary My Page (la clé que vous avez obtenue est absolument autre). Ne le dites pas !! De plus, les chiffres varient d'une personne à l'autre) De plus, lors de la réécriture, ** supprimez la partie commentée **!
Enfin, ne publiez pas le fichier .env qui définit les données que vous souhaitez masquer.
Ajoutez ce qui suit à .gitignore.
** * Si le fichier .gitignore n'existe pas, créez-le dans le répertoire de l'application! ** </ font>
.gitignore
#réduction
/.env
C'est acceptable!
Utilisation de la clé API
C'est la dernière étape! Commencez par créer un fichier cloudinary.yml dans le dossier config.
Copiez-le et collez-le simplement dans config / cloudinary.yml comme suit.
config/cloudinary.yml
development:
cloud_name: <%= ENV['CLOUD_NAME'] %>
api_key: <%= ENV['CLOUDINARY_API_KEY'] %>
api_secret: <%= ENV['CLOUDINARY_API_SECRET'] %>
enhance_image_tag: true
static_file_support: false
production:
cloud_name: <%= ENV['CLOUD_NAME'] %>
api_key: <%= ENV['CLOUDINARY_API_KEY'] %>
api_secret: <%= ENV['CLOUDINARY_API_SECRET'] %>
enhance_image_tag: true
static_file_support: false
test:
cloud_name: <%= ENV['CLOUD_NAME'] %>
api_key: <%= ENV['CLOUDINARY_API_KEY'] %>
api_secret: <%= ENV['CLOUDINARY_API_SECRET'] %>
enhance_image_tag: true
static_file_support: false
Vous pouvez désormais utiliser la clé API tout en la gardant privée.
Vous pouvez maintenant publier des fichiers audio. Merci pour votre travail acharné (^^) /
Documentation officielle
carrierwave cloudinary dotenv-rails
Recommended Posts