《Electron实战》中文版内容节选，私聊得电子书样本。

2.4.1. Electron的跨域请求

你是不是或多或少感觉到一丝疑惑，你甚至可能会想：“这样根本行不通，你不能向第三方服务器发送请求，浏览器不允许这么做”。

按理说，你是对的，在传统的基于浏览器的应用程序中，不允许客户端代码向其他服务器发送请求。通常是，客户端代码向服务器发送请求，服务器将请求转发给第三方服务器。当收到响应后，再将响应转发回客户端。我们在第1章中就讨论了其中的一些原因。

Electron具有Node服务器端的所有功能以及浏览器的所有功能，这意味着我们可以自由地进行跨域请求，而不需要通过服务器来中转。

使用Electron编写应用程序的另一个好处是，我们能够使用新兴的Fetch API向远程服务器发送请求。Fetch API免去手工设置XMLHttpRequest的麻烦，并为处理请求提供了一个优雅的、基于promise的接口。虽然在编写本文时，Fetch在主流浏览器中得到的支持还很有限，但它在当前Chromium版本中有着完美支持，就是说我们可以使用它。

我们给表单添加一个事件监听，以便在表单提交时能立即执行。因为我们没有服务器，需要确保请求不要被默认地发送出去，我们通过阻止默认行为来达到这个目的。我们还缓存了URL输入框的值以备将来使用。

代码清单2.16 给提交按钮添加事件监听：./app/renderer.js

newLinkForm.addEventListener('submit', (event) => {
event.preventDefault();

    const url = newLinkUrl.value;
    // More code to come…
});

Fetch API是通过一个全局可用的fetch变量进行访问的，获取URL返回一个promise对象，该对象将在浏览器获取到远程资源时兑现。使用这个promise对象，我们可以根据不同的请求类型来处理不同的响应，请求类型包括网页、图像或其他类型的内容。在本例中，我们请求的是网页，因此我们将响应转换成文本，我们先将下面的代码添加到事件监听中。

代码清单2.17 使用Fetch API请求远程资源：./app/renderer.js

fetch(url)
.then(response => response.text()); 

Promises是可链接的，我们可以使用上一个promise的返回值，通过then函数来附加另一个调用。另外，response.text()本身返回的也是一个promise对象。下一步我们会得到接收到的一大堆HTML标签，然后进行解析，并遍历找到<title>元素。

《Electron实战》中文版！