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
Copy file name to clipboardExpand all lines: 5-network/05-fetch-crossorigin/article.md
+17-17
Original file line number
Diff line number
Diff line change
@@ -104,7 +104,7 @@ Existen dos tipos de solicitudes de origen cruzado:
104
104
1. Solicitudes seguras.
105
105
2. Todas las demás.
106
106
107
-
Las solicitudes seguras son más simples de hacer, comencemos con ellas.
107
+
Las solicitudes seguras son más fáciles de hacer, comencemos con ellas.
108
108
109
109
Una solicitud es segura si cumple dos condiciones:
110
110
@@ -115,17 +115,17 @@ Una solicitud es segura si cumple dos condiciones:
115
115
-`Content-Language`,
116
116
-`Content-Type` con el valor `application/x-www-form-urlencoded`, `multipart/form-data` o `text/plain`.
117
117
118
-
Cualquier otra solicitud es considerada "no simple". Por lo tanto, una solicitud con el método `PUT` o con una cabecera HTTP`API-Key` no cumple con las limitaciones.
118
+
Cualquier otra solicitud es considerada "insegura". Por lo tanto, una solicitud con el método `PUT` o con una cabecera HTTP`API-Key` no cumple con las limitaciones.
119
119
120
-
**La diferencia esencial es que una "solicitud simple" puede ser realizada mediante un `<form>` o un `<script>`, sin la necesidad de utilizar un método especial.**
120
+
**La diferencia esencial es que una solicitud segura puede ser realizada mediante un `<form>` o un `<script>`, sin la necesidad de utilizar un método especial.**
121
121
122
-
Por lo tanto, incluso un servidor obsoleto debería ser capaz de aceptar una solicitud simple.
122
+
Por lo tanto, incluso un servidor obsoleto debería ser capaz de aceptar una solicitud segura.
123
123
124
124
Contrario a esto, las solicitudes con cabeceras no estándar o métodos como el `DELETE` no pueden ser creados de este modo. Durante mucho tiempo no fue posible para JavaScript realizar este tipo de solicitudes. Por lo que un viejo servidor podía asumir que ese tipo de solicitudes provenía desde una fuente privilegiada, "ya que una página web es incapaz de enviarlas".
125
125
126
-
Cuando intentamos realizar una solicitud "no simple", el navegador envía una solicitud especial de "pre-vuelo"consultándole al servidor si está de acuerdo en aceptar ese tipo de solicitud de origen cruzado, o no.
126
+
Cuando intentamos realizar una solicitud insegura, el navegador envía una solicitud especial de "pre-vuelo"consultando al servidor: ¿está de acuerdo en aceptar tal solicitud de origen cruzado o no?
127
127
128
-
Y, salvo que el servidor lo confirme de forma explícita, cualquier solicitud "no segura" no es enviada.
128
+
Y, salvo que el servidor lo confirme de forma explícita, cualquier solicitud insegura no es enviada.
Para las respuestas de origen cruzado, por defecto JavaScript sólo puede acceder a las cabeceras llamadas "simples":
168
+
Para las respuestas de origen cruzado, por defecto JavaScript sólo puede acceder a las cabeceras llamadas "seguras":
169
169
170
170
-`Cache-Control`
171
171
-`Content-Language`
@@ -182,7 +182,7 @@ Como se puede ver, ¡no está la cabecera `Content-Length` en la lista!
182
182
Esta cabecera contiene el tamaño total de la respuesta. Por lo que si queremos mostrar el progreso de la descarga, en ese caso necesitaremos un permiso adicional para acceder a ese campo de la cabecera.
183
183
```
184
184
185
-
Para permitirle a JavaScript acceso a otros tipos de cabeceras, el servidor debe incluir la cabecera `Access-Control-Expose-Headers`. Este campo contiene una lista separada por comas de las cabeceras no seguras que podrán ser accesibles.
185
+
Para permitirle a JavaScript acceso a otros tipos de cabeceras, el servidor debe incluir la cabecera `Access-Control-Expose-Headers`. Este campo contiene una lista separada por comas de las cabeceras inseguras que podrán ser accesibles.
Con este valor de `Access-Control-Expose-Headers`, el script tendrá permitido acceder a los valores de las cabeceras `Content-Length` y `API-Key` de la respuesta.
201
201
202
-
## Solicitudes "No simples"
202
+
## Solicitudes "inseguras"
203
203
204
204
Podemos utilizar cualquier método HTTP: no únicamente `GET/POST`, sino también `PATCH`, `DELETE` y otros.
205
205
206
206
Hace algún tiempo nadie podía siquiera imaginar que un sitio web pudiera realizar ese tipo de solicitudes. Por lo que aún existen servicios web que cuando reciben un método no estándar los consideran como una señal de que:"Del otro lado no hay un navegador". Ellos pueden tener en cuenta esto cuando revisan los derechos de acceso.
207
207
208
-
Por lo tanto, para evitar malentendidos, cualquier solicitud "no segura" (Estas que no podían ser realizadas en los viejos tiempos), no será realizada por el navegador en forma directa. Antes, enviará una solicitud preliminar llamada solicitud de "pre-vuelo", solicitando que se le concedan los permisos.
208
+
Por lo tanto, para evitar malentendidos, cualquier solicitud "insegura" (Estas que no podían ser realizadas en los viejos tiempos), no será realizada por el navegador en forma directa. Antes, enviará una solicitud preliminar llamada solicitud de "pre-vuelo", solicitando que se le concedan los permisos.
209
209
210
210
Una solicitud de "pre-vuelo" utiliza el método `OPTIONS`, sin contenido en el cuerpo y con dos cabeceras:
211
211
212
-
-`Access-Control-Request-Method`, cabecera que contiene el método de la solicitud "no simple".
213
-
-`Access-Control-Request-Headers` provee una lista separada por comas de las cabeceras no simples de la solicitud.
212
+
-`Access-Control-Request-Method`, cabecera que contiene el método de la solicitud "insegura".
213
+
-`Access-Control-Request-Headers` provee una lista separada por comas de las cabeceras inseguras de la solicitud.
214
214
215
215
Si el servidor está de acuerdo con lo solicitado, entonces responderá con el código de estado 200 y un cuerpo vacío:
216
216
@@ -233,10 +233,10 @@ let response = await fetch('https://site.com/service.json', {
233
233
});
234
234
```
235
235
236
-
Hay tres motivos por los cuales esta solicitud no es simple (una es suficiente):
236
+
Hay tres motivos por los cuales esta solicitud no es segura (una es suficiente):
237
237
-Método `PATCH`
238
238
-`Content-Type` no es del tipo:`application/x-www-form-urlencoded`, `multipart/form-data`, `text/plain`.
-`Access-Control-Request-Headers`-- listado separado por comas de las cabeceras "no simples".
258
+
-`Access-Control-Request-Headers`-- listado separado por comas de las cabeceras "inseguras".
259
259
260
260
### Paso 2 (solicitud de pre-vuelo)
261
261
@@ -360,7 +360,7 @@ Desde el punto de vista del navegador, existen dos tipos de solicitudes de orige
360
360
-`Content-Language`
361
361
-`Content-Type` con el valor `application/x-www-form-urlencoded`, `multipart/form-data` o `text/plain`.
362
362
363
-
La diferencia escencial es que las solicitudes seguras eran posibles desde los viejos tiempos utilizando las etiquetas `<form>` o `<script>`, mientras que las solicitudes "no seguras" fueron imposibles para el navegador durante mucho tiempo.
363
+
La diferencia esencial es que las solicitudes seguras eran posibles desde los viejos tiempos utilizando las etiquetas `<form>` o `<script>`, mientras que las solicitudes "inseguras" fueron imposibles para el navegador durante mucho tiempo.
364
364
365
365
Por lo tanto, en la práctica, la diferencia se encuentra en que las solicitudes seguras son realizadas de forma directa, utilizando la cabecera `Origin`, mientras que para las otras el navegador realiza una solicitud extra de "pre-vuelo" para requerir la autorización.
366
366
@@ -379,7 +379,7 @@ Adicionalmente, para garantizar a JavaScript acceso a cualquier cabecera de la r
379
379
380
380
- → El navegador envía una solicitud del tipo `OPTIONS` a la misma URL, con las cabeceras:
381
381
-`Access-Control-Request-Method` con el método requerido.
382
-
-`Access-Control-Request-Headers` listado de las cabeceras no seguras.
382
+
-`Access-Control-Request-Headers` listado de las cabeceras inseguras.
383
383
- ← El servidor debe responder con el código de estado 200 y las cabeceras:
384
384
-`Access-Control-Allow-Methods` con la lista de todos los métodos permitidos,
385
385
-`Access-Control-Allow-Headers` con una lista de cabeceras permitidas,
0 commit comments