[译] Dweb: 用 WebTorrent 搭建一个可复原的 Web (中英)

原文：hacks.mozilla.org/2018/08/dwe…
作者：Feross Aboukhadijeh发表时间：August 15, 2018

译者：西楼听雨 发表时间：2018/8/20

原文是 Mozilla 开发者网站发布的关于 Dweb 的概念、应用及使用案例介绍的系列文章中的第三篇。(转载请注明出处)

本系列各篇章的翻译链接如下：

[译] Dweb: 什么是 Dweb？(中英)
[译] Dweb: 基于 Secure Scuttlebutt 的社交消息流 (中英)
[译] Dweb: 用 WebTorrent 搭建一个可复原的 Web (中英)
[译] Dweb: 基于 Beaker 的去中心化 Web (中英)
[译] Dweb: 基于 IPFS 的去中心化 Web 文件系统 (中英)
待发布······

译注：以下斜体文本是原文中的编者按

In this series we are covering projects that explore what is possible when the web becomes decentralized or distributed. These projects aren’t affiliated with Mozilla, and some of them rewrite the rules of how we think about a web browser. What they have in common: These projects are open source, and open for participation, and share Mozilla’s mission to keep the web open and accessible for all.

在这个系列中，我们会讲到一些正在尝试探索在 Web 变为去中心化或分布式的时候存在哪些可能性的项目，这些项目不附属于 Mozilla，其中一些项目还重新定义了我们对 web 浏览器的认识。他们都有共同点：这些项目都是开源的，开放参与的，并且和 Mozilla ”keep the web open and accessible for all (让 Web 对所有人保持开放和可访问)“ 的宗旨一致。

The web is healthy when the financial cost of self-expression isn’t a barrier. In this installment of the Dweb series we’ll learn about WebTorrent – an implementation of the BitTorrent protocol that runs in web browsers. This approach to serving files means that websites can scale with as many users as are simultaneously viewing the website – removing the cost of running centralized servers at data centers. The post is written by Feross Aboukhadijeh, the creator of WebTorrent, co-founder of PeerCDN and a prolific NPM module author… 225 modules at last count! –Dietrich Ayala

当自我表达所需的经济代价不再是一种障碍时，Web 就是健康的。在这个系列的本次讲解中，我们将了解到的是 WebTorrent ——一种运行在浏览器中的 BitTorrent 协议的实现。这种供应文件的方式可以让网站在同时查看网站的用户量无论有多大的情况下都保持着伸缩性——(这可以)节省运行在数据中心的中心式服务器的运营代价。

什么是 WebTorrent ？

WebTorrent is the first torrent client that works in the browser. It’s written completely in JavaScript – the language of the web – and uses WebRTC for true peer-to-peer transport. No browser plugin, extension, or installation is required.

WebTorrent 是第一款运行在浏览器中的 torrent 客户端。它完全是用 JavaScript ——也就是 Web 所使用的语言——编写的，使用的是 WebRTC 来进行真实的点对点传输。没借助浏览器插件、扩展，也无需额外安装其他东西。

Using open web standards, WebTorrent connects website users together to form a distributed, decentralized browser-to-browser network for efficient file transfer. The more people use a WebTorrent-powered website, the faster and more resilient it becomes.

借助各种开放的 Web 标准，WebTorrent 得以将网站的用户连接到一起，组成一张具备高效文件传输能力的“浏览器对浏览器”的分布式、去中心化的网络。一个基于 WebTorrent 的网站，其使用的人越多，它的速度就越快，可复原性也越强。

架构

The WebTorrent protocol works just like BitTorrent protocol, except it uses WebRTC instead of TCP or uTP as the transport protocol.

WebTorrent 协议的工作机制和 BitTorrent 协议一样，除了它使用的是 WebRTC 而不是 TCP 或者 uTP 作为传输协议外。

In order to support WebRTC’s connection model, we made a few changes to the tracker protocol. Therefore, a browser-based WebTorrent client or “web peer” can only connect to other clients that support WebTorrent/WebRTC.

为了能支持 WebRTC 的连接模型，我们对(torrent 的) tracker 协议做了一些修改。这样，一个基于浏览器的 WebTorrent 客户端——或者说是 “web peer”—— 就可以与其他支持 WebTorrent 及 WebRTC 的客户端建立连接。

Once peers are connected, the wire protocol used to communicate is exactly the same as in normal BitTorrent. This should make it easy for existing popular torrent clients like Transmission, and uTorrent to add support for WebTorrent. Vuze already has support for WebTorrent!

一旦点与点之间建立了连接，(基于该连接之上的)用于通讯的协议就和常规的 BitTorrent 的没有区别了。这可以让已有的各主流的 torrent 客户端——如 Transmission、uTorrent——在增加对 WebTorrent 的支持时变得容易。——Vuze 已经实现了对 WebTorrent 的支持！

开始

It only takes a few lines of code to download a torrent in the browser!

在浏览器中下载一个 torrent 文件只需要几行代码就可以做到！

To start using WebTorrent, simply include the webtorrent.min.js script on your page. You can download the script from the WebTorrent website or link to the CDN copy.

要使用 WebTorrent，只需在你的页面中将 weborrent.min.js 脚本文件引用进来即可。你可以从 WebTorrent 的网站上下载(这个文件)或者将链接指向到一个 CDN 副本。

<script src="webtorrent.min.js"></script>复制代码

This provides a WebTorrent function on the window object. There is also an npm package available.

这样之后，它会在 Window 对象上提供一个 WebTorrent 函数(供使用)。此外还有 npm 包可用。

var client = new WebTorrent()

// Sintel, a free, Creative Commons movie
// 《辛特尔》，一部免费，采用“知识共享”(许可协议)的电影
var torrentId = 'magnet:...' // Real torrent ids are much longer. // 真实的 torrent id 远比这个长

var torrent = client.add(torrentId)

torrent.on('ready', () => {
// Torrents can contain many files. Let's use the .mp4 file
// 一个种子文件可以包含许多个文件。这里我们只使用 .mp4 文件
var file = torrent.files.find(file => file.name.endsWith('.mp4'))// Display the file by adding it to the DOM.// Supports video, audio, image files, and more!// 把他添加到 DOM 中进行展示。// 支持视频、音频、图像文件等等！file.appendTo('body')
})复制代码

That’s it! Now you’ll see the torrent streaming into a <video width="300" height="150"> tag in the webpage!

就这样！现在你就可以在网页中看到这个 torrent 被灌输到了 <video width="300" height="150"> 标签中。

关于 Feross Aboukhadijeh

Feross writes popular open source software including WebTorrent, StandardJS, and hundreds of Node.js packages (collectively 200+ million downloads per month). He recently released a fun site called BitMidi that curates MIDI files for your listening pleasure! His open source work is supported by generous donors on Patreon.

Feross 编写了许多流行的开源软件的，包括 WebTorrent、StandardJS，以及几百份的 Node.js 包(每月总计 2 亿多次的下载量)。最近，他发布了一个名为 BitMidi 的有趣的网站，这个网站组织了许多的 MIDI 文件，可以为你带来听觉享受！他的开源事业都是由 Patreon 上慷慨的捐助者们所支持的。

他的主页：feross.org

他的Twitter: @feross