You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
**This API is experimental and is not available in a stable version of React yet.**
7
+
**Esta API é experimental e ainda não está disponível em uma versão estável do React.**
8
8
9
-
You can try it by upgrading React packages to the most recent experimental version:
9
+
Você pode experimentá-la atualizando os pacotes do React para a versão experimental mais recente:
10
10
11
11
-`react@experimental`
12
12
-`react-dom@experimental`
13
13
-`eslint-plugin-react-hooks@experimental`
14
14
15
-
Experimental versions of React may contain bugs. Don't use them in production.
15
+
As versões experimentais do React podem conter erros. Não as use em produção.
16
16
17
-
This API is only available inside React Server Components.
17
+
Esta API só está disponível dentro dos Componentes de Servidor React.
18
18
19
19
</Wip>
20
20
21
-
22
21
<Intro>
23
22
24
-
`taintObjectReference`lets you prevent a specific object instance from being passed to a Client Component like a `user` object.
23
+
`taintObjectReference`permite que você impeça que uma instância de objeto específico seja passada para um Componente de Cliente, como um objeto `user`.
'Do not pass ALL environment variables to the client.',
47
+
'Não passe TODAS as variáveis de ambiente para o cliente.',
49
48
process.env
50
49
);
51
50
```
52
51
53
-
[See more examples below.](#usage)
52
+
[Veja mais exemplos abaixo.](#usage)
54
53
55
-
#### Parameters {/*parameters*/}
54
+
#### Parâmetros {/*parameters*/}
56
55
57
-
*`message`: The message you want to display if the object gets passed to a Client Component. This message will be displayed as a part of the Error that will be thrown if the object gets passed to a Client Component.
56
+
*`message`: A mensagem que você deseja exibir se o objeto for passado para um Componente de Cliente. Esta mensagem será exibida como parte do Erro que será lançado se o objeto for passado para um Componente de Cliente.
58
57
59
-
*`object`: The object to be tainted. Functions and class instances can be passed to `taintObjectReference`as`object`. Functions and classes are already blocked from being passed to Client Components but the React's default error message will be replaced by what you defined in `message`. When a specific instance of a Typed Array is passed to`taintObjectReference`as`object`, any other copies of the Typed Array will not be tainted.
58
+
*`object`: O objeto a ser "manchado". Funções e instâncias de classe podem ser passadas para `taintObjectReference`como`object`. Funções e classes já estão bloqueadas de serem passadas para Componentes de Cliente, mas a mensagem de erro padrão do React será substituída pelo que você definiu em `message`. Quando uma instância específica de um Typed Array é passada para`taintObjectReference`como`object`, quaisquer outras cópias do Typed Array não serão "manchadas".
-Recreating or cloning a tainted object creates a new untainted object which may contain sensitive data. For example, if you have a tainted`user`object, `const userInfo = {name: user.name, ssn: user.ssn}`or`{...user}`will create new objects which are not tainted. `taintObjectReference`only protects against simple mistakes when the object is passed through to a Client Component unchanged.
66
+
-Recriar ou clonar um objeto "manchado" cria um novo objeto não "manchado", que pode conter dados sensíveis. Por exemplo, se você tiver um objeto`user`"manchado", `const userInfo = {name: user.name, ssn: user.ssn}`ou`{...user}`criará novos objetos que não são "manchados". `taintObjectReference`só protege contra erros simples quando o objeto é passado para um Componente de Cliente inalterado.
68
67
69
68
<Pitfall>
70
69
71
-
**Do not rely on just tainting for security.**Tainting an object doesn't prevent leaking of every possible derived value. For example, the clone of a tainted object will create a new untainted object. Using data from a tainted object (e.g. `{secret: taintedObj.secret}`) will create a new value or object that is not tainted. Tainting is a layer of protection; a secure app will have multiple layers of protection, well designed APIs, and isolation patterns.
70
+
**Não confie apenas em "manchar" para segurança.**"Manchar" um objeto não impede o vazamento de todos os valores derivados possíveis. Por exemplo, o clone de um objeto "manchado" criará um novo objeto não "manchado". Usar dados de um objeto "manchado" (por exemplo, `{secret: taintedObj.secret}`) criará um novo valor ou objeto que não está "manchado". "Manchar" é uma camada de proteção; um aplicativo seguro terá múltiplas camadas de proteção, APIs bem projetadas e padrões de isolamento.
72
71
73
72
</Pitfall>
74
73
75
74
---
76
75
77
-
## Usage {/*usage*/}
76
+
## Uso {/*usage*/}
78
77
79
-
### Prevent user data from unintentionally reaching the client {/*prevent-user-data-from-unintentionally-reaching-the-client*/}
78
+
### Impedir que dados do usuário alcancem o cliente sem intenção {/*prevent-user-data-from-unintentionally-reaching-the-client*/}
80
79
81
-
A Client Component should never accept objects that carry sensitive data. Ideally, the data fetching functions should not expose data that the current user should not have access to. Sometimes mistakes happen during refactoring. To protect against these mistakes happening down the line we can "taint" the user object in our data API.
80
+
Um Componente de Cliente nunca deve aceitar objetos que carreguem dados sensíveis. Idealmente, as funções de busca de dados não devem expor dados que o usuário atual não deveria ter acesso. Às vezes, erros acontecem durante a refatoração. Para proteger contra esses erros que acontecem ao longo do tempo, podemos "manchar" o objeto do usuário em nossa API de dados.
constuser=await db`SELECT * FROM users WHERE id = ${id}`;
88
87
experimental_taintObjectReference(
89
-
'Do not pass the entire user object to the client. '+
90
-
'Instead, pick off the specific properties you need for this use case.',
88
+
'Não passe o objeto inteiro do usuário para o cliente. '+
89
+
'Em vez disso, selecione as propriedades específicas que você precisa para este caso de uso.',
91
90
user,
92
91
);
93
92
return user;
94
93
}
95
94
```
96
95
97
-
Now whenever anyone tries to pass this object to a Client Component, an error will be thrown with the passed in error message instead.
96
+
Agora, sempre que alguém tentar passar esse objeto para um Componente de Cliente, um erro será lançado com a mensagem de erro passada.
98
97
99
98
<DeepDive>
100
99
101
-
#### Protecting against leaks in data fetching {/*protecting-against-leaks-in-data-fetching*/}
100
+
#### Protegendo contra vazamentos na busca de dados {/*protecting-against-leaks-in-data-fetching*/}
102
101
103
-
If you're running a Server Components environment that has access to sensitive data, you have to be careful not to pass objects straight through:
102
+
Se você estiver executando um ambiente de Componentes de Servidor que tem acesso a dados sensíveis, você deve ter cuidado para não passar os objetos diretamente:
104
103
105
104
```js
106
105
// api.js
@@ -116,7 +115,7 @@ import { InfoCard } from 'components.js';
116
115
117
116
exportasyncfunctionProfile(props) {
118
117
constuser=awaitgetUser(props.userId);
119
-
//DO NOT DO THIS
118
+
//NÃO FAÇA ISSO
120
119
return<InfoCard user={user} />;
121
120
}
122
121
```
@@ -130,8 +129,7 @@ export async function InfoCard({ user }) {
130
129
}
131
130
```
132
131
133
-
Ideally, the `getUser` should not expose data that the current user should not have access to. To prevent passing the `user` object to a Client Component down the line we can "taint" the user object:
134
-
132
+
Idealmente, o `getUser` não deve expor dados que o usuário atual não deveria ter acesso. Para impedir a passagem do objeto `user` para um Componente de Cliente ao longo do tempo, podemos "manchar" o objeto do usuário:
135
133
136
134
```js
137
135
// api.js
@@ -140,14 +138,14 @@ import {experimental_taintObjectReference} from 'react';
140
138
exportasyncfunctiongetUser(id) {
141
139
constuser=await db`SELECT * FROM users WHERE id = ${id}`;
142
140
experimental_taintObjectReference(
143
-
'Do not pass the entire user object to the client. '+
144
-
'Instead, pick off the specific properties you need for this use case.',
141
+
'Não passe o objeto inteiro do usuário para o cliente. '+
142
+
'Em vez disso, selecione as propriedades específicas que você precisa para este caso de uso.',
145
143
user,
146
144
);
147
145
return user;
148
146
}
149
147
```
150
148
151
-
Now if anyone tries to pass the`user`object to a Client Component, an error will be thrown with the passed in error message.
149
+
Agora, se alguém tentar passar o objeto`user`para um Componente de Cliente, um erro será lançado com a mensagem de erro passada.
0 commit comments