Gestion des fichiers sons via Soundcloud

Il est aujourd’hui possible de partager des sons sur le web et l’un des services les plus connus pour cela est sans doute SoundCloud. Il peut donc s’avérer utile, dans certains cas, de l’intégrer dans votre application Rails.

Il existe différentes possibilités afin de gérer vos fichiers sons avec SoundCloud, la plus simple étant le simple affichage du player depuis le code HTML fourni par SoundCloud et la plus complexe l’upload du fichier depuis votre site ou application vers SoundCloud.

Player SoundCloud

L’usage principal que vous allez avoir à gérer est bien sûr l’affichage du player SoundCloud sur votre site afin que l’utilisateur puisse écouter le son souhaité. Pour cela, il vous est possible d’opérer de différentes manières.

iFrame

Le plus simple consiste à insérer dans votre page le code fourni par SoundCloud lorsque vous souhaitez partager un son mais il n’y a pas vraiment d’intérêt particulier à utiliser Rails dans ce cas.

= iframe{ width:"100%", height: "166", scrolling: "no", frameborder: "0", src: "http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F65340507&show_artwork=true" }

Vous obtenez donc le player suivant :

Gem ‘Soundcloud’

Il existe une gem soundcloud qu’il est possible d’ajouter à votre application Rails via la ligne suivante :

gem 'soundcloud'

Un bundle install suffit ensuite à rendre cette dernière active. Il est également nécessaire, pour utiliser l’API SoundCloud et donc la gem, d’enregistrer votre application sur le site via l’url suivante : http://soundcloud.com/you/apps (un client id et un client secret vous seront donnés).

Ensuite, rien de plus simple pour utiliser le player. Il faut initialiser le client puis lui fournir l’url du son souhaité, par exemple dans votre controller :

class PagesController < ApplicationController
  def soundcloud
    client      = Soundcloud.new(:client_id => 'MY_APP_ID')
    sound_url   = 'http://soundcloud.com/alex_salaun/test-soundcloud-upload'
    @embed_info = client.get('/oembed', :url => sound_url)
  end
end

Plutôt que de mettre l’ID de votre application sur SoundCloud directement dans le controller, il est plutôt conseillé de créer un fichier YAML pour stocker ces données (de plus cela vous permettra de gérer les différents environnements).

Dans votre vue, il ne vous reste plus qu’à afficher le player et le tour est joué :

<%= @embed_info['html'].html_safe %>

Nous avons donc vu deux méthodes qui permettent d’utiliser le player SoundCloud pour jouer les sons présents sur ce site, l’une oblige à passer par ce dernier pour récupérer le code HTML, la seconde ne requiert que l’URL.

Uploader un son

Il est possible, depuis votre site ou application, d’uploader des fichiers sons sur Soundcloud pour pouvoir les réutiliser par la suite avec le player.

Afin de permettre l’upload, la gem soundcloud est également nécessaire. Il faut aussi que l’utilisateur possède un compte sur ce site afin de pouvoir s’identifier et autoriser votre application à accéder à son compte. De plus, il vous faut les client id et client secret de votre application sur SoundCloud et vous devez renseigner l’url de retour sur la page de votre application sur SoundCloud (si elle n’est pas indiquée la connexion ne se fera pas).

Afin de sauvegarder les sons dans notres applications nous allons donc créer un model Sound qui ne contiendra que deux champs : name et url. Le premier sera le nom donné au son en question et le second sera l’url sur SoundCloud.

# Migration
class CreateTableSounds < ActiveRecord::Migration
  def change
    create_table :sounds do |t|
      t.string :name
      t.string :url

      t.timestamps
    end
  end
end

# Model
class Sound < ActiveRecord::Base
  attr_accessible :name, :url
end

Vous pouvez par la suite ajouter des validations si besoin.

Ensuite, il vous faut ajouter un controller qui traitera la partie connexion avec SoundCloud :

class SoundcloudController < ApplicationController
  def connect
    redirect_to soundcloud_client.authorize_url
  end

  def connected
    if params[:error].nil?
      soundcloud_client.exchange_token(:code => params[:code])
      session[:soundcloud_token] = soundcloud_client.access_token
      # me = soundcloud_client.get("/me")
      # me contains user infos like username

      redirect_to new_sound_path
    else
      render :text => params[:error] and return
    end
  end

