AWS Cloud9 não está mais disponível para novos clientes. Os clientes atuais do AWS Cloud9 podem continuar usando o serviço normalmente. [Saiba mais](https://aws.amazon.com/blogs/devops/how-to-migrate-from-aws-cloud9-to-aws-ide-toolkits-or-aws-cloudshell/)
As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá.
# Visualizando aplicativos em execução no IDE AWS Cloud9
Você pode usar o Ambiente de Desenvolvimento AWS Cloud9 Integrado (IDE) para visualizar uma aplicação em execução a partir do IDE.
## Execute uma aplicação
Antes que você possa visualizar seu aplicativo de dentro do IDE, seu aplicativo deve estar em execução no ambiente de AWS Cloud9 desenvolvimento. Ele deve usar HTTP nas seguintes portas:
+ `8080`
+ `8081`
+ `8082`
Todas as portas acima devem usar o endereço IP de `127.0.0.1` `localhost`, ou`0.0.0.0`.
**nota**
Não é necessário executar a aplicação usando HTTP sobre a porta `8080`, `8081` nem `8082` com o endereço IP `127.0.0.1`, `localhost` nem `0.0.0.0`. No entanto, se você não fizer isso, não poderá visualizar a aplicação em execução no IDE.
**nota**
A aplicação de visualização é executada no IDE e carregada em um elemento iframe. Alguns servidores de aplicativos podem, por padrão, bloquear solicitações provenientes de elementos iframe, como o X-Frame-Options cabeçalho. Se a aplicação de visualização não for exibida na guia de visualização, garanta que o servidor de aplicações não proíba a exibição do conteúdo em iframes.
Para escrever o código a fim de executar sua aplicação em uma porta e endereço IP específicos, consulte a documentação da aplicação.
Para executar o aplicativo, consulte [Executar o código](build-run-debug.md#build-run-debug-run).
Para testar esse comportamento, adicione o JavaScript código a seguir a um arquivo nomeado `server.js` na raiz do seu ambiente. Esse código executa um servidor usando um arquivo chamado Node.js.
**nota**
No exemplo a seguir, `text/html` é o `Content-Type` do conteúdo retornado. Para retornar o conteúdo em um formato diferente, especifique um`Content-Type`. Por exemplo, é possível especificar `text/css` para um formato de arquivo CSS.
```
var http = require('http');
var fs = require('fs');
var url = require('url');
http.createServer( function (request, response) {
var pathname = url.parse(request.url).pathname;
console.log("Trying to find '" + pathname.substr(1) + "'...");
fs.readFile(pathname.substr(1), function (err, data) {
if (err) {
response.writeHead(404, {'Content-Type': 'text/html'});
response.write("ERROR: Cannot find '" + pathname.substr(1) + "'.");
console.log("ERROR: Cannot find '" + pathname.substr(1) + "'.");
} else {
console.log("Found '" + pathname.substr(1) + "'.");
response.writeHead(200, {'Content-Type': 'text/html'});
response.write(data.toString());
}
response.end();
});
}).listen(8080, 'localhost'); // Or 8081 or 8082 instead of 8080. Or '127.0.0.1' instead of 'localhost'.
```
Na raiz do ambiente, é possível adicionar o código Python a seguir a um arquivo denominado `server.py`. No exemplo a seguir, um servidor é executado usando Python.
```
import os
import http.server
import socketserver
ip = 'localhost' # Or '127.0.0.1' instead of 'localhost'.
port = '8080' # Or '8081' or '8082' instead of '8080'.
Handler = http.server.SimpleHTTPRequestHandler
httpd = socketserver.TCPServer((ip, int(port)), Handler)
httpd.serve_forever()
```
Depois, adicione o código HTML a seguir a um arquivo denominado `index.html`.
```
Hello Home Page
Hello, World!
```
Para ver a saída HTML desse arquivo na guia de visualização da aplicação, execute `server.js` com Node.js ou o arquivo `server.py` com Python. Depois, siga as etapas da próxima seção para visualizá-lo. Na guia de visualização do aplicativo, adicione `/index.html` ao final do URL e, em seguida, pressione `Enter`.
## Visualizar uma aplicação em execução
Antes de visualizar sua aplicação, considere o seguinte:
+ Sua aplicação é executada usando o protocolo HTTP sobre a porta `8080`, `8081` ou `8082`.
+ O endereço IP de sua aplicação no ambiente é `127.0.0.1`, `localhost` ou `0.0.0.0`.
+ O arquivo de código do aplicativo está aberto e ativo no AWS Cloud9 IDE.
Depois de confirmar todos esses detalhes, selecione uma das seguintes opções na barra de menus:
+ **Visualizar, Visualizar a aplicação em execução**
+ **Tools, Preview, Preview Running Application (Ferramentas, Visualizar, Visualizar o aplicativo em execução)**
Uma dessas opções abre uma guia de visualização da aplicação no ambiente e, depois, o resultado da aplicação é exibido na guia.
**nota**
Se a guia de visualização da aplicação exibir um erro ou estiver em branco, tente seguir as etapas de solução de problemas em [A guia de visualização da aplicação exibe um erro ou está em branco](troubleshooting.md#troubleshooting-app-preview). Se, ao tentar visualizar uma aplicação ou um arquivo, você receber o seguinte aviso *“A funcionalidade de visualização está desabilitada porque seu navegador tem cookies de terceiros desabilitados”*, siga as etapas de solução de problemas em [Aviso de visualização de aplicação ou arquivo: "Cookies de terceiros desativados"](troubleshooting.md#troubleshooting-preview).
**nota**
Se a aplicação ainda não estiver em execução, será exibido um erro na guia de visualização da aplicação. Para resolver esse problema, execute ou reinicie a aplicação e, depois, selecione o comando da barra de menus novamente.
Suponha que, por exemplo, seu aplicativo não possa ser executado em nenhuma das portas IPs mencionadas. Ou sua aplicação deva ser executada em mais de uma dessas portas ao mesmo tempo. Por exemplo, sua aplicação deve ser executada nas portas `8080` e `3000`ao mesmo tempo. Se for esse o caso, a guia de visualização da aplicação pode exibir um erro ou estar em branco. Isso ocorre porque a guia de visualização do aplicativo no ambiente funciona somente com as portas anteriores e. IPs Além disso, a aplicação funciona com apenas uma única porta por vez.
Não recomendamos compartilhar o URL na guia de visualização do aplicativo com outras pessoas. (O URL está no seguinte formato:`https://12a34567b8cd9012345ef67abcd890e1.vfs.cloud9.us-east-2.amazonaws.com/`. Nesse formato, `12a34567b8cd9012345ef67abcd890e1` é a ID que é AWS Cloud9 atribuída ao ambiente. `us-east-2`é a ID do Região da AWS para o ambiente.) Esse URL funciona somente quando o IDE do ambiente estiver aberto e a aplicação estiver em execução no mesmo navegador da web.
Se você tentar visitar o IP de `127.0.0.1``localhost`, ou `0.0.0.0` usando a guia de visualização do aplicativo no IDE ou em uma guia separada do navegador da Web fora do IDE, o AWS Cloud9 IDE, por padrão, tentará acessar seu computador local, em vez da instância ou do seu próprio servidor conectado ao ambiente.
Para obter instruções sobre como fornecer a outras pessoas uma visualização da aplicação em execução fora do IDE, consulte [Compartilhar uma aplicação em execução pela Internet](app-preview-share.md).