V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
pikay
V2EX  ›  分享创造

突破浏览器极限:我花了 4 年时间,开发了一个在浏览器上运行的操作系统!

  •  5
     
  •   pikay · 4 天前 · 11632 次点击

    大家好,我是 pikay 。四年前我在 V2EX 上发过一个帖子(《想做一个操作系统,问问大家意见》),用了很多业余时间和非业余时间,终于把它搞出来了!它叫 NoneOS,现在已经有了一个初步可用的 Demo ,现在就分享出来给大家试试看。(记得挂梯子)

    https://os.tutous.com/

    这个系统有什么特别之处?

    很简单,你只需要一个现代浏览器,打开它的域名,点几下“下一步”,就能在你的浏览器里完成安装。下次再访问这个网址,就能直接进入这个虚拟操作系统了。

    而且,它完全不需要动态服务器。整个系统运行在纯静态环境下,也就是说,不怕服务器挂掉,它就是存在你本地的。安装完成后,你可以断开网络试试,也是可以正常使用的。

    它依赖的是浏览器自带的 File System API 来存储数据,包括系统本身运行所需的文件也都是存在浏览器本地的。这意味着你可以直接在这个系统里运行 Web App ,以后开发应用再也不需要部署到服务器上,直接丢进这个系统就能跑。可以查看 packages/apps 目录,是系统自带的应用。

    那系统里的应用怎么交换数据呢?

    系统内置了一套应用间的数据交互 API。只要是在这个系统上开发的应用,都可以通过这套接口和其他设备上的应用进行通信。

    举个例子,如果你有一台手机和一台电脑,就可以先在 NoneOS 里配对这两个设备。等系统启动后,它们之间会自动通过 WebRTC 技术 建立连接。这样一来,应用之间就不需要自己再去搭服务器了,直接调用这套 API 就能传输数据,不仅省掉了服务器成本,速度还特别快。

    在这个系统上开发的应用有什么好处?

    最大的优势就是——不用管服务器的事。没有服务器,也就意味着几乎没有维护成本。

    为什么我会想做这个东西?

    因为我觉得现在开发一个联网应用的成本实在太高了。哪怕只是一个很简单的应用,你也得经历一堆繁琐流程:

    • 准备服务器 / 租虚拟主机
    • 要买域名
    • 绑定域名和服务器
    • 开发前端页面
    • 再写后端逻辑
    • 前后端打通
    • 部署上线
    • 后续还要花钱维持服务器

    这一整套流程下来,不仅麻烦,而且花销不小。

    但如果你用的是 NoneOS ,这些步骤统统可以跳过。你只需要:

    • 打开浏览器,装上这个系统
    • 在系统上开发应用
    • 利用系统提供的 API 实现数据交互
    • 然后直接上线使用

    我现在能拿它干啥?

    目前系统已经自带了一个非常实用的小工具 —— 网页收藏夹应用。你可以把平时喜欢的网站都收藏进去,支持跨设备同步。无论你在电脑、手机还是平板上,彼此访问设备间的数据。

    你可以轻松地将设备中的文件导入到这个虚拟系统,借助系统内置的文件管理器,跨设备传输文件。

    而且因为它不依赖服务器,所以这个收藏夹没有广告,也不会偷偷改你的数据或者泄露隐私,完全是属于你自己的小空间。

    接下来有什么计划?

    接下来我们会陆续加入更多功能,比如笔记与知识管理应用,让你可以在各个设备上快速同步和整理知识。

    之后还会完善开发文档,让更多的开发者能够快速上手,在这个系统上开发自己的应用。

    目标是让它成为前端界的 Docker ,让那些原本需要复杂部署的前端应用,也能被小白用户一键安装、轻松使用。

    NoneOS 短期小目标是,把这个系统打造成一个私人设备联动平台,有点像 NAS 那样的私有云系统。让你的手机、电脑、平板之间可以自由地交换数据。比如电脑可以直接查看手机里的文件,手机也能远程播放电脑里的视频,真正实现多设备无缝协作。

    如果你想体验一下,欢迎去试用这个 Demo ,有任何建议或反馈也欢迎留言告诉我!我们一起把这个系统做得更好!

    反馈地址: https://github.com/kirakiray/NoneOS/issues

    第 1 条附言  ·  4 天前
    哎真的不懂,为什么被改到推广板块了,不过是用 AI 润色一下,看起来像是推广文而已。这东西又是开源的没有盈利的,发出来是为了给 4 年前的帖子填坑。是标题起错了吗,还是板块选错了?能不能改回来?
    第 2 条附言  ·  3 天前
    感谢各位的支持,我会根据大家留下的宝贵意见,不断的迭代下去,就像 4 年前那样。等优化到下一个好用的阶段,我再来这里发帖给大家试试。

    感谢管理员将帖子重新挪出了推广 tag ,下次我知道发分享创造 tag 了。
    123 条回复    2025-06-16 09:35:29 +08:00
    1  2  
    lasuar
        1
    lasuar  
       4 天前
    支持,已体验,已反馈
    irrigate2554
        2
    irrigate2554  
       4 天前
    emmm ,现在大体上似乎没大用,技术上可以试试对 Emscripten 进行适配,这样可以把很多现有项目编译到你的系统上,但是整体上受限于浏览器环境本身,上限就在那里了。
    iamvvv
        3
    iamvvv  
       4 天前
    pikay
        4
    pikay  
    OP
       4 天前
    @lasuar 感谢
    xhslyf
        5
    xhslyf  
       4 天前
    挺好玩的,但就像楼上说的,上限受制于浏览器。
    whwq2012
        6
    whwq2012  
       4 天前
    访问一些需要依赖 activex 或者 flash 才能访问的网页,这个能实现吗
    pikay
        7
    pikay  
    OP
       4 天前   ❤️ 1
    @iamvvv 这个之前玩过,那个系统只是玩的,我这个是要做成私人 NAS 系统。😂
    dsb2468
        8
    dsb2468  
       4 天前
    Dock 为啥只能左和下,能允许设置放到右边么?毕竟关闭按钮在右边,往右更方便些
    mrwangjustsay
        9
    mrwangjustsay  
       4 天前
    Reficul
        10
    Reficul  
       4 天前
    这个和本地 App 有什么区别呢?
    gophlet
        11
    gophlet  
       4 天前
    其实浏览器本身就类似于一个操作系统
    gophlet
        12
    gophlet  
       4 天前
    挺新奇的,赞!
    pikay
        13
    pikay  
    OP
       4 天前
    @xhslyf 是的,后面有打算给它包一个 Tauri ,拿到系统文件。这样打开应用就能做成一个 NAS 系统。
    还有一个是给 chrome 加一个 showOpenFilePicker 功能,打开浏览器,直接选择本地文件夹,就形成一个 NAS 系统。
    MoeDisk
        14
    MoeDisk  
       4 天前
    火钳刘明
    pikay
        15
    pikay  
    OP
       4 天前
    @whwq2012 我就是想要做成这样的东西,能够实现。先看看社区反馈和手头的进度。
    pikay
        16
    pikay  
    OP
       4 天前
    @dsb2468 😂 因为我没想到,先做着左边和下边的。其实还有很多具体定制,例如应用框按钮靠左靠右之类的,还没时间做,先把它做成实用性的 NAS ,后面慢慢加功能。
    pikay
        17
    pikay  
    OP
       4 天前
    @mrwangjustsay 这个虚拟 linux 知道,但是我并不是想做这种从机器码开始虚拟的操作系统,是想做类似 Firefox OS 的 Gaia 层的东西,或者 chrome os 的应用虚拟层。 😂
    pikay
        18
    pikay  
    OP
       4 天前
    @make17better 是的,我知道国内外有好多名人说过,浏览器本身就是操作系统。
    sosme
        19
    sosme  
       4 天前
    让我想到了 chrome os
    ppxppx
        20
    ppxppx  
       4 天前
    提个 issue ,重复打开 web favirotes 会导致 body 上的 click 事件处理一直添加,应该是关闭的时候哪里没释放导致的泄漏
    Martens
        21
    Martens  
       4 天前   ❤️ 1
    如何给这个操作系统开发应用呢?比如说开发一个浏览器
    Felldeadbird
        22
    Felldeadbird  
       4 天前
    让你的手机、电脑、平板之间可以自由地交换数据

    我还是没搞懂。如果我电脑在家,人在外。手机和电脑互联需要 服务器吧。
    sentinelK
        23
    sentinelK  
       4 天前   ❤️ 2
    完全没有 get 到这个产品的 feature 在哪里……

    web 应用又不是必须租云产品才能用……
    924412409
        24
    924412409  
       4 天前
    是纯内网才行吗,两个设备不在同一个网络环境下该如何通信
    flyqie
        25
    flyqie  
       4 天前 via Android
    webos 又添一员

    好奇 webrtc 的信令怎么传,手动复制?
    zephyru
        26
    zephyru  
       4 天前
    @Felldeadbird 正文里有说,配对后用 WebRTC 做同步,我理解原理类似 p2p 打洞,有些视频监控喜欢用这种方式通信,问题就是国内网络大都在好几层 NAT 后面,可用性不高
    pikay
        27
    pikay  
    OP
       4 天前
    @sosme 是的,我现在就是仿着 chrome os 做的版本。
    hichao
        28
    hichao  
       4 天前
    为啥我查不到另外一个设备,俩设备握手服务器都是连通的
    pikay
        29
    pikay  
    OP
       4 天前
    @ppxppx 🙏 感谢,我赶紧修一下
    TimPeake
        30
    TimPeake  
       4 天前
    UI 风格挺不错的
    pikay
        31
    pikay  
    OP
       4 天前
    @hichao 试试关闭梯子,因为 rtc 信道交换有梯子会导致失败。
    jasonkayzk
        32
    jasonkayzk  
       4 天前
    有点意思,已 star ,OP 加油!
    pikay
        33
    pikay  
    OP
       4 天前
    @Felldeadbird 利用浏览器 webRTC 的底层 api ,数据通过点对点的方式联通,所以不需要服务器。
    pikay
        34
    pikay  
    OP
       4 天前
    @Martens 这个已经想好了,已经是在浏览器内的系统,就不需要在开发“浏览器”了。浏览器的本质是看其他地方的数据,所以只需要考虑怎么传输和展示其他人的数据。
    如果要开发 app ,可以参考这个 https://github.com/kirakiray/NoneOS/tree/main/others/hello-world.napp
    CodeCodeStudy
        35
    CodeCodeStudy  
       4 天前
    可以放到一个不需要挂梯子里吗?
    pikay
        36
    pikay  
    OP
       4 天前
    @924412409 不是,外网也行,但底层 webRTC 需要打洞;在一个内网下打洞基本成功,如果外网,可能需要看运营商会不会屏蔽打洞的 API 。我用电信网络,手机电信 5g 和电脑 wifi 可以打洞成功。考虑以后也可能会做个免费转发用的服务器,如果这产品用的人多的话。
    meeop
        37
    meeop  
       4 天前
    希望能把代码开源,而且一定要提供 app 的开发文档
    不然没有 app 的系统是没用的,而闭源的话即便开发了 app ,过几天你的服务不可用了 app 也就不可用了
    pikay
        38
    pikay  
    OP
       4 天前
    @meeop 开源的,纯静态服务器就可以部署了。
    https://github.com/kirakiray/NoneOS/tree/main
    iwh718
        39
    iwh718  
       4 天前 via Android
    star 了,关注一下。
    fionasit007
        40
    fionasit007  
       4 天前
    能开发出来很强,但是我用手机,还是多开浏览器都没成功过,设备可以添加成功,但是收藏书签和文件传输哪里没有设备,手机 ui 兼容性有点问题,要是两个设备连接成功,是不是关了浏览器服务就会断开啊
    fionasit007
        41
    fionasit007  
       4 天前
    @fionasit007 #40 还有是不是清楚 cookie 所有配置都没了啊,比如开无痕的时候
    pikay
        42
    pikay  
    OP
       4 天前
    @sentinelK 如果需要应用间交互数据,就要买个云产品了。。。我这个是想填补不使用动态服务器的情况下,也做到应用间的数据交互的市场。
    shiny
        43
    shiny  
       4 天前
    怎么连右键也没有,我想右键点“刷新” [doge]
    Baratheon
        44
    Baratheon  
       4 天前
    该系统为什么不提供浏览器?
    pikay
        45
    pikay  
    OP
       4 天前
    😭 @fionasit007 是不是用 Safari ?要从设置里面,把防追踪之类的关掉。因为 safari 对隐私很关注,每次打开新标签,只会让一些最基础的数据留存,系统初始化的文件可能会失效,隐私模式就更不用说了。可能要尝试换个浏览器。

    手机 UI 兼容可能会有些问题。因为使用的是 webRTC api ,必须在网页的环境下使用,关闭标签连接就会断开,但是应用同步过的数据会保留,下次打开还能用。
    pikay
        46
    pikay  
    OP
       4 天前
    @flyqie 系统里有个握手服务器,就专门负责传递信令。
    fionasit007
        47
    fionasit007  
       4 天前
    @pikay 没有,就是 Chrome 和 Edge ,那这样感觉有点尴尬啊,也不能常驻后台,想用还得专门打开,不如直接写个 web 服务算了
    pikay
        48
    pikay  
    OP
       4 天前
    @CodeCodeStudy 可能要过一段时间才能部署国内的站点,因为要备案什么的很麻烦,还要花钱买。如果你有静态空间的话,也可以部署: https://github.com/kirakiray/NoneOS/tree/main
    pikay
        49
    pikay  
    OP
       4 天前
    @Baratheon 是不是安装的时候不支持该浏览器?因为需要用到 file system api ,比较旧的浏览器没有这个 api ,所以不支持。可以尝试更新浏览器或者换个新的浏览器。
    elltor
        50
    elltor  
       4 天前
    不错 好玩👍👍👍
    520discuz
        51
    520discuz  
       4 天前
    牛人啊,本地话的东西你怎么盈利呢,如果删除浏览器缓存会影响使用吗
    Gilfoyle26
        52
    Gilfoyle26  
       4 天前
    @Martens #21 好好好,套娃是吧
    Ghouler
        53
    Ghouler  
       4 天前 via Android   ❤️ 1
    建议联系谷歌,这个在 chromeos 感觉有用武之地
    pikay
        54
    pikay  
    OP
       4 天前
    @520discuz 删除本地缓存会把虚拟系统删掉的,使用协议上有写。😂
    我预期的计划后期会非常赚钱,但现在会先饿死;现在前期没什么好方法赚钱,话说现在搞众筹有没有用?
    phrack
        55
    phrack  
       4 天前   ❤️ 1
    东西非常酷。

    以下完全是个人 rant 。

    不过浏览器不该再突破极限了,而是该限制上限了。现代浏览器搞了太多不是浏览器的东西,各种 specification 过于复杂,导致进入这个市场越来越困难,chrome 一家独大根本没有竞争了,Google 强推各种 specification 根本没人挡的住。

    就拿这个项目来说,如果要重新实现一个浏览器来支持这个项目,复杂度对于社区来说已经是不现实的程度。
    nomagick
        56
    nomagick  
       4 天前
    有一说一,这个不能叫操作系统,叫 web 桌面还差不多
    Keine
        57
    Keine  
       4 天前
    操作动画有点卡顿 能不能提供一个 Pro 选项 调用本地资源渲染动画操作
    lukaz
        58
    lukaz  
       4 天前
    有点意思,操作很丝滑,star 了
    sakujo
        59
    sakujo  
       4 天前
    真有意思 赞一个
    bowencool
        60
    bowencool  
       4 天前
    还是没搞懂,什么叫节省服务器直接上线?
    xiaoming1992
        61
    xiaoming1992  
       4 天前
    bug: 上传一张图片并查看之后,一直报错:文件 `/$apps/1.jpg/app.json` 内容非法:内容为 `Error: 目录 apps/1.jpg/ 不存在...`。导致所有 app 都加载不出来。

    bug 背景:上传一张图片后,双击没反应,只能右键->打开方式->图片,然后打开,倒是打开了,但是刷新之后,devtools 就报上述 error 。
    restkhz
        62
    restkhz  
       4 天前
    火钳刘明
    这个概念挺有意思
    pikay
        63
    pikay  
    OP
       4 天前
    @fionasit007 可以常驻后台的,我明天加个重连机制。
    pikay
        64
    pikay  
    OP
       4 天前
    @phrack 是的,其实我做这东西的概念,十几年前就有人做过了,就是当初的浏览器不够强,可以翻查一下我 4 年前发的帖子: https://ex.noerr.eu.org/t/814224
    pikay
        65
    pikay  
    OP
       4 天前
    @nomagick web 桌面只是方便 demo ,它其实是一套 runtime 。
    pikay
        66
    pikay  
    OP
       4 天前
    @ppxppx 修复了
    HTravel
        67
    HTravel  
       4 天前
    但问题是,现在安卓手机就能做 NAS 啊。termux 支持 JDK21 ,我就基于这个,把我自己写的同步、备份、快照,外加 web 版浏览文件、看视频、小说、听音乐、浏览图片的代码完整在安卓手机上跑起来了。手机本身就已经是全功能的 NAS 。手机与其他手机、电脑交换数据既可以用 web 版的浏览文件,也可以用 web 版的同步功能。而且同一套代码可以部署在 macOS 、windows 、linux 上。比如我家群晖 DS920 、威联通 453Dmini ,我就通过原生支持的 docker 同样把我这套代码部署上去用了。

    这怎么也比在浏览器中运行好。而且代码更通用,一套代码,除了目前不能跨 iOS ,其他 OS 全跨。
    pikay
        68
    pikay  
    OP
       4 天前
    @xiaoming1992 🙏感谢反馈,apps 目录是用来存放应用的目录,没有试过上传应用以外的东西,我现在修一下。
    QMore
        69
    QMore  
       4 天前
    还能这么玩
    ikenneth
        70
    ikenneth  
       4 天前
    支持,已 star 。但不得不说 udp 传输会被 QoS ;同步需要两台设备都开机且依赖本地数据和浏览器之间的数据交换;我个人是屏蔽掉 webrtc 使用浏览器的。
    cjh1095358798
        71
    cjh1095358798  
       4 天前
    看了但是没想到咋用,但是支持很厉害
    kuan0025
        72
    kuan0025  
       4 天前
    有意思,有想法,有行动力,赞👍
    pikay
        73
    pikay  
    OP
       4 天前
    @xiaoming1992 已修复问题,从设置里更新系统到 3.0.14 后就能解决了。🙏
    pikay
        74
    pikay  
    OP
       4 天前
    @HTravel 😂 看起来很 geek ,我的测试内网服务器也是放在家里的 termux 上的,就安装错误排查我都不想吐槽了。
    我想做的 NoneOS 这个东西,是一个让普通人,不需要折腾,打开浏览器,点击几下,就能实现你说的这些功能。我后面打算基于 chrome 的 showDirectoryPicker ,就可以让浏览器读取系统的真实目录文件了,这样初始化 NAS 服务器,连应用程序都不需要安装。
    Lenic
        75
    Lenic  
       4 天前
    我之前也想过,不过东西太多了……
    pikay
        76
    pikay  
    OP
       4 天前
    @ikenneth 以后会在加一套非 webrtc 的转发方案做补充。
    pikay
        77
    pikay  
    OP
       4 天前
    @bowencool 就是不需要动态服务器,应用和应用之间直接交换数据,联网应用通过 p2p 传播。
    pikay
        78
    pikay  
    OP
       4 天前
    @zephyru 后面会搞个解决这个问题的方案。
    me007
        79
    me007  
       4 天前
    不过,实用性无啊。 浏览器的在套系统,X 掉就什么都没了,这说是系统,不如说是沙箱。用后即毁,不专业的直接浏览器无痕,专业的 linux ...
    pikay
        80
    pikay  
    OP
       4 天前
    @me007 不会的,你安装成功后可以尝试断网打开,系统还是在的。而且系统文件是通过 github.io 更新的,而且有三个更新文件的节点。可以理解是沙箱,或者说是容器,现在还没有杀手级应用而已。
    mayli
        81
    mayli  
       4 天前 via Android
    因为没看到怎么突破浏览器极限的
    所以感觉有点不靠谱
    life90
        82
    life90  
       4 天前 via iPhone
    我就说个冷知识,浏览器自带的截图功能可以跳过某些公司部署的水印。
    HTravel
        83
    HTravel  
       4 天前
    @pikay 因为我在实现 NAS 功能时,只用到了 JDK21 ,数据库等其他常见的服务根本没用。再就是视频、图片分别用到了 ffmpeg 、imagemagick 。恰好这三个都有完善的 termux 支持,所以迁移到 termux 时很容易,直接就跑起来了,只是发现代码有些写法在 termux 中由于限权显的抛出的异常不合理,比如无法获取机器名。所以代码再加点逻辑就行了,基本上没改什么代码。

    其实你这个你自己都在安装时的说明里说了,浏览器会时不时自己清存储。这个永远改不了,永远是你的方案解决不了的“bug”。虽然你的方案也能通过同步机制实现数据存储在多个浏览器上的多副本,但每一个副本都不知道哪天就被突然清理了,也不知道浏览器是否只清理一部分,校验、恢复副本完整性就是个头痛的问题。浏览器的缓存清理机制,就决定了用浏览器缓存做存储技术上不可行。而且浏览器必然继续走越来越严格的沙盒路线,想随意访问本地任意磁盘路径存取文件不现实。

    你的方案如果能长期坚持下去,最终必然会搭配一个服务端,浏览器必然会再次回到自己的 UI 角色上来。B/S 方案是唯一的方案,精简不到仅剩 B 。这也是我长期思考过的,我以前就是用 Java 做桌面端工具来跨所有平台,后来发现跨平台最好的方案就是浏览器。一个新的操作系统可能连安装第三方软件都不支持,比如鸿蒙,但它肯定支持浏览器。只要支持浏览器,甚至不需要网络通,我的方案就能跑。我认为没法再精简了。微信小程序是第三大操作系统了,也证实了这点
    HTravel
        84
    HTravel  
       4 天前
    @pikay 还有一点。NAS 必须支持快照,因为没有历史版本功能的 NAS 没意义。而快照就要求历史数据不可变,随意清缓存就决定了快照机制不可用。
    ziyanghua
        85
    ziyanghua  
       4 天前
    填 4 年前自己挖的坑,真好。已 start 支持一下。
    GooogIe
        86
    GooogIe  
       4 天前
    挺好的创意,已 star
    kepenj
        87
    kepenj  
       4 天前
    给行动力点个赞
    ygtq
        88
    ygtq  
       4 天前
    网页收藏夹应用。你可以把平时喜欢的网站都收藏进去,支持跨设备同步。无论你在电脑、手机还是平板上,彼此访问设备间的数据

    这个我没懂,那意思是不用服务器但是我家里的电脑得一直开着才行么? 不然我晚上家里电脑收藏了一个网站,然后睡觉关机,白天地铁上我手机里怎么再找到这个收藏的网站呢?
    Cereal
        89
    Cereal  
       4 天前
    @pikay #45 安卓机也不成功,电脑上传或者手机上传文件后,点击 connect 不能显示演示中的 local 文件夹,显示的是用户不能发现
    Greendays
        90
    Greendays  
       4 天前
    界面还是挺好看的。是不是比较适合做 NAS 的一个 UI ?
    weixind
        91
    weixind  
       4 天前   ❤️ 1
    个人感觉,没必要戴着浏览器这个镣铐跳舞。给行动力点个赞
    NeedforV2
        92
    NeedforV2  
       4 天前
    挺好玩的,赞一个!
    xxdw8
        93
    xxdw8  
       4 天前
    有行动力,支持
    niub
        94
    niub  
       4 天前
    非常棒👍,这个项目也给了我一些启发
    ssh
        95
    ssh  
       4 天前   ❤️ 1
    开源的,这应该算是分享创造吧 @livid
    Elliota
        96
    Elliota  
       3 天前
    有点意思
    anwhboywj520
        97
    anwhboywj520  
       3 天前
    有点意思,ui 很好看。已 star
    andyskaura
        98
    andyskaura  
       3 天前
    巧了 我也有用 File System API +webrtc 做了一个文件同步工具。感觉有了 webrtc ,web 可玩性高了很多。
    https://explorer.kuraa.cc/#/
    Livid
        99
    Livid  
    MOD
       3 天前
    @ssh 已经移动到 /go/create
    yun33133
        100
    yun33133  
       3 天前
    不错 很有想法
    1  2  
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5802 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 02:34 · PVG 10:34 · LAX 19:34 · JFK 22:34
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.