private
  def soundcloud_client
    return @soundcloud_client if @soundcloud_client

    options = {
      :client_id     => 'MY_APP_ID',
      :client_secret => 'MY_APP_SECRET',
      :redirect_uri  => soundcloud_connected_url
    }

    @soundcloud_client = Soundcloud.new(options)
  end
end

Ceci va vous permettre de générer un lien vers une page de connexion à SoundCloud afin de récupérer un token qui servira ensuite pour pouvoir uploader le fichier.

Des routes sont nécessaires afin d’accèder aux pages :

match '/soundcloud/connect',   :to => 'soundcloud#connect',   :as => :soundcloud_connect
match '/soundcloud/connected', :to => 'soundcloud#connected', :as => :soundcloud_connected

soundcloud_connected_url est l’URL de retour de SoundCloud (celle qui a été indiquée sur le site dans le champ “Redirect URI for Authentication”).

Nous avons donc maintenant le processus de connexion avec Soundcloud, nous pouvons créer un formulaire pour uploader le fichier son. Il faut pour cela ajouter un controller et la vue du formulaire :

class SoundsController < ApplicationController
  def new
    @sound = Sound.new
  end
end

<%= form_for @sound, html: { multipart: true } do |f| %>
  <%= f.label :name %>
  <%= f.text_field :name %>

  <%= label :file, "My file" %>
  <%= file_field_tag :file %>

  <%= f.submit %>
<% end %>

Nous avons donc un champ pour l’attribut name du model Sound ainsi qu’un champ pour le fichier à uploader. Afin de gérer l’upload et la création de l’objet, nous allons ajouter une action create au controller :

class SoundsController < ApplicationController
  …

  def create
    client = Soundcloud.new(:access_token => session[:soundcloud_token])
    name   = params[:sound][:name] # get form name for sound's title

    # upload an audio file
    track = client.post('/tracks', :track => {
      :title      => name,
      :asset_data => params[:file].tempfile
    })

    @sound = Sound.create({ name: name, url: track.permalink_url })

    redirect_to sounds_path
  end
end

Pour uploader un fichier sur SoundCloud, il suffit d’initialiser un nouveau client avec le token récupéré lors de la connexion de l’utilisateur et d’appeler la méthode post sur ce client avec en paramètre le fichier et un titre. Cette méthode retourne différentes informations dont le permalink_url du son uploadé. Il ne reste donc plus qu’à créer un objet Sound avec le nom et ce permalink comme url.

Pour finir, vous pouvez ajouter une action index qui listera tous les sons avec le nom et le player pour chacun d’eux :

class SoundsController < ApplicationController
  def index
    @sounds            = Sound.all
    @soundcloud_client = Soundcloud.new(:client_id => 'a416f0865333d0a415bcec7e578b91c5')
  end

  …
end

Et dans la vue correspondante :

<% @sounds.each do |sound| %>
  <% player = @soundcloud_client.get('/oembed', :url => sound.url) %>
  <%= sound.name %>
  <%= player['html'].html_safe %>

Conclusion

À travers cet article nous avons donc vu comment afficher sur votre site le player SoundCloud afin de pouvoir jouer les sons et également comment uploader directement ces derniers sur SoundCloud directement depuis votre application Rails.

Tout cela se fait de façon très simple via la gem soundcloud. De plus, la documentation de l’API est complète et des exemples sont disponibles dans différents langages. En effet, il est également possible, en plus de l’upload et du player, de s’authentifier via Soundcloud par exemple.

Maintenant que vous avez vu comment fonctionnait l’API SoundCloud, ne vous embêtez plus à stocker les fichiers sons sur votre serveur, utilisez directement ce service.

Pour celles et ceux qui voudraient ajouter sur SoundCloud des fichiers musicaux d’artistes reconnus, inutile de perdre du temps. En effet, SoundCloud détecte les fichiers musicaux qui nécessitent des droits et un mail vous est automatiquement envoyé pour vous informer que vous n’avez pas les autorisations requises.

L’équipe Synbioz.

Libres d’être ensemble.