Skip to content

Commit fdcdfec

Browse files
committed
Revert "Fix merge conflicts"
This reverts commit 680337e.
1 parent 680337e commit fdcdfec

File tree

1 file changed

+46
-1
lines changed

1 file changed

+46
-1
lines changed

5-network/01-fetch/article.md

Lines changed: 46 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
11

22
# Fetch
33

4+
<<<<<<< HEAD
45
JavaScript può inviare richieste di rete al server e caricare nuove informazioni ogni volta che è necessario.
6+
=======
7+
JavaScript can send network requests to the server and load new information whenever it's needed.
8+
>>>>>>> 872cc6adedac4ff3ebec73916bf435f1d72f2864
59
610
Per esempio, possiamo usare le richieste di rete per:
711

@@ -12,11 +16,19 @@ Per esempio, possiamo usare le richieste di rete per:
1216

1317
...e tutto senza alcun ricaricamento della pagina!
1418

19+
<<<<<<< HEAD
1520
Ti sarà capitato di ascoltare o leggere il termine "AJAX" (acronimo di <b>A</b>synchronous <b>J</b>avaScript <b>A</b>nd <b>X</b>ML) che è comunemente utilizzato per accomunare (sotto un'unica effige) le richieste di rete in JavaScript. Non è però necessario usare XML: il termine proviene da un retaggio del passato ed è per questo che fa parte dell'abbreviazione.
21+
=======
22+
There's an umbrella term "AJAX" (abbreviated <b>A</b>synchronous <b>J</b>avaScript <b>A</b>nd <b>X</b>ML) for network requests from JavaScript. We don't have to use XML though: the term comes from old times, that's why that word is there. You may have heard that term already.
23+
>>>>>>> 872cc6adedac4ff3ebec73916bf435f1d72f2864
1624
1725
Ci sono molti modi per inviare richieste di rete per richiedere informazioni dal server.
1826

27+
<<<<<<< HEAD
1928
Il metodo `fetch()` è tra tutti il più moderno e versatile, e per questo inizieremo ad analizzare proprio questo. Questo metodo non è supportato dai browser più datati (ma è possibile risolvere con dei polyfills), ma lo è ampiamente tra quelli recenti.
29+
=======
30+
The `fetch()` method is modern and versatile, so we'll start with it. It's not supported by old browsers (can be polyfilled), but very well supported among the modern ones.
31+
>>>>>>> 872cc6adedac4ff3ebec73916bf435f1d72f2864
2032
2133
La sintassi base è:
2234

@@ -27,11 +39,21 @@ let promise = fetch(url, [options])
2739
- **`url`** -- l'URL da raggiungere.
2840
- **`options`** -- parametri opzionali: metodi, headers etc.
2941

42+
<<<<<<< HEAD
3043
Il browser avvia immediatamente la richiesta, il cui risultato sarà utilizzato e gestito per mezzo di una promise.
44+
=======
45+
Without `options`, that is a simple GET request, downloading the contents of the `url`.
46+
47+
The browser starts the request right away and returns a promise that the calling code should use to get the result.
48+
>>>>>>> 872cc6adedac4ff3ebec73916bf435f1d72f2864
3149
3250
Ottenere una risposta è comunemente un processo che si svolge in due fasi.
3351

52+
<<<<<<< HEAD
3453
**Prima fase: la `promise` viene risolta con un oggetto (object) di classe built-in [Response](https://fetch.spec.whatwg.org/#response-class) non appena il server risponde con gli headers.**
54+
=======
55+
**First, the `promise`, returned by `fetch`, resolves with an object of the built-in [Response](https://fetch.spec.whatwg.org/#response-class) class as soon as the server responds with headers.**
56+
>>>>>>> 872cc6adedac4ff3ebec73916bf435f1d72f2864
3557
3658
In questa fase possiamo controllare lo status HTTP, per vedere se la richiesta ha avuto successo o meno, controllare le intestazioni, ma non abbiamo ancora il body.
3759

@@ -59,12 +81,21 @@ if (response.ok) { // se l'HTTP-status è 200-299
5981

6082
`Response` fornisce molteplici metodi promise-based per accedere al body in svariati formati:
6183

62-
- **`response.text()`** -- legge la risposta e ritorna un testo,
84+
<<<<<<< HEAD
85+
- **`response.text()`** -- legge il la risposta e ritorna un testo,
6386
- **`response.json()`** -- interpreta e ritorna la risposta come un JSON,
6487
- **`response.formData()`** -- ritorna la risposta come un oggetto (object) `FormData` (spiegato nel [prossimo capitolo](info:formdata)),
6588
- **`response.blob()`** -- ritorna la risposta come [Blob](info:blob) (binary data con type),
6689
- **`response.arrayBuffer()`** -- ritorna la risposta come [ArrayBuffer](info:arraybuffer-binary-arrays) (rappresentazione low-level di binary data),
6790
- inoltre, `response.body` è un oggetto (object) [ReadableStream](https://streams.spec.whatwg.org/#rs-class), che consente di leggere il body "pezzo per pezzo" (chunk-by-chunk), come vedremo dopo in un esempio.
91+
=======
92+
- **`response.text()`** -- read the response and return as text,
93+
- **`response.json()`** -- parse the response as JSON,
94+
- **`response.formData()`** -- return the response as `FormData` object (explained in the [next chapter](info:formdata)),
95+
- **`response.blob()`** -- return the response as [Blob](info:blob) (binary data with type),
96+
- **`response.arrayBuffer()`** -- return the response as [ArrayBuffer](info:arraybuffer-binary-arrays) (low-level representation of binary data),
97+
- additionally, `response.body` is a [ReadableStream](https://streams.spec.whatwg.org/#rs-class) object, it allows you to read the body chunk-by-chunk, we'll see an example later.
98+
>>>>>>> 872cc6adedac4ff3ebec73916bf435f1d72f2864
6899
69100
Ad esempio, otteniamo un oggetto (object) JSON con gli ultimi commit da GitHub:
70101

@@ -87,7 +118,11 @@ fetch('https://api.github.com/repos/javascript-tutorial/en.javascript.info/commi
87118
.then(commits => alert(commits[0].author.login));
88119
```
89120

121+
<<<<<<< HEAD
90122
Per ottenere il testo della risposta, `await response.text()` invece del `.json()`:
123+
=======
124+
To get the response text, `await response.text()` instead of `.json()`:
125+
>>>>>>> 872cc6adedac4ff3ebec73916bf435f1d72f2864
91126
92127
```js run async
93128
let response = await fetch('https://api.github.com/repos/javascript-tutorial/en.javascript.info/commits');
@@ -126,8 +161,14 @@ Possiamo solo scegliere un metodo di lettura del body.
126161
Se per esempio abbiamo già prelevato il response con `response.text()`, successivamente `response.json()` non funzionerà, dato che il body sarà stato già processato.
127162
128163
```js
164+
<<<<<<< HEAD
129165
let text = await response.text(); // elaborazione del response body
130166
let parsed = await response.json(); // fallisce (già elaborato)
167+
=======
168+
let text = await response.text(); // response body consumed
169+
let parsed = await response.json(); // fails (already consumed)
170+
```
171+
>>>>>>> 872cc6adedac4ff3ebec73916bf435f1d72f2864
131172
````
132173

133174
## Headers della risposta (o response headers)
@@ -227,7 +268,11 @@ Se stiamo invece inviando un JSON, usiamo `application/json` come `Content-Type`
227268

228269
Possiamo anche inviare binary data con `fetch` usando oggetti `Blob` o `BufferSource`.
229270

271+
<<<<<<< HEAD
230272
In questo esempio, c'è un `<canvas>` sul quale possiamo disegnare spostarci sopra con il mouse. Al clic sul bottone "Invia" invieremo l'immagine al server:
273+
=======
274+
In this example, there's a `<canvas>` where we can draw by moving a mouse over it. A click on the "submit" button sends the image to the server:
275+
>>>>>>> 872cc6adedac4ff3ebec73916bf435f1d72f2864
231276
232277
```html run autorun height="90"
233278
<body style="margin:0">

0 commit comments

Comments
 (0)