Como veicular arquivos estáticos

Muitas vezes, os aplicativos precisam disponibilizar arquivos estáticos, como JavaScript, imagens e CSS, além de manipular solicitações dinâmicas. Os aplicativos no ambiente flexível podem exibir arquivos estáticos de uma opção do Google Cloud, como o Cloud Storage, exibi-los diretamente ou usar uma rede de fornecimento de conteúdo (CDN) de terceiros.

Como exibir arquivos do Cloud Storage

O Cloud Storage pode hospedar recursos estáticos de aplicativos dinâmicos da Web. Estes são os benefícios de usar o Cloud Storage em vez de disponibilizar diretamente no aplicativo:

  • O Cloud Storage funciona basicamente como uma rede de fornecimento de conteúdo. Por padrão, qualquer objeto publicamente legível é armazenado em cache na rede global do Cloud Storage. Por isso, não é preciso fazer nenhuma configuração especial.
  • A carga do aplicativo é reduzida ao descarregar os recursos estáticos em disponibilização no Cloud Storage. Dependendo de quantos você tiver e da frequência de acesso, isso reduz bastante o custo de execução do aplicativo.
  • As tarifas de largura de banda para acessar conteúdo costumam ser menores com o Cloud Storage.

É possível fazer upload dos recursos para o Cloud Storage usando a ferramenta de linha de comando gsutil ou a API Cloud Storage.

A biblioteca de cliente do Google Cloud fornece um cliente idiomático Ruby ao Cloud Storage, para armazenar e recuperar dados com o Cloud Storage em um aplicativo do App Engine.

Exemplo de exibição em um bucket do Cloud Storage

Este exemplo simples cria um bucket do Cloud Storage e faz upload de recursos estáticos usando a Google Cloud CLI:

  1. Crie um bucket. É comum dar o nome do ID do projeto ao bucket, mas isso não é obrigatório. O nome dele precisa ser exclusivo.

    gsutil mb gs://<your-bucket-name>

  2. Configure a ACL para conceder acesso de leitura aos itens no bucket.

    gsutil defacl set public-read gs://<your-bucket-name>

  3. Faça o upload dos itens para o bucket. Geralmente, o comando rsync é o jeito mais rápido e fácil de fazer upload e atualizar recursos. Também é possível usar o cp.

    gsutil -m rsync -r ./static gs://<your-bucket-name>/static

Agora é possível acessar os recursos estáticos via https://storage.googleapis.com/<your-bucket-name>/static/....

Para saber mais sobre como usar o Cloud Storage para disponibilizar recursos estáticos, incluindo a disponibilização a partir de um nome de domínio personalizado, consulte Como hospedar um site estático.

Como exibir arquivos de outros serviços do Google Cloud

Você também tem a opção de usar o Cloud CDN ou outros serviços de armazenamento do Google Cloud.

Como exibir arquivos diretamente do aplicativo

Normalmente, a exibição de arquivos do aplicativo é simples. No entanto, lembre-se destas desvantagens:

  • É possível que as solicitações de arquivos estáticos utilizem recursos aplicados em solicitações dinâmicas.
  • Dependendo da sua configuração, a disponibilização de arquivos do seu aplicativo pode resultar em um aumento na latência de resposta. Isso também poderá acontecer quando novas instâncias forem criadas para processar o carregamento.

Exemplo de exibição de arquivos estáticos com o aplicativo

A maioria das bibliotecas da Web permite a disponibilização de arquivos estáticos.

Sinatra

Por padrão, o framework da Web Sinatra (em inglês) exibe arquivos do diretório ./public. Este aplicativo inclui uma visualização que se refere a /application.css.

appengine/static_files/sinatra/views/index.slim 
doctype html
html
  head
    title Serving Static Files
    link rel="stylesheet" href="/application.css"
    script src="/application.js"
  body
    p This is a static file serving example.

A folha de estilo está localizada em ./public/application.css, que é exibida por /application.css.

appengine/static_files/sinatra/public/application.css 
body {
  font-family: Verdana, Helvetica, sans-serif;
  background-color: #CCCCFF;
}

Ruby on Rails

Por padrão, o framework da Web Ruby on Rails (em inglês) exibe arquivos do diretório ./public. O pipeline de recursos (em inglês) do Rails também gera arquivos estáticos JavaScript e CSS.

Esse app de exemplo tem uma visualização de layout que inclui todas as folhas de estilo do app:

appengine/static_files/rails/app/views/layouts/application.html.slim 
doctype html
html
  head
    title Serving Static Files
    = stylesheet_link_tag "application", media: "all"
    = javascript_include_tag "application"
    = csrf_meta_tags
  body
    = yield

A própria folha de estilo é um arquivo Sass (em inglês) localizado em ./app/assets/stylesheets/main.css.sass.

appengine/static_files/rails/app/assets/stylesheets/main.css.sass 
body
  font-family: Verdana, Helvetica, sans-serif
  background-color: #CCCCFF

Por padrão, os apps Rails não geram nem exibem recursos estáticos quando são executados em produção.

O ambiente de execução do Ruby executa rake assets:precompile durante a implantação para gerar recursos estáticos e define a variável de ambiente RAILS_SERVE_STATIC_FILES para ativar a exibição de arquivos estáticos em produção.

Como disponibilizar a partir de uma rede de fornecimento de conteúdo de terceiros

Você pode usar qualquer CDN externa de terceiros para exibir seus arquivos estáticos e armazenar solicitações dinâmicas em cache, mas seu aplicativo poderá ter aumento de latência e custo.

Para melhorar o desempenho, use uma CDN de terceiros compatível com o CDN Interconnect.