Pular para conteúdo

Plugin Visualização de HTML

Uma visualização ao vivo, com fidelidade total, do documento HTML (e PHP) ativo, renderizada com um mecanismo de navegador de verdade (QtWebEngine) em um painel acoplável. Diferente da visualização de Markdown, esta renderiza CSS, JavaScript, fontes web e tudo o mais exatamente como um navegador faria.

Disponibilidade — nem todo download a inclui

A visualização de HTML é movida pelo QtWebEngine, um mecanismo de navegador completo, e é correspondentemente grande. Por isso ela é opcional, e o download que você tem decide se você a recebe.

  • macOS — o OctoEdit é publicado como dois pacotes: um com a visualização de HTML e um enxuto sem ela. Escolha o download que diz incluir a visualização de HTML, e ela estará lá no momento em que você iniciar o editor. Não há complemento para instalar depois: um pacote sem a visualização não pode ganhá-la mais tarde, então baixe o outro.
  • Windows — a visualização também pode ser acrescentada depois a uma instalação existente, como um download separado da visualização de HTML que você descompacta na pasta em que o OctoEdit está instalado, e então reinicia o editor.

Se Exibir ▸ Visualização de HTML não aparece no menu, sua cópia não inclui a visualização. A visualização de Markdown não precisa de mecanismo de navegador e está sempre disponível.

Compilando a partir do código-fonte: a visualização fica atrás da opção de CMake MTE_ENABLE_HTML_PREVIEW — veja BUILDING.md para notas de empacotamento e licenciamento.

Onde encontrá-lo

Exibir ▸ Visualização de HTML abre (ou fecha) o painel de visualização da aba atual.

Como ele se comporta

  • Renderização ao vivo. A visualização é redesenhada enquanto você digita (com atraso; o atraso relaxa em arquivos muito grandes).
  • Fidelidade total. Folhas de estilo, scripts, imagens e outros recursos são carregados em relação à pasta do documento, então uma página é visualizada como seria em um navegador.
  • Links para pastas. Clicar em um link que aponta para uma pasta local carrega o documento índice daquela pasta (index.html / index.htm / index.xhtml) em vez de uma listagem de diretório.
  • Abrir no navegador. A barra de ferramentas abre o arquivo no disco (ou, nos modos de servidor PHP abaixo, a URL ao vivo) no seu navegador padrão.
  • Tamanho do painel. A visualização mantém uma fração da janela em vez de uma largura fixa, então cresce e encolhe junto com ela — veja Layout salvo.

Uma piscada com a renderização de janela por CPU

A visualização traz um mecanismo de navegador para dentro da janela do editor, e com Renderização da janela em CPU a janela precisa ser recriada para abrir espaço para ele. Por isso a janela do editor pisca uma vez — na primeira vez que você abre a visualização de HTML numa sessão, e nunca mais depois disso. O padrão, GPU, evita isso por completo; veja Preferências ▸ Geral ▸ Renderização da janela.

Visibilidade da visualização

A visibilidade da visualização é lembrada por arquivo, tanto durante uma sessão quanto entre reinícios:

  • Arquivos web (.html, .htm, .xhtml e .php / .phtml / .php3 / .php4) abrem a visualização automaticamente na primeira vez que você os vê.
  • Os demais arquivos não — mas você pode abrir a visualização em qualquer arquivo com Exibir ▸ Visualização de HTML, e ela renderizará aquele arquivo como HTML.
  • Dentro de uma sessão, sua escolha para uma aba é restaurada quando você volta a ela.
  • Entre reinícios, sua escolha explícita para um arquivo é lembrada: um fechamento manual continua fechado na próxima vez que você abrir aquele arquivo, e uma visualização que você abriu em um arquivo que não abriria automaticamente reabre. Arquivos que você nunca tocou explicitamente seguem o padrão de abertura automática toda vez.

Visualizando PHP

O PHP roda no servidor, então o QtWebEngine não pode executá-lo diretamente. Escolha como os arquivos .php são tratados em Preferências ▸ Plug-ins ▸ Visualização de HTML:

Modo O que faz Melhor para
Desativado Mostra uma página de instruções; nunca executa nem busca nada. Desligar a visualização de PHP.
Executar com o PHP (linha de comando) Passa o documento pelo binário php local e renderiza a saída dele. Roda sob a SAPI CLI do PHP. Arquivos de template / autônomos que imprimem HTML.
Executar com o PHP (servidor embutido) Serve o documento pelo servidor web integrado do PHP (php -S), que o editor inicia e para por você. Roda sob a SAPI web. Páginas completas — phpinfo(), $_SERVER, sessões, roteamento.
Usar um servidor seu (URL) Mapeia o arquivo aberto para uma URL em um servidor que você executa (Apache, nginx, Docker, php artisan serve, …). Uma pilha de desenvolvimento local existente.

O caminho do executável do PHP e Atualizar automaticamente enquanto digita valem tanto para o modo de linha de comando quanto para o de servidor integrado. Deixe o caminho vazio para procurar no seu PATH e nos locais de instalação comuns (no macOS, um aplicativo iniciado pelo Finder não herda o PATH do seu shell, então informe o caminho completo, p. ex. /opt/homebrew/bin/php).

Linha de comando versus servidor integrado

Os dois modos executam o binário php local, mas sob ambientes (SAPIs) diferentes, e isso muda o que funciona:

  • Linha de comando (SAPI CLI). Rápida e simples — ela apenas mostra o que o script imprime. Mas phpinfo() é renderizado como texto simples, e recursos web como $_SERVER, sessões e roteamento são limitados ou vazios. Ótima para arquivos que basicamente emitem HTML.

  • Servidor integrado (SAPI web). O editor lança um pequeno php -S 127.0.0.1:<port> com raiz na pasta do seu arquivo e carrega a página por HTTP, então ela é renderizada exatamente como em um servidor real: phpinfo() é uma página HTML estilizada, $_SERVER está preenchido, e sessões e requisições de recursos/sub-recursos funcionam.

  • O servidor só é iniciado quando você visualiza um arquivo .php pela primeira vez neste modo, é reaproveitado entre renderizações, reiniciado se você trocar para um arquivo em outra pasta, e parado quando você fecha o editor ou sai do modo.

  • Ele se vincula apenas a 127.0.0.1, então nunca é alcançável pela rede.
  • Edições não salvas também são visualizadas: seu buffer ao vivo é gravado em um arquivo temporário na pasta do documento (para que __DIR__ e os include/require relativos se resolvam corretamente) e é isso que é servido. O arquivo temporário é substituído a cada renderização e removido quando você sai ou troca de modo.

Tip

Se uma página PHP aparece como texto em vez de página renderizada, troque de linha de comando para servidor integrado — essa é a diferença entre a SAPI CLI e a web, não um defeito.

Usar um servidor seu (URL)

Se você já executa PHP atrás de um servidor web, aponte a visualização para ele:

  • URL base — a raiz do seu servidor, p. ex. http://127.0.0.1:8000.
  • Raiz de documentos — a pasta local servida naquela URL base. O arquivo aberto é mapeado para uma URL sob ela. Deixe-a vazia para servir o arquivo pelo nome a partir da URL base. Se o arquivo estiver fora da raiz de documentos, a visualização informa isso para que você corrija o mapeamento.

Quando o PHP não é encontrado

Nos modos de linha de comando e de servidor integrado, se nenhum binário php puder ser localizado, a visualização exibe um breve erro explicando como definir o caminho ou instalar o PHP. A página de instruções do modo Desativado também traz links para os downloads do PHP e mostra como iniciar um servidor.

Veja também