还是不能免俗, 做了个文件传输工具(支持 P2P)

2018-08-16 13:54:47 +08:00
 edwardwo

介绍

前端 React, 后端 Golang(基本都是 stdlib 中的 pkg, 没有用到框架). 本人去年还写了个 P2P 文件传输工具simple-filer, 因此一并将此功能整合到网站中. 只要发送 /接受方同时打开同一张页面, 就可以实现 P2P 传输. (注意: P2P 传输只支持 Chrome 浏览器)

使用

只需把页面 URL 发给你的好友, 他 /她就能看到你上传的文件, 你不需要等到上传完毕再发 URL, 所有打开该页面的用户都能实时看到上传进度. 你也可以打开多个 tabs 页体验一下.

由于是个人小网站, 带宽 /磁盘资源有限, 一个页面最多只能上传 4 个文件, 每个最大 5M, 页面有效期 20 分钟, 过了后, 相应的文件都删除, 页面的 URL 也会失效(返回 404). 对于 P2P 传输, 由于底层用到了 Chrome 浏览器的 FileSystem API, 文件直接写入 sandboxed filesystem, 因此没有文件大小 /个数的限制. 只要接受方硬盘足够大, 10G 也可以传输. 只要多人同时打开一张页面, 他们的昵称就会出现在页面左侧下方, 选中, 即可发送文件.

P2P 连接并非 100%的情况下都能建立, 只要一方位于比较严格的防火墙背后, 就无法建立, 此时你好友的昵称呈灰色无法选中. 但在局域网中, P2P 几乎 100%都能连接, 因此非常适合部署在办公室内, 以满足临时传输大文件这种需求.

7779 次点击
所在节点    分享创造
17 条回复
s2555
2018-08-16 15:07:23 +08:00
已 star
BugProducer
2018-08-16 19:32:40 +08:00
办公室临时传输大文件,我选 QQ...
oska117
2018-08-16 19:43:26 +08:00
谢谢,研究一下
Tink
2018-08-16 22:29:01 +08:00
类似于 filepizza ?
c247327248
2018-08-17 02:11:51 +08:00
有点意思
qdwang
2018-08-17 07:10:54 +08:00
需要本地开一个服务吗
cnTangLang
2018-08-17 09:14:02 +08:00
不错,这个对远程团队有价值
edwardwo
2018-08-17 09:30:52 +08:00
@Tink FilePizza 底层也是用 webRTC 实现 P2P 传输的, 数据不经过服务端, 因此它需要发送方的页面一直打开, 直到接受方收完为止. 由于 FilePizza 还支持 Firefox, 因此我觉得传输的文件不能大于接受方内存允许的大小. 而我的 app 仅支持 Chrome(有个 FileSystem API, 可以把数据直接写入硬盘), 因此可以传输超大文件.

@qdwang 这个应用本身就是一个服务, 只需占据一个端口即可. 安装部署步骤如下:
首先要安装如下软件:
Golang (>= 1.9.2), 需要设置 $GOPATH 环境变量
MongoDB (>= 3.2)
NodeJS (>=6.5) 客户端 JS 文件打包之用

下载安装:
go get github.com/edwardwohaijun/file-transfer/cmd/filetransferd
cd $GOPATH/src/github.com/edwardwohaijun/file-transfer/
go build -o filetransferd cmd/filetransferd/main.go

cd web
npm install
npm run build (适用于开发, 测试环境)
npm run ship (适用于生产环境)
cd ..
./filetransferd 直接运行编译后的可执行文件即可, 虽然有 10 几个参数, 但都有默认值.
打开 Chrome 访问: http://127.0.0.1/9090

后端的代码几乎都是针对"上传文件"这个功能, 如果你仅仅想实现 P2P 传输, 可以使用我的另外一个 JavaScript library: simple filer ( https://github.com/edwardwohaijun/simple-filer ), 直接 import 到你的项目中即可.
qdwang
2018-08-17 11:55:45 +08:00
好的 谢谢
886106
2018-08-17 12:03:51 +08:00
这个可以配合 VPS 使用么?还有上传文件最大支持多大? 感谢
edwardwo
2018-08-17 15:04:27 +08:00
@886106 当然可以, 我就是部署在青云的服务器上. 上传文件的个数和大小, 取决于 2 个参数值: maxUpload(单个页面最多允许上传多少文件), maxFileSize(单个文件允许多大, 如: 20m, 5M), 我的小网站, 带宽 /磁盘有限, 因而只允许最大上传 5M 的文件.
github 上我增加了一个中文的 readme.md:
https://github.com/edwardwohaijun/file-transfer/blob/master/README_cn.md
页面上有详细说明.
886106
2018-08-18 15:49:14 +08:00
@edwardwo 收到感谢
pagxir
2018-08-18 16:22:08 +08:00
qdwang
2018-08-19 06:31:09 +08:00
lz 我还想问问看,你这个支持的浏览器,是不是 ios11 以上和安卓的 chrome 都支持啊?
qdwang
2018-08-19 06:31:20 +08:00
ios 的 safari
edwardwo
2018-08-19 10:45:55 +08:00
@qdwang 很遗憾, 不支持 iOS, 目前这个 P2P 功能只支持桌面 Chrome. webRTC 虽然是 w3c 标准, Firefox, Safari 11(桌面, iOS)都支持了. 但我的 app 主要是以文件传输为主, 为了能传输超大文件, 底层用到了 Filesystem API, 这个不是 w3c 标准, 是 Google 自己倒腾出来的. 而 iOS 平台上的 Chrome 浏览器, 底层的 rendering 和 javascript 引擎用的是 Apple 的引擎(Apple 就是这么规定的: 在我的平台上必须用我的技术.). 因此, 也不支持这个 API.

如果我不用 filesystem API 的话, 理论上到是可以支持全平台(桌面 /iOS/android), 但这样只能传输小文件, 而且底层有许多兼容性问题, 开发工作量也非常巨大.
webRTC 除了可以发文件(底层用了 data channel), 还有个很帅的功能(视频聊天), 这个目前几乎是全平台都支持了. 我在想要不要把这个功能加在我的这个网站上呢.
qdwang
2018-08-19 12:52:01 +08:00
@edwardwo 感谢回复。我看了你这个文章,就去也研究了一下 webrtc。但是我发现在 ios 11 的 safari 上面,没法获取 candidates。这样就没法通讯了。ios 12 好像可以。不知道为什么。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/480378

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX