mirror of
https://github.com/carlospolop/hacktricks
synced 2024-12-24 03:53:29 +00:00
Translated ['network-services-pentesting/pentesting-web/nextjs.md'] to p
This commit is contained in:
parent
607c3f8514
commit
793348d8d9
1 changed files with 11 additions and 11 deletions
|
@ -56,9 +56,9 @@ my-nextjs-app/
|
||||||
```
|
```
|
||||||
### Diretórios e Arquivos Principais
|
### Diretórios e Arquivos Principais
|
||||||
|
|
||||||
* **public/:** Hospeda ativos estáticos, como imagens, fontes e outros arquivos. Os arquivos aqui são acessíveis no caminho raiz (`/`).
|
* **public/:** Hospeda ativos estáticos, como imagens, fontes e outros arquivos. Os arquivos aqui são acessíveis na raiz (`/`).
|
||||||
* **app/:** Diretório central para as páginas, layouts, componentes e rotas da API da sua aplicação. Abrange o paradigma **App Router**, permitindo recursos avançados de roteamento e segregação de componentes servidor-cliente.
|
* **app/:** Diretório central para as páginas, layouts, componentes e rotas da API da sua aplicação. Abrange o paradigma **App Router**, permitindo recursos avançados de roteamento e segregação de componentes servidor-cliente.
|
||||||
* **app/layout.tsx:** Define o layout raiz para sua aplicação, envolvendo todas as páginas e fornecendo elementos de UI consistentes, como cabeçalhos, rodapés e barras de navegação.
|
* **app/layout.tsx:** Define o layout raiz da sua aplicação, envolvendo todas as páginas e fornecendo elementos de UI consistentes, como cabeçalhos, rodapés e barras de navegação.
|
||||||
* **app/page.tsx:** Serve como o ponto de entrada para a rota raiz `/`, renderizando a página inicial.
|
* **app/page.tsx:** Serve como o ponto de entrada para a rota raiz `/`, renderizando a página inicial.
|
||||||
* **app/\[route]/page.tsx:** Lida com rotas estáticas e dinâmicas. Cada pasta dentro de `app/` representa um segmento de rota, e `page.tsx` dentro dessas pastas corresponde ao componente da rota.
|
* **app/\[route]/page.tsx:** Lida com rotas estáticas e dinâmicas. Cada pasta dentro de `app/` representa um segmento de rota, e `page.tsx` dentro dessas pastas corresponde ao componente da rota.
|
||||||
* **app/api/:** Contém rotas da API, permitindo que você crie funções serverless que lidam com requisições HTTP. Essas rotas substituem o diretório tradicional `pages/api`.
|
* **app/api/:** Contém rotas da API, permitindo que você crie funções serverless que lidam com requisições HTTP. Essas rotas substituem o diretório tradicional `pages/api`.
|
||||||
|
@ -166,7 +166,7 @@ Rotas dinâmicas permitem o manuseio de caminhos com segmentos variáveis, permi
|
||||||
|
|
||||||
**Exemplo: Rota `/posts/[id]`**
|
**Exemplo: Rota `/posts/[id]`**
|
||||||
|
|
||||||
**Estrutura de Arquivo:**
|
**Estrutura de Arquivos:**
|
||||||
```arduino
|
```arduino
|
||||||
arduinoCopy codemy-nextjs-app/
|
arduinoCopy codemy-nextjs-app/
|
||||||
├── app/
|
├── app/
|
||||||
|
@ -345,9 +345,9 @@ return <div dangerouslySetInnerHTML={{ __html: html }} />;
|
||||||
|
|
||||||
<details>
|
<details>
|
||||||
|
|
||||||
<summary>Travessia de Caminho do Cliente</summary>
|
<summary>Traversal de Caminho do Cliente</summary>
|
||||||
|
|
||||||
É uma vulnerabilidade que permite que atacantes manipulem caminhos do lado do cliente para realizar ações não intencionais, como Cross-Site Request Forgery (CSRF). Ao contrário da travessia de caminho do lado do servidor, que visa o sistema de arquivos do servidor, a CSPT foca em explorar mecanismos do lado do cliente para redirecionar solicitações de API legítimas para endpoints maliciosos.
|
É uma vulnerabilidade que permite que atacantes manipulem caminhos do lado do cliente para realizar ações não intencionais, como Cross-Site Request Forgery (CSRF). Ao contrário do traversal de caminho do lado do servidor, que visa o sistema de arquivos do servidor, o CSPT foca em explorar mecanismos do lado do cliente para redirecionar solicitações de API legítimas para endpoints maliciosos.
|
||||||
|
|
||||||
**Exemplo de Código Vulnerável:**
|
**Exemplo de Código Vulnerável:**
|
||||||
|
|
||||||
|
@ -466,7 +466,7 @@ Next.js permite a criação de endpoints de API como funções serverless. Essas
|
||||||
|
|
||||||
**Implementação:**
|
**Implementação:**
|
||||||
|
|
||||||
Com a introdução do diretório `app` no Next.js 13, o roteamento e o manuseio de APIs se tornaram mais flexíveis e poderosos. Essa abordagem moderna se alinha de perto com o sistema de roteamento baseado em arquivos, mas introduz capacidades aprimoradas, incluindo suporte para componentes de servidor e cliente.
|
Com a introdução do diretório `app` no Next.js 13, o roteamento e o manuseio de API se tornaram mais flexíveis e poderosos. Essa abordagem moderna se alinha de perto com o sistema de roteamento baseado em arquivos, mas introduz capacidades aprimoradas, incluindo suporte para componentes de servidor e cliente.
|
||||||
|
|
||||||
#### Manipulador de Rota Básico
|
#### Manipulador de Rota Básico
|
||||||
|
|
||||||
|
@ -511,7 +511,7 @@ body: JSON.stringify({ name: 'John Doe' }),
|
||||||
|
|
||||||
<details>
|
<details>
|
||||||
|
|
||||||
<summary>Manipulação de Métodos HTTP Específicos</summary>
|
<summary>Manipulando Métodos HTTP Específicos</summary>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@ -612,7 +612,7 @@ Antes que o Next.js 13 introduzisse o diretório `app` e melhorasse as capacidad
|
||||||
|
|
||||||
#### Rota de API Básica
|
#### Rota de API Básica
|
||||||
|
|
||||||
**Estrutura de Arquivos:**
|
**Estrutura de Arquivo:**
|
||||||
```go
|
```go
|
||||||
goCopy codemy-nextjs-app/
|
goCopy codemy-nextjs-app/
|
||||||
├── pages/
|
├── pages/
|
||||||
|
@ -735,7 +735,7 @@ headers: {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
Note que **CORS também pode ser configurado em todas as rotas da API** dentro do arquivo **`middleware.ts`**:
|
Observe que **CORS também pode ser configurado em todas as rotas da API** dentro do arquivo **`middleware.ts`**:
|
||||||
```javascript
|
```javascript
|
||||||
// app/middleware.ts
|
// app/middleware.ts
|
||||||
|
|
||||||
|
@ -785,7 +785,7 @@ Os atacantes podem criar sites maliciosos que fazem solicitações à sua API, p
|
||||||
[cors-bypass.md](../../pentesting-web/cors-bypass.md)
|
[cors-bypass.md](../../pentesting-web/cors-bypass.md)
|
||||||
{% endcontent-ref %}
|
{% endcontent-ref %}
|
||||||
|
|
||||||
## Exposição de código do servidor no lado do cliente
|
### Exposição de código do servidor no lado do cliente
|
||||||
|
|
||||||
É fácil **usar código usado pelo servidor também no código exposto e usado pelo lado do cliente**, a melhor maneira de garantir que um arquivo de código nunca seja exposto no lado do cliente é usando esta importação no início do arquivo:
|
É fácil **usar código usado pelo servidor também no código exposto e usado pelo lado do cliente**, a melhor maneira de garantir que um arquivo de código nunca seja exposto no lado do cliente é usando esta importação no início do arquivo:
|
||||||
```js
|
```js
|
||||||
|
@ -941,7 +941,7 @@ NEXT_PUBLIC_API_URL: process.env.NEXT_PUBLIC_API_URL, // Correctly prefixed for
|
||||||
|
|
||||||
**Como os atacantes abusam disso:**
|
**Como os atacantes abusam disso:**
|
||||||
|
|
||||||
Se variáveis sensíveis forem expostas ao cliente, os atacantes podem recuperá-las inspecionando o código do lado do cliente ou solicitações de rede, obtendo acesso não autorizado a APIs, bancos de dados ou outros serviços.
|
Se variáveis sensíveis forem expostas ao cliente, os atacantes podem recuperá-las inspecionando o código do lado do cliente ou as requisições de rede, obtendo acesso não autorizado a APIs, bancos de dados ou outros serviços.
|
||||||
|
|
||||||
</details>
|
</details>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue