[譯] Dweb: 用 WebTorrent 搭建一個可復原的 Web (中英)

原文： hacks.mozilla.org/2018/08/dwe…
做者： Feross Aboukhadijeh   發表時間：August 15, 2018

譯者：西樓聽雨 發表時間：2018/8/20

原文是 Mozilla 開發者網站發佈的關於 Dweb 的概念、應用及使用案例介紹的系列文章中的第三篇。( 轉載請註明出處)

本系列各篇章的翻譯連接以下：

1. [譯] Dweb: 什麼是 Dweb？(中英)
   
2. [譯] Dweb: 基於 Secure Scuttlebutt 的社交消息流 (中英)
   
3. [譯] Dweb: 用 WebTorrent 搭建一個可復原的 Web (中英)
   
4. [譯] Dweb: 基於 Beaker 的去中心化 Web (中英)
   
5. [譯] Dweb: 基於 IPFS 的去中心化 Web 文件系統 (中英)
   
6. 待發布······
   

譯註：如下斜體文本是原文中的編者按

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"> 標籤中。

更多信息

You can learn more at webtorrent.io, or by asking a question in #webtorrent on Freenode IRC or on Gitter. We’re looking for more people who can answer questions and help people with issues on the GitHub issue tracker. If you’re a friendly, helpful person and want an excuse to dig deeper into the torrent protocol or WebRTC, then this is your chance!

你能夠在 webtorrent.io 瞭解更多的信息，你也能夠在 Freenode IRC 及 Gitter 上的 #webtorrent (頻道/主題下)發出提問。咱們正期待有更多的人在 GitHub 的問題跟蹤列表上提交和解答問題。若是你是一位友好、樂於助人的人，而且在找機會深刻挖掘 torrent 協議和/或 WebRTC，那麼如今就是機會！

關於 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