跳到主要内容

Electron 2 中的新功能:应用内购买

·阅读时长 2 分钟

新的 Electron 2.0 发布线 packed 包含了许多新特性和修复。此新主要版本的一大亮点是 Apple Mac App Store 的新 inAppPurchase API


应用内购买使用户可以直接在应用内购买内容或订阅。这为开发者提供了一种简单的方式来采用 免费增值商业模式,用户可以免费下载应用,然后可以选择应用内购买高级功能、额外内容或订阅。

这个新 API 由社区贡献者 Adrien Fery 添加到 Electron 中,以在用于讲座和会议的笔记类 Electron 应用 Amanote 中启用应用内购买。Amanote 免费下载,允许将清晰、结构化的笔记添加到 PDF 中,并带有数学公式、绘图、录音等功能。

自从在 Mac 版 Amanote 中添加应用内购买支持后,Adrien 注意到 **销售额增长了 40%**!

入门

新的 inAppPurchase API 已经包含在最新的 Electron beta 版本中

npm i -D electron@beta

该 API 的文档可以在 GitHub 上找到,Adrien 也非常友好地写了一个关于如何使用该 API 的教程。要开始在你的应用中添加应用内购买,请 参阅本教程

该 API 的更多 改进 正在进行中,很快将在即将发布的 Electron beta 版本中推出。

Windows 可能紧随其后

接下来,Adrien 希望通过在 Electron 中添加对 Microsoft Store 应用内购买的支持,为 Amanote 开辟新的收入渠道。敬请关注这方面的进展!

Webview 漏洞修复

·阅读时长 2 分钟

已发现一个漏洞,该漏洞允许在一些禁用 Node.js 集成的 Electron 应用程序中重新启用 Node.js 集成。该漏洞已被分配 CVE 标识符 CVE-2018-1000136


受影响的应用

如果应用满足以下 *所有* 条件,则会受到影响

  1. 运行在 Electron 1.7、1.8 或 2.0.0-beta 版本上
  2. 允许执行任意远程代码
  3. 禁用了 Node.js 集成
  4. 在其 webPreferences 中未明确声明 webviewTag: false
  5. 未启用 nativeWindowOption 选项
  6. 未拦截 new-window 事件,并且在未使用提供的 options tag 的情况下手动覆盖 event.newGuest

尽管这似乎只影响了少数 Electron 应用程序,我们仍建议所有应用程序作为预防措施进行升级。

缓解措施

此漏洞已在今天发布的 1.7.131.8.42.0.0-beta.5 版本中得到修复。

无法升级其应用程序 Electron 版本的开发者可以使用以下代码来缓解此漏洞

app.on('web-contents-created', (event, win) => {
win.on(
'new-window',
(event, newURL, frameName, disposition, options, additionalFeatures) => {
if (!options.webPreferences) options.webPreferences = {};
options.webPreferences.nodeIntegration = false;
options.webPreferences.nodeIntegrationInWorker = false;
options.webPreferences.webviewTag = false;
delete options.webPreferences.preload;
},
);
});

// and *IF* you don't use WebViews at all,
// you might also want
app.on('web-contents-created', (event, win) => {
win.on('will-attach-webview', (event, webPreferences, params) => {
event.preventDefault();
});
});

更多信息

该漏洞由 Trustwave SpiderLabs 的 Brendan Scarvell 发现并负责任地报告给了 Electron 项目组。

要了解有关保持 Electron 应用安全性的最佳实践,请参阅我们的 安全教程

要报告 Electron 中的漏洞,请发送电子邮件至 security@electronjs.org

请加入我们的 电子邮件列表 以接收关于版本发布和安全更新的通知。

网站小故障

·阅读时长 2 分钟

上周 electronjs.org 网站出现了几分钟的宕机。如果您受到了这些短暂中断的影响,我们深表歉意。经过今天的一番调查,我们已经诊断出根本原因并部署了 修复程序


为了防止未来发生此类宕机,我们已在应用上启用了 Heroku 阈值警报。当我们的 Web 服务器累积的失败请求或缓慢响应超出特定阈值时,我们的团队将收到通知,以便我们能够快速解决问题。

提供所有语言的离线文档

