From 7a7ebb7636f59a5da5023058aa532371d09fd065 Mon Sep 17 00:00:00 2001
From: LycheeEng <LycheeEng@hotmail.com>
Date: Fri, 26 Jul 2019 23:28:15 +0800
Subject: [PATCH 1/3] reanme folder

---
 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/article.md     | 0
 .../example.view/index.html                                       | 0
 .../example.view/server.js                                        | 0
 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/hello.txt      | 0
 .../phones-async.view/index.html                                  | 0
 .../phones-async.view/phones.json                                 | 0
 .../phones-async.view/server.js                                   | 0
 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/phones.json    | 0
 .../phones.view/index.html                                        | 0
 .../phones.view/phones.json                                       | 0
 .../phones.view/server.js                                         | 0
 .../{07-xmlhttprequest => 08-xmlhttprequest}/post.view/index.html | 0
 .../{07-xmlhttprequest => 08-xmlhttprequest}/post.view/server.js  | 0
 13 files changed, 0 insertions(+), 0 deletions(-)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/article.md (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/example.view/index.html (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/example.view/server.js (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/hello.txt (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/phones-async.view/index.html (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/phones-async.view/phones.json (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/phones-async.view/server.js (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/phones.json (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/phones.view/index.html (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/phones.view/phones.json (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/phones.view/server.js (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/post.view/index.html (100%)
 rename 5-network/{07-xmlhttprequest => 08-xmlhttprequest}/post.view/server.js (100%)

diff --git a/5-network/07-xmlhttprequest/article.md b/5-network/08-xmlhttprequest/article.md
similarity index 100%
rename from 5-network/07-xmlhttprequest/article.md
rename to 5-network/08-xmlhttprequest/article.md
diff --git a/5-network/07-xmlhttprequest/example.view/index.html b/5-network/08-xmlhttprequest/example.view/index.html
similarity index 100%
rename from 5-network/07-xmlhttprequest/example.view/index.html
rename to 5-network/08-xmlhttprequest/example.view/index.html
diff --git a/5-network/07-xmlhttprequest/example.view/server.js b/5-network/08-xmlhttprequest/example.view/server.js
similarity index 100%
rename from 5-network/07-xmlhttprequest/example.view/server.js
rename to 5-network/08-xmlhttprequest/example.view/server.js
diff --git a/5-network/07-xmlhttprequest/hello.txt b/5-network/08-xmlhttprequest/hello.txt
similarity index 100%
rename from 5-network/07-xmlhttprequest/hello.txt
rename to 5-network/08-xmlhttprequest/hello.txt
diff --git a/5-network/07-xmlhttprequest/phones-async.view/index.html b/5-network/08-xmlhttprequest/phones-async.view/index.html
similarity index 100%
rename from 5-network/07-xmlhttprequest/phones-async.view/index.html
rename to 5-network/08-xmlhttprequest/phones-async.view/index.html
diff --git a/5-network/07-xmlhttprequest/phones-async.view/phones.json b/5-network/08-xmlhttprequest/phones-async.view/phones.json
similarity index 100%
rename from 5-network/07-xmlhttprequest/phones-async.view/phones.json
rename to 5-network/08-xmlhttprequest/phones-async.view/phones.json
diff --git a/5-network/07-xmlhttprequest/phones-async.view/server.js b/5-network/08-xmlhttprequest/phones-async.view/server.js
similarity index 100%
rename from 5-network/07-xmlhttprequest/phones-async.view/server.js
rename to 5-network/08-xmlhttprequest/phones-async.view/server.js
diff --git a/5-network/07-xmlhttprequest/phones.json b/5-network/08-xmlhttprequest/phones.json
similarity index 100%
rename from 5-network/07-xmlhttprequest/phones.json
rename to 5-network/08-xmlhttprequest/phones.json
diff --git a/5-network/07-xmlhttprequest/phones.view/index.html b/5-network/08-xmlhttprequest/phones.view/index.html
similarity index 100%
rename from 5-network/07-xmlhttprequest/phones.view/index.html
rename to 5-network/08-xmlhttprequest/phones.view/index.html
diff --git a/5-network/07-xmlhttprequest/phones.view/phones.json b/5-network/08-xmlhttprequest/phones.view/phones.json
similarity index 100%
rename from 5-network/07-xmlhttprequest/phones.view/phones.json
rename to 5-network/08-xmlhttprequest/phones.view/phones.json
diff --git a/5-network/07-xmlhttprequest/phones.view/server.js b/5-network/08-xmlhttprequest/phones.view/server.js
similarity index 100%
rename from 5-network/07-xmlhttprequest/phones.view/server.js
rename to 5-network/08-xmlhttprequest/phones.view/server.js
diff --git a/5-network/07-xmlhttprequest/post.view/index.html b/5-network/08-xmlhttprequest/post.view/index.html
similarity index 100%
rename from 5-network/07-xmlhttprequest/post.view/index.html
rename to 5-network/08-xmlhttprequest/post.view/index.html
diff --git a/5-network/07-xmlhttprequest/post.view/server.js b/5-network/08-xmlhttprequest/post.view/server.js
similarity index 100%
rename from 5-network/07-xmlhttprequest/post.view/server.js
rename to 5-network/08-xmlhttprequest/post.view/server.js

From fa8965c9f227847e388f1422a89657a8b62e3478 Mon Sep 17 00:00:00 2001
From: LycheeEng <LycheeEng@hotmail.com>
Date: Fri, 26 Jul 2019 23:41:56 +0800
Subject: [PATCH 2/3] sync article.md

---
 5-network/08-xmlhttprequest/article.md | 67 +++++++++++++++++---------
 1 file changed, 44 insertions(+), 23 deletions(-)

diff --git a/5-network/08-xmlhttprequest/article.md b/5-network/08-xmlhttprequest/article.md
index 1f21263f5a..f852a9e73d 100644
--- a/5-network/08-xmlhttprequest/article.md
+++ b/5-network/08-xmlhttprequest/article.md
@@ -12,9 +12,9 @@
 2. 我们需要兼容老旧的浏览器，并且不想用 polyfills（例如为了让脚本更小）。
 3. 我们需要一些 `fetch` 目前无法做到的事情，比如跟踪上传进度。
 
-这些术语听起来都很熟悉是么？如果是那么请继续阅读下面 `XMLHttpRequest` 内容。如果还不是很熟悉的话，那么请先阅读关于 <info:fetch-basics> 的基础内容。
+这些术语听起来都很熟悉是么？如果是那么请继续阅读下面 `XMLHttpRequest` 内容。如果还不是很熟悉的话，那么请先阅读关于 <info:fetch> 的基础内容。
 
-## 基本流程
+## The basics
 
 XMLHttpRequest 有两种执行模式：同步（synchronous） 和 异步（asynchronous）。
 
@@ -22,12 +22,12 @@ XMLHttpRequest 有两种执行模式：同步（synchronous） 和 异步（asyn
 
 发送请求需要 3 个步骤：
 
-1. 创建 `XMLHttpRequest`。
+1. 创建 `XMLHttpRequest`：
     ```js
-    let xhr = new XMLHttpRequest(); // 没有参数
+    let xhr = new XMLHttpRequest(); // the constructor has no arguments
     ```
 
-2. 初始化 `XMLHttpRequest`。
+2. 初始化 `XMLHttpRequest`：
     ```js
     xhr.open(method, URL, [async, user, password])
     ```
@@ -35,7 +35,7 @@ XMLHttpRequest 有两种执行模式：同步（synchronous） 和 异步（asyn
     在 `new XMLHttpRequest` 之后我们通常调用 `xhr.open` 函数。它指定了请求的主要参数：
 
     - `method` — HTTP 方法。通常是 `"GET"` 或者 `"POST"`。
-    - `URL` — 请求的 URL。
+    - `URL` — the URL to request, a string, can be [URL](info:url) object.
     - `async` — 如果显式的设置为 `false`，那么请求将会以同步的方式处理，我们稍后会讨论它。
     - `user`，`password` — HTTP 基本身份认证（如果需要的话）的登录名和密码。
 
@@ -121,21 +121,26 @@ xhr.onerror = function() {
 `response`（以前的脚本可能用的是 `responseText`）
 : 服务器响应。
 
-如果我们改变注意，我们可以随时终止请求。`xhr.abort()` 调用可以做到：
+We can also specify a timeout using the corresponding property:
 
 ```js
-xhr.abort(); // terminate the request
+xhr.timeout = 10000; // timeout in ms, 10 seconds
 ```
 
-它触发 `abort` 事件。
+If the request does not succeed within the given time, it gets canceled and `timeout` event triggers.
 
-我们还可以使用相应的属性设置超时时间：
+````smart header="URL search parameters"
+To pass URL parameters, like `?name=value`, and ensure the proper encoding, we can use [URL](info:url) object:
 
 ```js
-xhr.timeout = 10000; // timeout 单位是 ms，10 秒
+let url = new URL('https://google.com/search');
+url.searchParams.set('q', 'test me!');
+
+// the parameter 'q' is encoded
+xhr.open('GET', url); // https://google.com/search?q=test+me%21
 ```
 
-在给定时间内，如果请求没有成功，`timeout` 事件触发并且请求被取消。
+````
 
 ## 响应类型
 
@@ -203,10 +208,20 @@ xhr.onreadystatechange = function() {
 };
 ```
 
-同样是基于历史原因，在非常老的代码中，你会发现它们使用的是 `readystatechange`。
+You can find `readystatechange` listeners in really old code, it's there for historical reasons, as there was a time when there were no `load` and other events.
 
 如今，它们已被 `load/error/progress` 事件替代。
 
+## Aborting request
+
+We can terminate the request at any time. The call to `xhr.abort()` does that:
+
+```js
+xhr.abort(); // terminate the request
+```
+
+That triggers `abort` event, and `xhr.status` becomes `0`.
+
 ## 同步请求
 
 在 `open` 方法中，如果第三个参数 `async` 被设置为 `false`，那么请求就以同步的方式处理。
@@ -229,7 +244,7 @@ try {
   }
 } catch(err) { // 代替 onerror
   alert("Request failed");
-};
+}
 ```
 
 它可能看起来很不错，但是同步调用很少使用，因为它们会阻塞页面内（in-page）的 JavaScript 直到加载完成。在一些浏览器中，滚动可能无法正常运行。如果一个同步调用执行很长时间，浏览器可能会建议关闭“挂起”（hanging）的页面。
@@ -257,7 +272,7 @@ HTTP-headers 有三种方法：
     一些请求头可能由浏览器专门管理，比如，`Referer` 和 `Host`。
     参见 [规范](http://www.w3.org/TR/XMLHttpRequest/#the-setrequestheader-method) 以获取更多信息。
 
-    为了用户安全和请求的正确性，XMLHttpRequest 不允许修改它们，
+    `XMLHttpRequest` is not allowed to change them, for the sake of user safety and correctness of the request.
     ```
 
     ````warn header="不能移除 header"
@@ -300,6 +315,7 @@ HTTP-headers 有三种方法：
     响应头中的换行符总是 `"\r\n"`（不依赖于操作系统），所以我们可以很轻易地将其分割成单一的响应头部。name 和 value 之间总是会以冒号后跟空格 `": "` 分隔开。这在规范中已经得到修复。
 
     因此，如果我们想要获取具有 name/value 对的对象，我们用一点点 JS 代码来处理它们。
+
     就像这样（假设有两个响应头具有相同的名称，那么后者会覆盖前者）：
 
     ```js
@@ -324,7 +340,7 @@ let formData = new FormData([form]); // 创建对象，可以用表单元素 <fo
 formData.append(name, value); // 追加一个字段
 ```
 
-如果需要，可以从表单中创建它，追加一个字段，然后：
+We create it, optionally from a form, `append` more fields if needed, and then:
 
 1. `xhr.open('POST', ...)` — 使用 `POST` 方法。
 2. `xhr.send(formData)` 发送表单到服务器。
@@ -372,19 +388,19 @@ xhr.setRequestHeader('Content-type', 'application/json; charset=utf-8');
 xhr.send(json);
 ```
 
-`.send(body)` 方法就像一个非常杂食性的动物。它可以发送几乎所有内容，包括 Blob 和 BufferSource 对象。
+`.send(body)` 方法就像一个非常杂食性的动物。它可以发送几乎所有内容，包括 `Blob` 和 `BufferSource` 对象。
 
 ## 上传进度（Upload progress）
 
 `progress` 事件仅仅在下载阶段工作。
 
-也就是说：如果 `POST` 一些内容，`XMLHttpRequest` 首先上传我们的数据，然后下载响应数据。
+也就是说：如果 `POST` 一些内容，`XMLHttpRequest` 首先上传我们的数据（the request body），然后下载响应数据。
 
-如果我们正在上传的文件很大，这时我们肯定对追踪上传进度感兴趣。但是 `progress` 事件在这里并不起作用。
+如果我们正在上传的文件很大，这时我们肯定对追踪上传进度感兴趣。But `xhr.onprogress` doesn't help here.
 
 这里有个其他对象 `xhr.upload`，没有方法，专门用于上传事件。
 
-这是其属性列表：
+The event list is similar to `xhr` events, but `xhr.upload` triggers them on uploading:
 
 - `loadstart` — 上传开始。
 - `progress` — 上传期间定期触发。
@@ -457,6 +473,8 @@ xhr.open('POST', 'http://anywhere.com/request');
 ...
 ```
 
+See the chapter <info:fetch-crossorigin> for details about cross-origin headers.
+
 
 ## 总结
 
@@ -467,7 +485,7 @@ let xhr = new XMLHttpRequest();
 
 xhr.open('GET', 'https://github.com/my/url');
 
-xhr.send(); // 对于 POST，可以发送 string 或 FormData
+xhr.send();
 
 xhr.onload = function() {
   if (xhr.status != 200) { // HTTP 出错？
@@ -497,9 +515,12 @@ xhr.onerror = function() {
 - `error` — 发生连接错误，例如，域名错误。不会响应诸如 404 这类的 HTTP 错误。
 - `load` — 请求成功完成。
 - `timeout` — 请求超时被取消（仅仅发生在 timeout 被设置的情况下）。
-- `loadend` — 请求完成（可能成功也可能失败）。
+- `loadend` — triggers after `load`, `error`, `timeout` or `abort`.
+
+The `error`, `abort`, `timeout`, and `load` events are mutually exclusive. Only one of them may happen.
 
-最常用的事件是加载完成（`load`），加载失败（`error`）以及用来处理进度的 `progress`。
+// 最常用的事件是加载完成（`load`），加载失败（`error`）以及用来处理进度的 `progress`。
+The most used events are load completion (`load`), load failure (`error`), or we can use a single `loadend` handler and check the response to see what happened.
 
 我们还了解了一些其他事件：`readystatechange`。由于历史原因，它在规范建立之前就已经出现。现如今已经没有必要使用他们了，我们可以用新的事件代替它，但是在旧的代码中仍然比较常见。
 

From 375406424bb28384ac43a278974dfecc82aac1ee Mon Sep 17 00:00:00 2001
From: LycheeEng <lycheeEng@hotmail.com>
Date: Sat, 27 Jul 2019 10:57:58 +0800
Subject: [PATCH 3/3] translate article.md

---
 5-network/08-xmlhttprequest/article.md | 47 +++++++++++++-------------
 1 file changed, 23 insertions(+), 24 deletions(-)

diff --git a/5-network/08-xmlhttprequest/article.md b/5-network/08-xmlhttprequest/article.md
index f852a9e73d..1a13c29317 100644
--- a/5-network/08-xmlhttprequest/article.md
+++ b/5-network/08-xmlhttprequest/article.md
@@ -14,7 +14,7 @@
 
 这些术语听起来都很熟悉是么？如果是那么请继续阅读下面 `XMLHttpRequest` 内容。如果还不是很熟悉的话，那么请先阅读关于 <info:fetch> 的基础内容。
 
-## The basics
+## XMLHttpRequest 基础
 
 XMLHttpRequest 有两种执行模式：同步（synchronous） 和 异步（asynchronous）。
 
@@ -24,7 +24,7 @@ XMLHttpRequest 有两种执行模式：同步（synchronous） 和 异步（asyn
 
 1. 创建 `XMLHttpRequest`：
     ```js
-    let xhr = new XMLHttpRequest(); // the constructor has no arguments
+    let xhr = new XMLHttpRequest(); // 构造函数没有参数
     ```
 
 2. 初始化 `XMLHttpRequest`：
@@ -35,7 +35,7 @@ XMLHttpRequest 有两种执行模式：同步（synchronous） 和 异步（asyn
     在 `new XMLHttpRequest` 之后我们通常调用 `xhr.open` 函数。它指定了请求的主要参数：
 
     - `method` — HTTP 方法。通常是 `"GET"` 或者 `"POST"`。
-    - `URL` — the URL to request, a string, can be [URL](info:url) object.
+    - `URL` — 要执行请求（request）的 URL 字符串，可以是 [URL](info:url) 对象。
     - `async` — 如果显式的设置为 `false`，那么请求将会以同步的方式处理，我们稍后会讨论它。
     - `user`，`password` — HTTP 基本身份认证（如果需要的话）的登录名和密码。
 
@@ -121,22 +121,22 @@ xhr.onerror = function() {
 `response`（以前的脚本可能用的是 `responseText`）
 : 服务器响应。
 
-We can also specify a timeout using the corresponding property:
+我们还可以使用相应的属性指定超时（timeout）时间：
 
 ```js
-xhr.timeout = 10000; // timeout in ms, 10 seconds
+xhr.timeout = 10000; // timeout 单位是 ms，此处即 10 秒
 ```
 
-If the request does not succeed within the given time, it gets canceled and `timeout` event triggers.
+如果在给定时间内请求没有成功执行，请求就会被取消，并且触发 `timeout` 事件。
 
-````smart header="URL search parameters"
-To pass URL parameters, like `?name=value`, and ensure the proper encoding, we can use [URL](info:url) object:
+````smart header="URL 搜索参数（URL search parameters）"
+要传递诸如 `?name=value` 这样的 URL 参数，并确保参数被正确编码，我们可以使用 [URL](info:url) 对象：
 
 ```js
 let url = new URL('https://google.com/search');
 url.searchParams.set('q', 'test me!');
 
-// the parameter 'q' is encoded
+// 参数 'q' 被编码
 xhr.open('GET', url); // https://google.com/search?q=test+me%21
 ```
 
@@ -208,19 +208,19 @@ xhr.onreadystatechange = function() {
 };
 ```
 
-You can find `readystatechange` listeners in really old code, it's there for historical reasons, as there was a time when there were no `load` and other events.
+你可能在古老的代码中发现 `readystatechange` 这样的事件监听器，它的存在是基于一些历史原因，因为在很长一段时间内都没有 `load` 以及其他事件。
 
 如今，它们已被 `load/error/progress` 事件替代。
 
-## Aborting request
+## 终止请求（aborting）
 
-We can terminate the request at any time. The call to `xhr.abort()` does that:
+我们可以随时终止请求。调用 `xhr.abort()` 即可：
 
 ```js
-xhr.abort(); // terminate the request
+xhr.abort(); // 终止请求
 ```
 
-That triggers `abort` event, and `xhr.status` becomes `0`.
+它将会触发 `abort` 事件且 `xhr.status` 变为 `0`。
 
 ## 同步请求
 
@@ -272,7 +272,7 @@ HTTP-headers 有三种方法：
     一些请求头可能由浏览器专门管理，比如，`Referer` 和 `Host`。
     参见 [规范](http://www.w3.org/TR/XMLHttpRequest/#the-setrequestheader-method) 以获取更多信息。
 
-    `XMLHttpRequest` is not allowed to change them, for the sake of user safety and correctness of the request.
+    为了用户安全和请求的正确性，`XMLHttpRequest` 不允许修改请求头。
     ```
 
     ````warn header="不能移除 header"
@@ -340,7 +340,7 @@ let formData = new FormData([form]); // 创建对象，可以用表单元素 <fo
 formData.append(name, value); // 追加一个字段
 ```
 
-We create it, optionally from a form, `append` more fields if needed, and then:
+我们可以从一个表单中创建它，如果需要的话还可以`追加（append）`更多的字段：
 
 1. `xhr.open('POST', ...)` — 使用 `POST` 方法。
 2. `xhr.send(formData)` 发送表单到服务器。
@@ -394,13 +394,13 @@ xhr.send(json);
 
 `progress` 事件仅仅在下载阶段工作。
 
-也就是说：如果 `POST` 一些内容，`XMLHttpRequest` 首先上传我们的数据（the request body），然后下载响应数据。
+也就是说：如果 `POST` 一些内容，`XMLHttpRequest` 首先上传我们的数据（请求体（request body）），然后下载响应数据。
 
-如果我们正在上传的文件很大，这时我们肯定对追踪上传进度感兴趣。But `xhr.onprogress` doesn't help here.
+如果我们正在上传的文件很大，这时我们肯定对追踪上传进度感兴趣。但是 `xhr.onprogress` 在这里并不起作用。
 
 这里有个其他对象 `xhr.upload`，没有方法，专门用于上传事件。
 
-The event list is similar to `xhr` events, but `xhr.upload` triggers them on uploading:
+XMLHttpRequest 事件和 `xhr` 类似，但是 `xhr.upload` 可以在上传阶段被触发：
 
 - `loadstart` — 上传开始。
 - `progress` — 上传期间定期触发。
@@ -473,7 +473,7 @@ xhr.open('POST', 'http://anywhere.com/request');
 ...
 ```
 
-See the chapter <info:fetch-crossorigin> for details about cross-origin headers.
+参见 <info:fetch-crossorigin> 章节以了解更多关于 cross-origin headers 的信息。
 
 
 ## 总结
@@ -515,12 +515,11 @@ xhr.onerror = function() {
 - `error` — 发生连接错误，例如，域名错误。不会响应诸如 404 这类的 HTTP 错误。
 - `load` — 请求成功完成。
 - `timeout` — 请求超时被取消（仅仅发生在 timeout 被设置的情况下）。
-- `loadend` — triggers after `load`, `error`, `timeout` or `abort`.
+- `loadend` — 在 `load`，`error`，`timeout` 或者 `abort` 之后触发。
 
-The `error`, `abort`, `timeout`, and `load` events are mutually exclusive. Only one of them may happen.
+`error`，`abort`，`timeout` 和 `load` 事件是互斥的，即一次只能有一个事件发生。
 
-// 最常用的事件是加载完成（`load`），加载失败（`error`）以及用来处理进度的 `progress`。
-The most used events are load completion (`load`), load failure (`error`), or we can use a single `loadend` handler and check the response to see what happened.
+最常用的事件是加载完成（load completion）（`load`），加载失败（load failure）（`error`），或者我们可以只用 `loadend` 处理程序来检查响应，看看其发生了什么。
 
 我们还了解了一些其他事件：`readystatechange`。由于历史原因，它在规范建立之前就已经出现。现如今已经没有必要使用他们了，我们可以用新的事件代替它，但是在旧的代码中仍然比较常见。