Arquivos Estáticos Flask
O foco deste artigo é explicar o mecanismo por trás dos arquivos estáticos do Flask e também destacar como você pode aproveitar essa funcionalidade em seus próprios aplicativos da web.
Se você for um desenvolvedor criando um aplicativo web Flask, pode ser necessário incluir arquivos estáticos, como imagens, folhas de estilo e arquivos JavaScript.
O Flask oferece uma maneira conveniente de servir esses arquivos estáticos, permitindo que você aprimore a experiência do usuário e melhore o desempenho de seu aplicativo da web.
Criar Arquivos Estáticos Flask
Como um desenvolvedor que cria um aplicativo da web com Flask , você provavelmente precisará incluir arquivos estáticos como CSS ou JavaScript para garantir a renderização adequada de suas páginas da web.
Na maioria dos casos, o servidor web é configurado para lidar com o fornecimento desses arquivos, mas durante o desenvolvimento, eles podem ser acessados a partir da pasta estática dentro do pacote ou módulo de seu aplicativo Flask por meio da URL / static .
Para criar URLs para arquivos estáticos no Flask, você usará o endpoint 'static'.
Por exemplo, se você tiver um arquivo script.js que contém uma função JavaScript acionada por um evento OnClick no arquivo form.html, poderá criar uma URL para ele como esta:
Example:
Abaixo está o script HTML para form.html:
Example:
Para criar um arquivo JavaScript no Flask, você pode simplesmente criar um novo arquivo com a extensão .js e salvá-lo no diretório estático.
Por exemplo, se você deseja criar um arquivo JavaScript chamado script.js , salve-o no diretório estático desta forma:
seu_projeto/
├── static/
│ └── script.js
├── templates/
│ └── form.html
└── app.py
Inclua a função greeting() no arquivo script.js:
Example:
Para fazer um arquivo CSS no Flask, você pode criar um novo arquivo com a extensão .css e mantê-lo na pasta estática.
Por exemplo, se você deseja criar um arquivo CSS chamado style.css , salve-o na pasta estática desta forma:
seu_projeto/
├── static/
│ └── script.js
│ └── style.css
├── templates/
│ └── form.html
└── app.py
Aplicar css externo no botão Mr.Examples:
Example:
Exemplo de Explicação
- A primeira linha do código acima importa a estrutura Flask e a função render_template
- A segunda linha cria uma instância da classe Flask e a armazena em uma variável chamada “ app “.
- O decorador “ @app.route('/') ” vincula a função chamada show_site() à URL raiz (' / ').
- Quando um usuário visita a URL raiz, o Flask executa a função show_site() .
- A função show_site() usa a função render_template() para gerar uma resposta HTML, que é baseada no conteúdo do arquivo de modelo “ form.html ”.
- A condição “ name == ' main '” garante que o método app.run() seja executado somente quando o script for executado diretamente.
- Quando o aplicativo é executado, o servidor de desenvolvimento do Flask é iniciado e o aplicativo fica disponível no host e na porta especificados.
- O argumento “ debug=True ” é passado para o método app.run() para ativar o modo de depuração do Flask, que exibe mensagens de erro detalhadas quando ocorre um erro no aplicativo.
Servindo arquivos estáticos em produção
Na produção, é recomendável servir arquivos estáticos usando um servidor web dedicado ou uma rede de entrega de conteúdo (CDN) para melhor desempenho.
O Flask fornece uma maneira conveniente de fazer isso usando a extensão “ Flask-Assets ”, que permite agrupar e compactar seus arquivos estáticos e servi-los por meio de um CDN ou de um servidor dedicado.
Benefícios dos Arquivos Estáticos Flask
Os arquivos estáticos do Flask têm várias vantagens, que incluem:
- Servir arquivos estáticos do servidor da Web em vez do aplicativo Flask leva a tempos de resposta mais rápidos, pois o servidor da Web pode armazenar em cache os arquivos e atendê-los com mais eficiência.
- A separação de arquivos estáticos de conteúdo dinâmico reduz a carga de trabalho no aplicativo Flask e no servidor web porque os arquivos estáticos geralmente são atualizados com menos frequência e requerem menos processamento.
- Armazenar arquivos estáticos em um diretório separado torna mais fácil organizá-los e gerenciá-los. O Flask também fornece uma maneira integrada de gerar URLs para arquivos estáticos, facilitando a referência a eles em modelos e códigos.
- O recurso de arquivos estáticos Flask inclui um mecanismo integrado que impede o acesso não autorizado a arquivos estáticos, garantindo a proteção de dados confidenciais.
- Você pode experimentar uma melhor experiência de desenvolvimento e criar aplicativos da Web visualmente mais atraentes utilizando o recurso de arquivos estáticos do Flask. Com esse recurso, você pode trabalhar facilmente com recursos da Web, como CSS, JavaScript e imagens, tornando o processo de desenvolvimento mais suave e eficiente.
Conclusão
Ao utilizar o recurso do Flask para arquivos estáticos, você pode aproveitar vários benefícios que melhoram o desempenho geral, a segurança e a manutenção de seus aplicativos da web. A separação de arquivos estáticos de conteúdo dinâmico reduz a carga de trabalho no servidor web, o que leva a tempos de resposta mais rápidos . Organizar e gerenciar arquivos estáticos torna-se mais fácil com o mecanismo integrado do Flask, garantindo sua segurança e integridade. Além disso, trabalhar com recursos da Web, como CSS, JavaScript e imagens, torna-se mais direto, resultando em aplicativos da Web visualmente mais atraentes e em uma experiência melhor para o desenvolvedor.