下次当您在飞机上或地下咖啡馆开发 Electron 应用时,您可能希望拥有文档副本以供离线查阅。幸运的是,Electron 的文档以 Markdown 文件的形式提供,并且有 20 多种语言版本。

git clone https://github.com/electron/electron-i18n
ls electron-i18n/content

带有 GUI 的离线文档

devdocs.io/electron 是一个便捷的网站,它存储了用于离线使用的文档,不仅包括 Electron,还包括许多其他项目,如 JavaScript、TypeScript、Node.js、React、Angular 等等。当然,也有一个相应的 Electron 应用。请访问 Electron 网站查看 devdocs-app

devdocs-app

如果您喜欢不使用鼠标或触控板来安装应用,可以尝试 Electron Forgeinstall 命令

npx electron-forge install egoist/devdocs-app

协议处理程序漏洞修复

·阅读时长 2 分钟

已发现一个远程代码执行漏洞,该漏洞影响使用自定义协议处理程序的 Electron 应用。该漏洞已被分配 CVE 标识符 CVE-2018-1000006


受影响的平台

设计用于在 Windows 上运行并注册自身为某个协议(例如 myapp://)的默认处理程序的 Electron 应用易受此漏洞影响。

无论协议如何注册,例如使用原生代码、Windows 注册表或 Electron 的 app.setAsDefaultProtocolClient API,此类应用都可能受到影响。

macOS 和 Linux **不受此问题影响**。

缓解措施

我们已发布包含此漏洞修复的新版本 Electron:1.8.2-beta.51.7.121.6.17。我们敦促所有 Electron 开发者立即将其应用更新到最新的稳定版本。

如果由于某些原因无法升级 Electron 版本,您可以在调用 app.setAsDefaultProtocolClient 时将 -- 作为最后一个参数附加,这将阻止 Chromium 解析更多选项。双破折号 -- 表示命令选项的结束,之后只接受位置参数。

app.setAsDefaultProtocolClient(protocol, process.execPath, [
'--your-switches-here',
'--',
]);

有关更多详细信息,请参阅 app.setAsDefaultProtocolClient API。

要了解有关保持 Electron 应用安全性的最佳实践,请参阅我们的 安全教程

如果您希望报告 Electron 中的漏洞,请发送电子邮件至 security@electronjs.org

Electron 2.0 及以后 - 语义化版本控制

·阅读时长 1 分钟

Electron 的一个新主要版本正在开发中,同时我们的版本控制策略也将有所改变。从 2.0.0 版本开始,Electron 将严格遵守语义化版本控制(Semantic Versioning)。


此更改意味着您将更频繁地看到主要版本号的增加,这通常是 Chromium 的重大更新。补丁版本也将更稳定,因为它们现在将只包含错误修复,不包含新功能。

主要版本递增

  • Chromium 版本更新
  • Node.js 主要版本更新
  • Electron 破坏性 API 更改

次要版本递增

  • Node.js 次要版本更新
  • Electron 非破坏性 API 更改

补丁版本递增

  • Node.js 补丁版本更新
  • 与修复相关的 chromium 补丁
  • Electron 错误修复

由于 Electron 的 semver 范围现在将更具意义,我们建议使用 npm 默认的 --save-dev 标志安装 Electron,这将在您的版本号前加上 ^,使您能够安全地接收次要版本和补丁版本的更新

npm install --save-dev electron

对于只对错误修复感兴趣的开发者,您应该使用波浪号 semver 前缀,例如 ~2.0.0,这将永远不会引入新功能,只包含用于提高稳定性的修复。

有关更多详细信息,请参阅 electronjs.org/docs/tutorial/electron-versioning

Electron 新的国际化网站

·阅读时长 6 分钟

Electron 有了一个新网站:electronjs.org!我们用 Node.js Web 服务器取代了之前的静态 Jekyll 站点,这为我们带来了站点国际化的灵活性,并为更多令人兴奋的新功能铺平了道路。


🌍 翻译

我们已经启动了网站国际化进程,目标是让 Electron 应用开发能够惠及全球开发者。我们正在使用一个名为 Crowdin 的本地化平台,该平台与 GitHub 集成,随着内容被翻译成不同语言,它会自动创建和更新拉取请求。

Electron Nav in Simplified Chinese

尽管我们迄今为止一直在悄悄进行这项工作,但已经有超过 75 位 Electron 社区成员自然地发现了该项目,并加入了国际化网站和将 Electron 文档翻译成 20 多种语言的工作。我们看到了来自世界各地的人们的 日常贡献,其中法语、越南语、印度尼西亚语和中文等语言的翻译进展突出。

要选择您的语言并查看翻译进度,请访问 electronjs.org/languages

Translations in progress on Crowdin

如果您是多语言用户并有兴趣帮助翻译 Electron 的文档和网站,请访问 electron/electron-i18n 仓库,或者直接在 Crowdin 上开始翻译,您可以使用您的 GitHub 帐户登录。

目前在 Crowdin 上为 Electron 项目启用了 21 种语言。添加对更多语言的支持很容易,因此如果您有兴趣帮助翻译但未看到您的语言列表,请 告知我们,我们将启用它。

原始翻译文档

如果您更喜欢阅读原始 Markdown 文件格式的文档,您现在可以用任何语言做到这一点

git clone https://github.com/electron/electron-i18n
ls electron-i18n/content

应用页面

截至今天,任何 Electron 应用都可以轻松在 Electron 网站上拥有自己的页面。例如,请查看 Etcher1ClipboardGraphQL Playground,这里展示的是网站日语版本上的图片

GraphQL Playground

市面上有一些令人难以置信的 Electron 应用,但它们并不总是很容易找到,而且并非所有开发者都有时间或资源构建一个合适的网站来推广和分发他们的应用。

仅使用 一个 PNG 图标文件和少量应用元数据,我们就能够收集有关给定应用的许多信息。利用从 GitHub 收集的数据,应用页面现在可以显示每个拥有公共仓库的应用的截图、下载链接、版本、发布说明和 README 文件。使用从每个应用图标中提取的调色板,我们可以生成 醒目且易于访问的颜色,从而为每个应用页面带来视觉上的区分度。

应用索引页面 现在还包含分类和关键词过滤器,用于查找诸如 GraphQL GUIp2p 工具 等有趣的应用。

如果您有 Electron 应用并希望在网站上展示,请在 electron/electron-apps 仓库中打开拉取请求。

使用 Homebrew 一行安装

macOS 的包管理器 Homebrew 有一个名为 cask 的子命令,它使得在终端中使用单个命令(例如 brew cask install atom)轻松安装桌面应用成为可能。

我们已经开始收集流行 Electron 应用的 Homebrew cask 名称,并现在在每个拥有 cask 的应用页面上显示安装命令(面向 macOS 访问者)

Installation options tailored for your platform: macOS, Windows, Linux

要查看所有拥有 homebrew cask 名称的应用,请访问 electronjs.org/apps?q=homebrew。如果您知道我们尚未索引的其他拥有 cask 的应用,请 添加它们

🌐 新域名

我们已将站点从 electron.atom.io 迁移到新域名:electronjs.org

Electron 项目诞生于 GitHub 的开源文本编辑器 Atom 中,Atom 是基于 Web 技术构建的。Electron 最初被称为 atom-shell。Atom 是第一个使用它的应用,但很快人们就意识到这个神奇的 Chromium + Node 运行时可以用于各种不同的应用。当微软和 Slack 等公司开始使用 atom-shell 时,很明显该项目需要一个新的名称。

于是,“Electron”应运而生。2016 年初,GitHub 组建了一个新团队,专门负责 Electron 的开发和维护,独立于 Atom。自那时起,Electron 已被数千名应用开发者采用,并受到许多大型公司的依赖,其中许多公司都有自己的 Electron 团队。

支持 GitHub 的 Electron 项目,如 Atom 和 GitHub Desktop,仍然是我们团队的优先事项,但通过迁移到新域名,我们希望有助于阐明 Atom 和 Electron 之间的技术区别。

🐢🚀 Node.js 无处不在

之前的 Electron 网站是使用流行的基于 Ruby 的静态网站生成器 Jekyll 构建的。Jekyll 是一个构建静态网站的优秀工具,但该网站已经开始超出它的能力范围。我们需要更强大的动态功能,例如适当的重定向和动态内容渲染,因此选择 Node.js 服务器是显而易见的。

Electron 生态系统中的项目包含用许多不同编程语言编写的组件,从 Python 到 C++ 再到 Bash。但 JavaScript 是 Electron 的基础,也是我们社区中使用最多的语言。

通过将网站从 Ruby 迁移到 Node.js,我们旨在降低希望为网站贡献代码的人员的入门门槛。

⚡️ 更轻松的开源参与

如果您的系统上安装了 Node.js(8 或更高版本)和 git,您可以轻松地在本地运行该网站

git clone https://github.com/electron/electronjs.org
cd electronjs.org
npm install
npm run dev

新网站托管在 Heroku 上。我们使用部署流水线和 Review Apps 功能,该功能会自动为每个拉取请求创建一个正在运行的应用副本。这使得审阅者可以轻松地在站点的实时副本上查看拉取请求的实际效果。

🙏 感谢贡献者

我们要特别感谢世界各地所有投入时间和精力帮助改进 Electron 的人们。开源社区的热情对 Electron 的成功做出了不可估量的贡献。谢谢你们!

Thumbs up!

Chromium RCE 漏洞修复

·阅读时长 1 分钟

Google Chromium 中发现了一个远程代码执行漏洞,该漏洞影响所有最近版本的 Electron。任何访问远程内容的 Electron 应用都容易受到此漏洞攻击,无论是否启用了 沙盒选项

我们已发布两个新版本 Electron 1.7.81.6.14,这两个版本都包含了此漏洞的修复。我们敦促所有 Electron 开发者立即将其应用更新到最新的稳定版本

npm i electron@latest --save-dev

要了解有关保持 Electron 应用安全性的最佳实践,请参阅我们的 安全教程

如果您希望报告 Electron 中的漏洞,请联系 security@electronjs.org

宣布 Electron 支持 TypeScript

·阅读时长 4 分钟

electron npm 包现在包含一个 TypeScript 定义文件,该文件提供了整个 Electron API 的详细注解。即使您正在编写 **纯 JavaScript**,这些注解也能改善您的 Electron 开发体验。只需运行 npm install electron 即可在您的项目中获取最新的 Electron 类型定义。


TypeScript 是由 Microsoft 创建的一种开源编程语言。它是 JavaScript 的超集,通过添加对静态类型的支持来扩展该语言。近年来,TypeScript 社区迅速发展,并在最近的 Stack Overflow 开发者调查中被列为 最受欢迎的编程语言 之一。TypeScript 被描述为“可扩展的 JavaScript”,GitHubSlackMicrosoft 的团队都在使用它来编写被数百万人使用的可扩展 Electron 应用。

TypeScript 支持 JavaScript 中许多较新的语言特性,例如类、对象解构和 async/await,但其真正的差异化特性是 **类型注解**。声明程序预期的输入和输出数据类型可以帮助您在编译时发现错误,从而 减少错误,并且注解也可以作为 程序工作方式 的正式声明。

当库使用纯 JavaScript 编写时,类型在编写文档时通常是事后模糊定义的。函数通常可以接受比文档中更多类型的参数,或者函数可能存在文档中没有提及的隐式约束,这可能导致运行时错误。

TypeScript 通过 **定义文件** 解决了这个问题。TypeScript 定义文件描述了库的所有函数及其预期的输入和输出类型。当库作者将 TypeScript 定义文件与其发布的库捆绑在一起时,该库的使用者可以 直接在编辑器中探索其 API 并立即开始使用,通常无需查阅库的文档。

许多流行项目,如 AngularVue.jsnode-github(现在还有 Electron!),会编译自己的定义文件并将其与其发布的 npm 包捆绑在一起。对于不捆绑自己的定义文件的项目,存在 DefinitelyTyped,这是一个由社区维护的第三方定义文件生态系统。

安装

从 1.6.10 版本开始,每个发布的 Electron 都包含其自己的 TypeScript 定义文件。当您从 npm 安装 electron 包时,electron.d.ts 文件会自动随安装包一起捆绑。

安装 Electron 最 安全的方式 是使用精确的版本号

npm install electron --save-dev --save-exact

或者如果您使用 yarn

yarn add electron --dev --exact

如果您已经使用了第三方定义文件,例如 @types/electron@types/node,您应该将它们从您的 Electron 项目中移除,以避免任何冲突。

定义文件派生自我们的 结构化 API 文档,因此它将始终与 Electron 的 API 文档 保持一致。只需安装 electron,您将始终获得与您使用的 Electron 版本同步的 TypeScript 定义文件。

使用方法

有关如何安装和使用 Electron 新的 TypeScript 注解的摘要,请观看这个简短的演示视频

如果您正在使用 Visual Studio Code,它已内置了 TypeScript 支持。此外,还有社区维护的用于 AtomSublimevim其他编辑器 的插件。

一旦您的编辑器配置了 TypeScript,您将开始看到更多上下文感知行为,例如自动完成建议、内联方法引用、参数检查等等。

Method autocompletion

Method reference

Argument checking

TypeScript 入门

如果您刚接触 TypeScript 并想了解更多信息,这个 Microsoft 提供的入门视频 很好地概述了为什么创建这门语言、它是如何工作的、如何使用它以及未来的发展方向。

官方 TypeScript 网站上还有一个 手册 和一个 演练场

由于 TypeScript 是 JavaScript 的超集,您现有的 JavaScript 代码已经是有效的 TypeScript 代码。这意味着您可以将现有的 JavaScript 项目逐步过渡到 TypeScript,根据需要逐渐加入新的语言特性。

致谢

如果没有 Electron 开源维护者社区的帮助,这个项目是不可能实现的。感谢 Samuel AttardFelix RiesebergBirunthan MohanathasMilan BurdaBrendan Forster 以及许多其他人的错误修复、文档改进和技术指导。

支持

如果您在使用 Electron 新的 TypeScript 定义文件时遇到任何问题,请在 electron-typescript-definitions 仓库中提交一个议题。

愉快地使用 TypeScript 吧!

本周项目:Jasper

·阅读时长 5 分钟

本周我们采访了 Jasper 的创建者,这是一个基于 Electron 构建的 GitHub 通知管理工具。


你好!你是谁?

我是 Ryo Maruyama,一名在日本的软件开发者。我正在开发 JasperESDoc

Jasper 是什么?

Jasper 是一个灵活强大的 GitHub 议题阅读器。它支持 github.com 和 GitHub Enterprise 上的议题和拉取请求。

Jasper App Screenshot

你为什么要创建它?

当人们在工作或 OSS 活动中使用 GitHub 时,他们每天都会收到很多通知。作为订阅通知的一种方式,GitHub 提供了电子邮件和网络通知。我使用这些方式已经好几年了,但我遇到了以下问题:

  • 很容易忽略那些提到我、我评论过或我正在关注的议题。
  • 我会把一些议题记在脑子里稍后查看,但有时会忘记。
  • 为了不忘记议题,我在浏览器中打开了许多标签页。
  • 很难查看所有与我相关的议题。
  • 很难掌握我团队的所有活动。

我花费了很多时间和精力来防止这些问题,所以我决定为 GitHub 创建一个议题阅读器,以高效地解决这些问题,并开始开发 Jasper。

谁在使用 Jasper?

使用 GitHub 的几家公司的开发者、设计师和经理都在使用 Jasper。当然,一些 OSS 开发者也在使用它。GitHub 的一些人也在使用它!

Jasper 如何工作?

配置好 Jasper 后,会出现以下屏幕。从左到右,你可以看到“流列表”、“议题列表”和“议题主体”。

Jasper Start Screen

这个“流”是 Jasper 的核心功能。例如,如果你想查看“在 electron/electron 仓库中分配给 @zeke 的议题”,你就创建以下流:

repo:electron/electron assignee:zeke is:issue

Jasper Start Screen 2

创建流并等待几秒钟后,你就可以看到符合条件的议题了。

Jasper Start Screen 3

我们可以用流做什么?

我将介绍流可以使用的条件类型。

用户和团队

议题
mentions:cat mentions:dog提到用户 catdog 的议题
author:cat author:dog由用户 catdog 创建的议题
assignee:cat assignee:dog分配给 catdog 的议题
commenter:cat commenter:dogcatdog 评论过的议题
involves:cat involves:dog涉及 catbob 的议题
team:animal/white-cat team:animal/black-dog提到 animal/white-catanimal/black-dog 的议题

involves 表示 mentionauthorassigneecommenter

仓库和组织

议题
repo:cat/jump repo:dog/runcat/jumpdog/run 中的议题
org:electron user:cat user:dogelectroncatdog 中的议题

orguser 相同

属性

议题
repo:cat/jump milestone:v1.0.0 milestone:v1.0.1附加到 cat/jumpv1.0.0v1.0.1 的议题
repo:cat/jump label:bug label:blocker附加到 cat/jumpbug **和** blocker 的议题
electron OR atomshell包含 electronatomshell 的议题

审查状态

议题
is:pr review:requiredcat/jump 中需要审查的议题
is:pr review-requested:catcat 请求审查的议题。
但这些尚未被审查。
is:pr reviewed-by:cat已由 cat 审查的议题

正如你可能通过查看这些条件注意到的,流可以使用 GitHub 的搜索查询。有关如何使用流和搜索查询的详细信息,请参阅以下 URL。

Jasper 还具有未读议题管理、未读评论管理、标记星标、通知更新、议题过滤、键盘快捷键等功能。

Jasper 是付费产品吗?价格是多少?

Jasper 的价格是 12 美元。不过你可以使用 免费试用版 30 天。

你为什么选择在 Electron 上构建 Jasper?

我喜欢 Electron 的以下方面:

  • 应用可以使用 JavaScript/CSS/HTML 开发。
  • 应用可以构建到 Windows、Mac 和 Linux 平台。
  • Electron 正在积极开发中,并且有一个庞大的社区。

这些功能使得桌面应用开发快速而简单。太棒了!如果你有任何产品想法,务必考虑使用 Electron。

你在开发 Jasper 时遇到过哪些挑战?

我在理解“流”这个概念上遇到了困难。起初,我考虑使用 GitHub 的通知 API。但我注意到它不支持某些用例。之后,我考虑在通知 API 的基础上使用议题 API拉取请求 API。但它从未达到我想要的效果。然后,在思考各种方法时,我意识到轮询 GitHub 的搜索 API 将提供最大的灵活性。达到这一点花了大约一个月的实验时间,然后我花了两天时间用流的概念实现了一个 Jasper 的原型。

注:轮询最多每 10 秒进行一次。这对于 GitHub API 的限制来说足够可以接受。

接下来有什么计划?

我计划开发以下功能:

  • 过滤流:一个流有一些过滤后的流,它们会过滤流中的议题。这就像 SQL 的视图。
  • 多个账户:你将可以使用 github.com 和 GHE。
  • 提升性能:目前在 WebView 中加载议题的速度比普通浏览器慢。

在 Twitter 上关注 @jasperappio 获取更新。

本周项目:WebTorrent

·阅读时长 9 分钟

本周我们采访了 @feross@dcposch,与他们谈论了 WebTorrent,一个由网络驱动的 torrent 客户端,它连接用户以形成一个分布式、去中心化的浏览器到浏览器网络。


WebTorrent 是什么?

WebTorrent 是第一个可以在浏览器中工作的 torrent 客户端。它完全用 JavaScript 编写,并可以使用 WebRTC 进行点对点传输。不需要浏览器插件、扩展或安装。

利用开放网络标准,WebTorrent 将网站用户连接在一起,形成一个分布式、去中心化的浏览器到浏览器网络,以实现高效的文件传输。

你可以在这里看到 WebTorrent 的实际演示:webtorrent.io

webtorrent homepage

这为什么很酷?

想象一个像 YouTube 这样的视频网站,但访问者帮助托管网站的内容。使用 WebTorrent 驱动的网站的人越多,它就会变得越快、越有弹性。

浏览器到浏览器的通信消除了中间环节,让人们可以按自己的方式进行通信。不再是客户端/服务器——而是一个对等网络,所有对等节点都是平等的。WebTorrent 是迈向 Web 去中心化的第一步。

Electron 是如何参与其中的?

大约一年前,我们决定构建 WebTorrent Desktop,一个作为桌面应用运行的 WebTorrent 版本。

WebTorrent Desktop player window

我们创建 WebTorrent Desktop 有三个原因:

  1. 我们想要一个干净、轻量、无广告、开源的 torrent 应用。
  2. 我们想要一个支持良好流媒体的 torrent 应用。
  3. 我们需要一个“混合客户端”,连接 BitTorrent 和 WebTorrent 网络。

如果我已经在网络浏览器中可以下载 torrent 了,为什么还需要一个桌面应用?

首先,介绍一下 WebTorrent 的设计背景。

webtorrent desktop logo

早期,BitTorrent 使用 TCP 作为其传输协议。后来,uTP 出现,承诺比 TCP 更好的性能和额外的优势。最终每个主流 torrent 客户端都采用了 uTP,如今你可以在 TCP 或 uTP 协议上使用 BitTorrent。WebRTC 协议是下一个合乎逻辑的步骤。它带来了与网络浏览器互操作性的承诺——一个由所有桌面 BitTorrent 客户端和数百万网络浏览器组成的巨大 P2P 网络。

“网络对等节点”(在网络浏览器中运行的 torrent 对等节点)通过增加数百万新的对等节点,并将 BitTorrent 传播到数十个新的用例中,从而增强了 BitTorrent 网络。WebTorrent 尽可能紧密地遵循 BitTorrent 规范,以便现有 BitTorrent 客户端轻松添加对 WebTorrent 的支持。

一些 torrent 应用,如 Vuze,已经支持网络对等节点,但我们不想等待其他应用添加支持。所以基本上,WebTorrent Desktop 是我们加速 WebTorrent 协议普及的方式。通过创建一个人们真正想要使用的出色的 torrent 应用,我们增加了网络中可以与网络对等节点(即网站用户)共享 torrent 的对等节点数量。

除了人们已经知道的用途之外,torrent 还有哪些有趣的用例?

WebTorrent 最令人兴奋的用途之一是点对点辅助分发。像 维基百科互联网档案馆这样的非营利项目可以通过让访问者贡献带宽来减少带宽和托管成本。流行内容可以快速、便宜地通过浏览器到浏览器的方式提供服务。不经常访问的内容可以从源服务器通过 HTTP 可靠地提供服务。

互联网档案馆实际上已经更新了他们的 torrent 文件,以便它们能与 WebTorrent 很好地配合。因此,如果你想在你的网站上嵌入互联网档案馆的内容,你可以这样做,这可以减少互联网档案馆的托管成本,让他们能够把更多资金投入到实际的网络存档工作中!

也有一些令人兴奋的商业用例,从 CDN 到通过 P2P 分发应用。

有哪些你喜欢的、使用 WebTorrent 的项目?

gaia app screenshot

用 WebTorrent 构建的最酷的东西,毫无疑问,可能是 Gaia 3D 星图。这是一个流畅的银河系 3D 交互式模拟。数据直接在你的浏览器中从 torrent 加载。在我们的星系中穿梭,意识到我们人类与宇宙的浩瀚相比是多么渺小,这令人敬畏。

你可以在 Torrenting The Galaxy 中阅读有关它是如何制作的,这是一篇博客文章,作者 Charlie Hoey 解释了他如何使用 WebGL 和 WebTorrent 构建星图。

brave logo

我们也是 Brave 的忠实粉丝。Brave 是一个自动拦截广告和跟踪器以使网络更快更安全的浏览器。Brave 最近添加了 torrent 支持,所以你可以在不使用单独应用的情况下查看传统 torrent。这个功能由 WebTorrent 提供支持。

所以,就像大多数浏览器可以渲染 PDF 文件一样,Brave 可以渲染磁力链接和 torrent 文件。它们只是浏览器原生支持的另一种类型的内容。

Brave 的联合创始人之一实际上是 Brendan Eich,JavaScript 的创造者,而 WebTorrent 就是用 JavaScript 编写的,所以我们认为 Brave 选择集成 WebTorrent 是非常酷的事情。

你为什么选择在 Electron 上构建 WebTorrent Desktop?

WebTorrent Desktop main window

有一种说法认为 Electron 应用是“臃肿的”,因为它们在每个应用中都包含了整个 Chrome 内容模块。在某些情况下,这部分属实(一个 Electron 应用安装程序通常约 40MB,而 OS 特定的应用安装程序通常约 20MB)。

然而,对于 WebTorrent Desktop 来说,我们在正常操作过程中使用了几乎所有的 Electron 功能以及几十种 Chrome 功能。如果我们想为每个平台从头实现这些功能,构建我们的应用将需要多几个月甚至几年的时间,或者我们只能发布到单个平台。

举个例子,我们使用了 Electron 的 Dock 集成(显示下载进度)、菜单栏集成(在后台运行)、协议处理程序注册(打开磁力链接)、电源阻止器(防止视频播放期间休眠)和自动更新器。至于 Chrome 功能,我们使用了不少:<video> 标签(播放多种视频格式)、<track> 标签(支持字幕)、拖放支持以及 WebRTC(这在原生应用中使用并非易事)。

更不用说:我们的 torrent 引擎是用 JavaScript 编写的,并假定存在大量的 Node API,特别是用于 TCP 和 UDP socket 支持的 require('net')require('dgram')

基本上,Electron 正是我们所需要的,并且拥有我们在创纪录的时间内发布一个稳定、精致的应用所需的全部功能集合。

你最喜欢 Electron 的哪些地方?

WebTorrent 库作为一个开源副项目已经开发了两年。我们在四周内就构建了 WebTorrent Desktop。Electron 是我们能够如此快速地构建和发布应用的主要原因。

正如 Node.js 使使用 jQuery 的前端程序员可以进行服务器端编程一样,Electron 也使熟悉 Web 或 Node.js 开发的任何人都可以进行原生应用开发。Electron 极大地赋能开发者。

网站和桌面客户端是否共享代码?

是的,webtorrent npm 包可以在 Node.js、浏览器和 Electron 中工作。完全相同的代码可以在所有环境中运行——这就是 JavaScript 的美妙之处。它是当今通用的运行时。Java Applets 曾承诺实现“一次编写,随处运行”,但由于多种原因,这个愿景从未真正实现。Electron 比任何其他平台都更接近那个理想。

你在构建 WebTorrent 时遇到过哪些挑战?

在应用的早期版本中,我们努力使 UI 保持高性能。我们将 torrent 引擎放在与主应用窗口相同的渲染进程中,可想而知,当 torrent 引擎出现密集 CPU 活动时(比如验证从对等节点收到的 torrent 片段),就会导致运行缓慢。

我们通过将 torrent 引擎移动到第二个不可见的渲染进程中来解决这个问题,我们通过 IPC 与其通信。这样,即使该进程短暂地使用了大量 CPU,UI 线程也不会受到影响。顺畅无比的滚动和动画令人非常满意。

注意:我们不得不将 torrent 引擎放在渲染进程中,而不是“主”进程中,因为我们需要访问 WebRTC(这仅在渲染器中可用)。

Electron 在哪些方面需要改进?

我们非常希望看到关于如何构建和发布可用于生产环境的应用的更好文档,特别是在代码签名和自动更新等棘手主题方面。我们不得不通过深入研究源代码并在 Twitter 上咨询来学习最佳实践!

WebTorrent Desktop 完成了吗?如果没有,接下来有什么计划?

我们认为当前版本的 WebTorrent Desktop 非常出色,但总有改进的空间。我们目前正在努力改进其精致度、性能、字幕支持和视频编解码器支持。

如果你有兴趣参与该项目,请查看我们的 GitHub 页面

有没有对其他开发者有用的 Electron 开发技巧?

Feross 是 WebTorrent Desktop 的贡献者之一,他最近在 NodeConf Argentina 发表了一场名为《现实世界中的 Electron:用 JavaScript 构建跨平台桌面应用》的演讲,其中包含发布一款精致 Electron 应用的实用技巧。如果你处于已有一个基本工作应用并正尝试将其提升到更高水平的精致度和专业度的阶段,这场演讲尤其有用。

观看这里:

幻灯片这里:

DC,另一位 WebTorrent 贡献者,写了一篇关于如何让你的 Electron 应用看起来更吸引人的清单。它附带了代码示例,涵盖了 macOS Dock 集成、拖放、桌面通知以及确保你的应用快速加载等方面。