Comment collecter tous les actifs statiques (js, css) utilisés par Discourse

Soutien
1

Je tente de configurer un CDN pour mon forum. Depuis que la Chine a interdit Fastly ainsi que de nombreux serveurs CDN, je ne peux plus les utiliser pour accélérer mon forum. Après quelques recherches, je me tourne vers jsDelivr, qui peut servir des fichiers statiques depuis npm ou un dépôt GitHub.

Je sais que je peux utiliser la variable DISCOURSE_CDN_URL dans app.yml pour configurer l’URL. Mais avant cela, je dois rassembler tous les fichiers statiques (JS, CSS) de mon forum, puis les télécharger sur GitHub afin que jsDelivr puisse y accéder. J’ai découvert que ces fichiers statiques se trouvent en réalité à l’intérieur du conteneur Docker :

/var/www/discourse/app/assets

Je pense donc à copier tous les fichiers de ce chemin à chaque fois que je reconstruis l’application, puis à les télécharger sur GitHub. Je suppose que cette idée devrait fonctionner, mais la requête réelle contient un nom de fichier avec un long hachage que je ne sais pas comment obtenir. Par exemple :

ember_jquery.js devient
ember_jquery-8ef4e572f0bf9485e6ef9a35f088729735f82434cf495fbcd5acedefbcddb363.js

Ma question est donc :

  1. Comment générer le nom de fichier avec le hachage ?
  2. Existe-t-il une autre méthode pour rassembler les ressources statiques ?
2

Il s’agit d’un hachage SHA1 du contenu du fichier. Il est généré ici :

Les versions compilées utilisées sont placées dans /var/www/discourse/public/assets/.

Si vous ajoutez une section à votre fichier app.yml, vous pouvez exécuter une action après la reconstruction du conteneur. Par exemple, pour télécharger sur S3, nous utilisons quelque chose de similaire à :

hooks:
  after_assets_precompile:
    - exec:
        cd: $home
        cmd:
          - sudo -E -u discourse bundle exec rake s3:upload_assets

Dans votre cas, remplacez la tâche rake par les commandes que vous exécutez pour pousser les assets compilés vers GitHub lors de la construction du conteneur.

3

Merci @schleifer. Votre réponse est très utile. Cependant, j’ai encore quelques questions de suivi :

  1. Où puis-je trouver la documentation pour les hooks comme after_assets_precompile ? J’ai cherché dans la documentation Docker ainsi que dans le dépôt GitHub de Discourse, mais je n’ai trouvé aucune information à ce sujet. Dois-je configurer moi-même les hooks nommés after_assets_precompile (comment faire ?) ou sont-ils déjà configurés par Discourse, comme after_code ?

  2. Si je comprends bien, mon pseudo-code ressemblerait à :

     hooks:
   after_assets_precompile:
     - exec:
         cd: $home
         cmd:
           - entrer dans le conteneur Docker
           - se rendre dans `/var/www/discourse/public/assets/`
           - exécuter git add, commit et push vers le dépôt GitHub

Merci.

4

C’est une bonne question, mais je n’ai pas de réponse satisfaisante à vous donner.

Le système de configuration utilisé à l’intérieur du conteneur est :

Le README explique généralement comment fonctionnent les hooks. Les hooks spécifiques disponibles dépendent de la configuration de votre instance — le fichier principal app.yml inclut un ou plusieurs modèles. Dans la plupart des cas, l’un d’eux est web.template.yml :

C’est là que le hook assets_precompile est défini (à la [L159] au moment où j’écris ces lignes). Selon la documentation de Pups, vous pouvez exécuter d’autres commandes avant ou après son exécution en utilisant respectivement before_assets_precompile et after_assets_precompile.

Les commandes sont exécutées à l’intérieur du conteneur Docker, donc vous n’avez rien à faire de ce côté-là.

La directive cd: peut pointer directement vers /var/www/discourse/public/assets/, et chaque ligne dans cmd est exécutée depuis ce répertoire. (Attention : chaque ligne d’un tableau cmd est exécutée dans un shell distinct, comme dans un Makefile).

Je ne sais pas si le contenu de /var/www/discourse/public/assets/ sera conservé entre les builds, il se peut donc que vous deviez créer le dépôt Git local et forcer le push à chaque fois. La solution « plus correcte » pourrait consister à définir un volume Docker dans app.yml pour le répertoire des assets sur un volume Docker défini dans app.yml comme les autres et le persister en dehors du conteneur.

5

Merci beaucoup. J’ai également constaté que certains assets statiques (comme les CSS) sont placés dans /var/www/discourse/tmp/stylesheet-cache. Mais il y a deux autres problèmes :

  1. Les utilisateurs téléversent des assets comme des avatars, qui sont ensuite servis par le CDN après avoir configuré DISCOURSE_CDN_URL. Cependant, pousser les assets téléversés vers GitHub à chaque fois qu’un utilisateur effectue un téléversement ne semble pas être une bonne solution.
  2. Lorsque Discourse demande un avatar utilisateur comme 2_2.png, il : 1) divise le nom de fichier, 2) effectue certaines vérifications, 3) calcule le vrai nom de fichier en utilisant un hachage. Si je dois servir les avatars utilisateurs, je dois implémenter moi-même la même logique, car il n’existe aucun fichier nommé 2_2.png.

Ma solution finale est simple. 1) J’ajoute Nginx devant mon forum, comme dans ce post. 2) Je collecte tous les assets statiques depuis le chemin ci-dessus et je les pousse vers GitHub. 3) Dans le fichier de configuration de Nginx, j’ajoute des règles comme :

location ~/(stylesheets|assets) {
    return 301 https://cdn.jsdelivr.net/gh/my_github/my_repo/$request_uri;
}

Merci encore @schleifer