# Como coletar todos os ativos estáticos (js, css) usados pelo Discourse
**URL:** https://meta.discourse.org/t/how-to-collect-all-static-assets-js-css-used-by-discourse/149319
**Category:** Support
**Created:** [26 Abril , 2020 08:09 UTC](https://meta.discourse.org/t/how-to-collect-all-static-assets-js-css-used-by-discourse/149319 "2020-04-26T08:09:29Z")
**Posts on this page:** 6
**Page:** 1
### Author:  [@Windsooon](https://meta.discourse.org/u/Windsooon)
#### Post date: [26 Abril , 2020 08:09 UTC](https://meta.discourse.org/t/how-to-collect-all-static-assets-js-css-used-by-discourse/149319/1 "2020-04-26T08:09:29Z")
Estou tentando configurar um CDN para meu fórum. Como a China baniu o [Fastly](http://www.fastly.com/) e muitos servidores de CDN, não posso usá-los para acelerar meu fórum. Após fazer algumas pesquisas, voltei-me para o Jsdelivr, que pode servir arquivos estáticos do npm ou de repositórios do Github.
Sei que posso usar DISCOURSE\_CDN\_URL no app.yml para configurar a URL. Mas antes disso, preciso coletar todos os arquivos estáticos (js, CSS) do meu fórum e enviá-los para o Github, para que o Jsdelivr possa acessá-los. Descobri que os arquivos estáticos estão localizados dentro do container Docker:
`/var/www/discourse/app/assets`
Então estou pensando em copiar todos os arquivos desse caminho sempre que reconstruir o app e depois enviá-los para o Github. Acho que essa ideia deve funcionar, mas a solicitação real contém um nome de hash longo que não sei como obter. Por exemplo:
ember\_jquery.js se torna
ember\_jquery-8ef4e572f0bf9485e6ef9a35f088729735f82434cf495fbcd5acedefbcddb363.js
Minha pergunta é:
1. Como gerar o nome do arquivo com hash?
2. Existe outra maneira de coletar os arquivos estáticos?
---
### Author:  [@schleifer](https://meta.discourse.org/u/schleifer)
#### Post date: [27 Abril , 2020 02:53 UTC](https://meta.discourse.org/t/how-to-collect-all-static-assets-js-css-used-by-discourse/149319/2 "2020-04-27T02:53:42Z")
> [@Windsooon](#):
>
> Como gerar o nome do arquivo hash
É um hash SHA1 do conteúdo do arquivo. Ele é gerado aqui:
>
As versões compiladas que são utilizadas são colocadas em `/var/www/discourse/public/assets/`.
> [@Windsooon](#):
>
> Alguma outra maneira de coletar os ativos estáticos
Se você adicionar um bloco ao seu `app.yml`, poderá executar uma ação após a reconstrução do contêiner. Por exemplo, para fazer upload para o S3, usamos algo semelhante a:
```plaintext
hooks:
after_assets_precompile:
- exec:
cd: $home
cmd:
- sudo -E -u discourse bundle exec rake s3:upload_assets
```
No seu caso, substitua a tarefa rake pelos comandos que você executa para enviar os ativos compilados para o GitHub quando o contêiner for construído.
---
### Author:  [@Windsooon](https://meta.discourse.org/u/Windsooon)
#### Post date: [27 Abril , 2020 04:09 UTC](https://meta.discourse.org/t/how-to-collect-all-static-assets-js-css-used-by-discourse/149319/3 "2020-04-27T04:09:27Z")
Obrigado, @schleifer. Sua resposta foi muito útil. No entanto, ainda tenho algumas perguntas de acompanhamento:
1. Onde posso encontrar a documentação para hooks como `after_assets_precompile`? Pesquisei na documentação do Docker e também no repositório do Discourse no GitHub, mas não encontrei nenhuma informação sobre isso. Preciso configurar os hooks chamados `after_assets_precompile` eu mesmo (como fazer isso?) ou eles já estão configurados pelo Discourse, como o `after_code`?
2. Pelo que entendi, meu pseudocódigo ficaria assim:
Obrigado.
---
### Author:  [@schleifer](https://meta.discourse.org/u/schleifer)
#### Post date: [27 Abril , 2020 12:18 UTC](https://meta.discourse.org/t/how-to-collect-all-static-assets-js-css-used-by-discourse/149319/4 "2020-04-27T12:18:58Z")
> [@Windsooon](#):
>
> Onde posso encontrar a documentação para hooks como `after_assets_precompile`?
Essa é uma boa pergunta, mas não tenho uma resposta ideal para você.
O sistema de configuração usado dentro do container é:
> **[GitHub - discourse/pups: Simple yaml based bootstrapper for Linux machines](https://github.com/discourse/pups)**
>
> Simple yaml based bootstrapper for Linux machines
O README lá descreve como os hooks funcionam de forma geral. Os hooks específicos disponíveis dependem de como sua instância está configurada — o arquivo principal `app.yml` inclui um ou mais templates. Na maioria dos casos, um deles é o `web.template.yml`:
>
É ali que o hook `assets_precompile` está definido (na [L159] enquanto escrevo). Conforme a documentação do pups, você pode executar outros comandos antes ou depois que ele termine, usando `before_assets_precompile` e `after_assets_precompile`, respectivamente.
> [@Windsooon](#):
>
> O pseudocódigo seria algo como
Os comandos são executados dentro do container Docker, então você não precisa fazer nada para isso.
A diretiva `cd:` pode apontar diretamente para `/var/www/discourse/public/assets/`, e cada linha em `cmd` é executada a partir desse diretório. (Aviso: cada linha de um array `cmd` é executada em um shell separado, como em um Makefile).
Não tenho certeza se o conteúdo de `/var/www/discourse/public/assets/` persiste entre builds, então talvez você precise criar o repositório git local e fazer um force push toda vez. A solução “mais correta” pode ser definir um volume Docker em `app.yml` para o diretório de assets em um volume Docker definido em `app.yml` [como os outros](https://github.com/discourse/discourse_docker/blob/master/samples/standalone.yml#L76) e persistir fora do container.
---
### Author:  [@Windsooon](https://meta.discourse.org/u/Windsooon)
#### Post date: [29 Abril , 2020 06:33 UTC](https://meta.discourse.org/t/how-to-collect-all-static-assets-js-css-used-by-discourse/149319/5 "2020-04-29T06:33:18Z")
Muito obrigado. Também descobri que alguns ativos estáticos (como CSS) são armazenados em `/var/www/discourse/tmp/stylesheet-cache`. No entanto, há dois outros problemas:
1. Os usuários fazem upload de ativos, como avatares, que também são servidos pela CDN após configurar o DISCOURSE\_CDN\_URL. No entanto, enviar os ativos de upload para o GitHub sempre que um usuário fizer um upload não parece ser uma solução ideal.
2. Quando o Discourse solicita um avatar de usuário, como `2_2.png`, ele: 1) divide o nome do arquivo, 2) realiza algumas verificações e 3) calcula o nome real do arquivo usando hash. Se eu precisar servir o avatar do usuário, terei que implementar a mesma lógica, já que não existe um arquivo chamado `2_2.png`.
Minha solução final é simples. 1) Adicionei o Nginx antes do meu fórum, como [nesta postagem](https://meta.discourse.org/t/running-other-websites-on-the-same-machine-as-discourse/17247). 2) Coletar todos os ativos estáticos do caminho acima e enviá-los para o GitHub. 3) No arquivo de configuração do Nginx, adicionei algumas regras como:
```
location ~/(stylesheets|assets) {
return 301 https://cdn.jsdelivr.net/gh/my_github/my_repo/$request_uri;
}
```
Obrigado novamente, @schleifer
---
### Author:  [@system](https://meta.discourse.org/u/system)
#### Post date: [18 Junho , 2024 15:13 UTC](https://meta.discourse.org/t/how-to-collect-all-static-assets-js-css-used-by-discourse/149319/6 "2024-06-18T15:13:06Z")